|
| xqd
@@ -1,144 +0,0 @@
|
|
|
-<template>
|
|
|
- <view>
|
|
|
- <view style="color: #fff;">
|
|
|
- <tn-nav-bar backgroundColor="#26B3A0" :bottomShadow="false">绘画记录</tn-nav-bar>
|
|
|
- </view>
|
|
|
- <z-paging ref="paging" refresher-complete-delay="200" v-model="drawList" @query="queryList">
|
|
|
- <view slot="top" class="z_tabs" :style="{ marginTop: tobheight + 'px' }"></view>
|
|
|
-
|
|
|
- <view class="u-flex flex-wrap">
|
|
|
- <block v-for="(item,index) in drawList" :key="index">
|
|
|
- <view @click="preview(index)" class="draw_view">
|
|
|
- <image :src="item.path" mode="aspectFill"></image>
|
|
|
- <view class="prompt">{{item.prompt}}</view>
|
|
|
- <view class="circle" @click.stop="gallerydel(index)">
|
|
|
- <u-icon name="close-circle-fill" color="#e83a30" size="24"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </block>
|
|
|
- <!-- <view class="draw_view">
|
|
|
- <image src="https://yijian-painting-prod.cdn.bcebos.com/content/766556a3c73e28803cf28e30d06b88e0/85aa8a0e-e4d3-40c0-8a4d-38c21e8dfd2e.jpg" mode="aspectFill"></image>
|
|
|
- <view class="">画一碗猪脚面</view>
|
|
|
- </view>
|
|
|
- <view class="draw_view">
|
|
|
- <image src="https://yijian-painting-prod.cdn.bcebos.com/content/766556a3c73e28803cf28e30d06b88e0/85aa8a0e-e4d3-40c0-8a4d-38c21e8dfd2e.jpg" mode="aspectFill"></image>
|
|
|
- <view class="">画一碗猪脚面</view>
|
|
|
- </view>
|
|
|
- <view class="draw_view">
|
|
|
- <image src="https://yijian-painting-prod.cdn.bcebos.com/content/766556a3c73e28803cf28e30d06b88e0/85aa8a0e-e4d3-40c0-8a4d-38c21e8dfd2e.jpg" mode="aspectFill"></image>
|
|
|
- <view class="">画一碗猪脚面</view>
|
|
|
- </view> -->
|
|
|
- </view>
|
|
|
-
|
|
|
- </z-paging>
|
|
|
- <wike-loading-page :isLoading="isLoading"></wike-loading-page>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import { mapMutations, mapActions, mapState, mapGetters } from 'vuex';
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- tobheight: 45,
|
|
|
- platform: this.$platform.get(),
|
|
|
- isLoading: true,
|
|
|
- drawList:[]
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
- ...mapGetters(['appInfo', 'userInfo', 'isLogin'])
|
|
|
- },
|
|
|
- onLoad() {
|
|
|
- const that = this;
|
|
|
- if (this.platform == 'wxMiniProgram') {
|
|
|
- var menumtop = uni.getMenuButtonBoundingClientRect().top - uni.getSystemInfoSync().statusBarHeight;
|
|
|
- var paddingtop = uni.getSystemInfoSync().statusBarHeight + menumtop;
|
|
|
- this.tobheight = menumtop + paddingtop + uni.getMenuButtonBoundingClientRect().height;
|
|
|
- }
|
|
|
-
|
|
|
- },
|
|
|
- methods: {
|
|
|
- queryList(pageNo, pageSize) {
|
|
|
- //这里的pageNo和pageSize会自动计算好，直接传给服务器即可
|
|
|
- const params = {
|
|
|
- page: pageNo,
|
|
|
- limit: pageSize
|
|
|
- };
|
|
|
- this.$http('gallery.list', params).then(res => {
|
|
|
- if (res.code == 0) {
|
|
|
- uni.setNavigationBarTitle({
|
|
|
- title: this.appInfo.site_name
|
|
|
- });
|
|
|
- this.$refs.paging.complete(res.data.data);
|
|
|
- this.isLoading = false;
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- preview(e){
|
|
|
- uni.previewImage({
|
|
|
- urls: [this.drawList[e].path],
|
|
|
-
|
|
|
- });
|
|
|
- },
|
|
|
- gallerydel(e){
|
|
|
- var that = this;
|
|
|
- uni.showModal({
|
|
|
- confirmText: '删除',
|
|
|
- content: '是否删除此绘画记录',
|
|
|
- title: '提示',
|
|
|
- confirmColor: '#26B3A0',
|
|
|
- success(res) {
|
|
|
- // console.log(res);
|
|
|
- if (res.confirm) {
|
|
|
- that.$http('gallery.del', {id:that.drawList[e].id}).then(res => {
|
|
|
- if (res.code == 0) {
|
|
|
- uni.showToast({
|
|
|
- title:'删除成功'
|
|
|
- })
|
|
|
- // that.drawList = []
|
|
|
- that.$refs.paging.reload(true);
|
|
|
- }else{
|
|
|
- uni.showToast({
|
|
|
- title:'删除失败',
|
|
|
- icon:'none'
|
|
|
- })
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- })
|
|
|
-
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</script>
|
|
|
-
|
|
|
-<style lang="scss">
|
|
|
- page {
|
|
|
- background: #f6f7fb;
|
|
|
- }
|
|
|
-.draw_view{
|
|
|
- margin: 30rpx;
|
|
|
- width: 100%;
|
|
|
- background: #fff;
|
|
|
- border-radius: 0 0 20rpx 20rpx;
|
|
|
- // padding: 30rpx;
|
|
|
- position: relative;
|
|
|
- image{
|
|
|
- width: 100%;
|
|
|
- height: 280rpx;
|
|
|
- border-radius: 20rpx 20rpx 0 0;
|
|
|
- }
|
|
|
- .prompt{
|
|
|
- padding: 20rpx 30rpx 30rpx;
|
|
|
- }
|
|
|
- .circle{
|
|
|
- position: absolute;
|
|
|
- right: -12rpx;
|
|
|
- top: -12rpx;
|
|
|
- background: #fff;
|
|
|
- border-radius: 50%;
|
|
|
- }
|
|
|
-}
|
|
|
-</style>
|
