remak

src/pages/order/remark.vue

@@ -5,11 +5,10 @@
       <wd-form ref="form" :model="formdata" :rules="rules" class="remake">
         <text class="textarea">{{ shopname }}</text>
         <view class="itemPicker">
-          <view class="item01">
+          <view class="item01" prop="merchantServices">
             <text class="label">评分</text>
             <!-- 评分 -->
             <wd-rate
-              prop="merchantServices"
               v-model="formdata.merchantServices"
               active-color="#ff0000"
               size="50rpx"
@@ -22,19 +21,22 @@
           </view>
         </view>
         <!-- 内容描述 -->
-        <wd-textarea
-          prop="evaluation"
-          v-model="formdata.evaluation"
-          placeholder="亲，分享您的看法，给其他人一个参考哦！"
-        />
+        <view prop="evaluation">
+          <wd-textarea
+            v-model="formdata.evaluation"
+            placeholder="亲，分享您的看法，给其他人一个参考哦！"
+          />
+        </view>
+
         <text class="textarea">上传图片/视频</text>
         <!-- 图片上传 -->
+
         <view class="wdUpload" prop="images">
           <wd-upload
             multiple
             :action="action"
             @change="handleFile"
-            :file-list="fList"
+            :file-list="formdata.images"
             :before-remove="beforeRemove"
             :header="headers"
           ></wd-upload>
@@ -103,21 +105,33 @@ const formdata = reactive<{
  * 表单验证规则
  */
 const rules = {
-  images: [
-    {
-      required: true,
-      message: '请上传图片',
-      validator: (value: any) => {
-        if (value) {
-          console.log('123456');
-        } else {
-          console.log('963852');
-        }
-      },
-    },
-  ],
+  // images: [
+  //   {
+  //     required: true,
+  //     message: '请上传图片',
+  //     validator: (value: any) => {
+  //       if (value.length) {
+  //         console.log('上传成功');
+  //       } else {
+  //         console.log('请上传图片');
+  //       }
+  //     },
+  //   },
+  // ],
   evaluation: [{ required: true, message: '请填写评价内容' }],
-  merchantServices: [{ required: true, message: '请选择商家服务评分' }],
+  // merchantServices: [
+  //   {
+  //     required: true,
+  //     message: '请选择商家服务评分',
+  //     validator: (value: any) => {
+  //       if (value >= 1 && value <= 5) {
+  //         console.log('评分成功');
+  //       } else {
+  //         console.log('请选择评分');
+  //       }
+  //     },
+  //   },
+  // ],
 };
 
 /**
@@ -146,6 +160,7 @@ const handlemerchant = (item: { value: number }) => {
 const fList = ref<any[]>([]);
 function handleFile({ fileList: files }) {
   fList.value = files;
+  formdata.images = files;
 }
 /**
  * 图片地址处理
@@ -170,7 +185,7 @@ const deleteImg = () => {
 /**
  * Release提交
  */
-const handleSubmit = async () => {
+const hdSubmit = async () => {
   await evaluation({
     ...formdata,
     images: proImage(),
@@ -181,19 +196,21 @@ const handleSubmit = async () => {
   });
 };
 
-// const handleSubmit = async () => {
-//   console.log(form.value.validate());
-//   form.value
-//     .validate()
-//     .then(({ valid, errors }) => {
-//       if (valid) {
-//         uToast.info({ msg: '校验通过' });
-//       }
-//     })
-//     .catch((error: any) => {
-//       console.log(error, 'error');
-//     });
-// };
+const handleSubmit = async () => {
+  form.value
+    .validate()
+    .then(({ valid, errors }) => {
+      console.log('valid', errors);
+      if (valid) {
+        // uToast.info({ msg: '校验通过' });
+        console.log('校验通过');
+        hdSubmit();
+      }
+    })
+    .catch((error: any) => {
+      console.log(error, 'error');
+    });
+};
 </script>
 <style lang="scss" scoped>
 .container {
@@ -238,8 +255,9 @@ const handleSubmit = async () => {
     margin-top: 25rpx;
     margin-bottom: 172rpx;
     padding: 20rpx;
+
     :deep(.wd-textarea) {
-      padding: 0 30rpx;
+      padding: 30rpx 0;
     }
 
     .itemPicker {