Ver Fonte

feat: 修改

Moss há 1 ano atrás
pai
commit
54960c4e22
3 ficheiros alterados com 113 adições e 6 exclusões
  1. 103 3
      src/pages/goods/detail.vue
  2. 3 0
      src/pages/mine/address/list.vue
  3. 7 3
      src/styles/iconfont.css

+ 103 - 3
src/pages/goods/detail.vue

@@ -135,7 +135,19 @@
         	height="100">
         </u--textarea>
         <view class="title">上传凭证</view>
-        <zj-upload key="cp" @getFiles="getFiles" :fileList="reportForm.fileList" :count="9" />
+        <!-- <zj-upload key="cp" @getFiles="getFiles" :fileList="reportForm.fileList" :count="9" /> -->
+        <view class="images">
+        	<block v-for="(item, index) in reportForm.fileList" :key='index'>
+        		<view class="img">
+        			<image :src="imageUrl + item.url" mode="aspectFill" @tap="prevImg(item.url)"></image>
+        			<text class="iconfont icon-guanbi1" @tap="delImage(index)"></text>
+        		</view>
+        	</block>
+        	<view class="add" @tap="addImage" v-if="reportForm.fileList.length < 3">
+        		<text class="iconfont icon-xiangji"></text>
+        		<text class="text">点击上传</text>
+        	</view>
+        </view>
       </view>
     </zj-dialog-box>
   </view>
@@ -146,6 +158,7 @@
 	import zjDialogBox from "@/components/zj-dialog/zj-dialog-box.vue";
 	import zjDialogRemark from '@/components/zj-dialog/zj-dialog-remark.vue';
   import zjUpload from '@/components/zj-upload/index.vue'
+import { uploadImg } from '@/common/utils/util.js'
 
   export default {
     components: {
@@ -343,7 +356,8 @@
         this.$api.postJson('/reportGoods/report', {
           goodsId: this.id,
           reportNote: this.reportForm.reason,
-          url: this.reportForm.fileList,
+          url: this.reportForm.fileList.map(item => item.url),
+          
         }).then(res => {
           this.$successToast();
           this.cancelReportDialog();
@@ -395,7 +409,39 @@
             url: `/pages/issue/index`
           }, 'switchTab')
         }
-      }
+      },
+
+      // 添加图片
+      async addImage() {
+      	uni.chooseImage({
+      		count: 3 - this.reportForm.fileList,
+      		sizeType: ['original'],
+      		success: res => {
+      			uni.showLoading();
+      			res.tempFiles.forEach(async item => {
+      				let data = await uploadImg(item);
+      				this.reportForm.fileList.push(data);
+      			});
+      			uni.hideLoading();
+      		},
+      		fail: err => {}
+      	})
+      },
+
+      // 删除图片
+      delImage(index) {
+      	this.reportForm.fileList.splice(index, 1);
+      },
+
+      //预览图片
+      prevImg(current) {
+      	uni.previewImage({
+      		current: this.imageUrl + current,
+      		urls: this.reportForm.fileList.map(item => {
+      			return this.imageUrl + item.url
+      		})
+      	})
+      },
     }
 
   }
@@ -662,6 +708,60 @@
       color: $assist-color;
     }
   }
+  .images {
+  	display: flex;
+  	flex-wrap: wrap;
+  	.add {
+  		display: flex;
+  		flex-direction: column;
+  		align-items: center;
+  		justify-content: center;
+  		width: 180rpx;
+  		height: 180rpx;
+  		border: 2rpx dashed #dadada;
+  		border-radius: 10rpx;
+  		margin-top: 30rpx;
+  		box-sizing: border-box;
+  		.iconfont {
+  			font-size: 48rpx;
+  			color: #999999;
+  		}
+  		.text {
+  			font-size: 22rpx;
+  			color: #999999;
+  			margin-top: 8rpx;
+  		}
+  	}
+  	.img {
+  		position: relative;
+  		margin-right: 30rpx;
+  		margin-top: 30rpx;
+  		&:nth-child(4n) {
+  			margin-right: 0;
+  		}
+  		image {
+  			width: 180rpx;
+  			height: 180rpx;
+  			border-radius: 10rpx;
+  			overflow: hidden;
+  			display: block;
+  		}
+  		text {
+  			position: absolute;
+  			right: -10rpx;
+  			top: -10rpx;
+  			width: 40rpx;
+  			height: 40rpx;
+  			border-radius: 50%;
+  			background: #FF3F42;
+  			font-size: 24rpx;
+  			color: #FFFFFF;
+  			display: flex;
+  			align-items: center;
+  			justify-content: center;
+  		}
+  	}
+  }
 }
 
 .bottom-container {

+ 3 - 0
src/pages/mine/address/list.vue

@@ -101,6 +101,9 @@
               houseNo: '',
             }
             that.$navPage('/pages/mine/address/form?addressData=' + JSON.stringify(params));
+          },
+          fail(res) {
+            console.log(res);
           }
         })
       },

+ 7 - 3
src/styles/iconfont.css

@@ -1,9 +1,9 @@
 /* 在线链接服务仅供平台体验和调试使用,平台不承诺服务的稳定性,企业客户需下载字体包自行发布使用并做好备份。 */
 @font-face {
   font-family: 'iconfont';  /* Project id 4308323 */
-  src: url('https://at.alicdn.com/t/c/font_4308323_2ahynczrz8w.woff2?t=1699010638735') format('woff2'),
-       url('https://at.alicdn.com/t/c/font_4308323_2ahynczrz8w.woff?t=1699010638735') format('woff'),
-       url('https://at.alicdn.com/t/c/font_4308323_2ahynczrz8w.ttf?t=1699010638735') format('truetype');
+  src: url('https://at.alicdn.com/t/c/font_4308323_dmtu4i5zp24.woff2?t=1699092342414') format('woff2'),
+       url('https://at.alicdn.com/t/c/font_4308323_dmtu4i5zp24.woff?t=1699092342414') format('woff'),
+       url('https://at.alicdn.com/t/c/font_4308323_dmtu4i5zp24.ttf?t=1699092342414') format('truetype');
 }
 
 .iconfont {
@@ -14,6 +14,10 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-guanbi1:before {
+  content: "\e903";
+}
+
 .icon-daifukuan:before {
   content: "\e604";
 }