优化搭销会员处理页面

src/views/task/unprocessed.vue

@@ -48,15 +48,15 @@
     <el-dialog
       :title="title"
       :visible.sync="open"
-      width="40%"
+      width="45%"
       append-to-body
     >
       <el-form ref="form" :model="form" :rules="rules" label-width="100px">
         <!-- 处理类型选择 -->
         <el-form-item label="处理方式" prop="handleType">
           <el-radio-group v-model="form.handleType" @change="onProcessTypeChange">
-            <el-radio label=1>签收</el-radio>
-            <el-radio label=2>设置提醒时间</el-radio>
+            <el-radio :label="1">签收</el-radio>
+            <el-radio :label="2">设置提醒时间</el-radio>
           </el-radio-group>
         </el-form-item>
 
@@ -86,21 +86,26 @@
               @row-click="(row) => form.selectedOrderNo = row.orderCode"
               :row-key="row => row.orderId"
             >
-            <!-- 手动单选列 - 优化：只显示单选按钮，隐藏文本 -->
-            <el-table-column label="选择" width="60" align="center">
-              <template slot-scope="scope">
-                <el-radio
-                  v-model="form.selectedOrderNo"
-                  :label="scope.row.orderCode"
-                  :key="scope.row.orderCode"
-                  @change="() => {}"
-                />
-              </template>
-            </el-table-column>
-            <el-table-column prop="orderCode" label="订单号" width="160" />
-            <el-table-column prop="createTime" label="创建时间" width="100" />
-            <el-table-column prop="packageName" label="商品" width="100" />
-            <el-table-column prop="status" label="状态" />
+              <el-table-column label="选择" width="60" align="center">
+                <template slot-scope="scope">
+                  <el-radio
+                    v-model="form.selectedOrderNo"
+                    :label="scope.row.orderCode"
+                    :key="scope.row.orderCode"
+                    class-name="custom-radio"
+                  >
+                    <span></span>
+                  </el-radio>
+                </template>
+              </el-table-column>
+              <el-table-column prop="orderCode" label="订单号" width="180" />
+              <el-table-column prop="createTime" label="创建时间" width="160" />
+              <el-table-column prop="packageName" label="商品" width="160" />
+              <el-table-column prop="status" label="状态" width="100">
+                <template slot-scope="scope">
+                  <span>{{ formatOrderStatus(scope.row.status) }}</span>
+                </template>
+              </el-table-column>
             </el-table>
             <!-- 添加加载状态指示 -->
             <div v-if="orderLoading" style="text-align: center; padding: 10px;">
@@ -187,7 +192,7 @@ export default {
       form: {
         id: null,
         handleType: 1,
-        sendDays: null, // 改名
+        sendDays: null,
         remark: '',
         selectedOrderNo: '',
         doctorMemberSalesId: null
@@ -200,10 +205,10 @@ export default {
       orderSearched: false,
       orderLoading: false, // 添加加载状态
 
-      // 表单校验规则（可选增强）
+      // 表单校验规则
       rules: {
         handleType: [{ required: true, message: '请选择处理方式', trigger: 'change' }],
-        sendDays: [ // 校验规则改名
+        sendDays: [
           { required: true, message: '请输入提醒天数', trigger: 'blur' },
           { type: 'number', min: 1, max: 99, message: '天数必须在 1 到 99 之间', trigger: 'blur' }
         ],
@@ -239,7 +244,7 @@ export default {
       this.form = {
         id: null,
         handleType: 1,
-        sendDays: null, // 改名
+        sendDays: null,
         remark: '',
         selectedOrderNo: '',
         doctorMemberSalesId: null
@@ -247,7 +252,7 @@ export default {
       this.orderSearchKeyword = '';
       this.orderList = [];
       this.orderSearched = false;
-      this.orderLoading = false; // 重置加载状态
+      this.orderLoading = false;
     },
     /** 搜索按钮操作 */
     handleQuery() {
@@ -298,7 +303,7 @@ export default {
     handleUpdate(row) {
       this.form = {
         id: row.id,
-        handleType: 1,
+        handleType: 1, // 设置为数字1
         sendDays: null,
         remark: '',
         selectedOrderNo: '',
@@ -309,8 +314,8 @@ export default {
       this.orderList = [];
       this.selectedOrder = null;
       this.orderSearched = false;
-      this.orderLoading = false; // 确保打开对话框时加载状态为 false
-      // 默认加载该用户的未签收订单
+      this.orderLoading = false;
+      // 默认加载该用户的未签收的订单
       this.searchOrders();
       this.open = true;
       this.title = "处理医生会员搭销";
@@ -318,7 +323,7 @@ export default {
     /** 切换处理类型时重置相关字段 */
     onProcessTypeChange(val) {
       if (val == 1) {
-        this.form.sendDays = null; // 改名
+        this.form.sendDays = null;
         this.form.selectedOrderNo = '';
         // 切换到签收时，重新加载订单列表
         this.searchOrders();
@@ -327,20 +332,18 @@ export default {
       }
     },
 
-    /** 搜索订单（调用真实接口） */
+    /** 搜索订单*/
     searchOrders() {
-      // 构建搜索参数，可能包含关键字
+      // 构建搜索参数
       const keyword = this.orderSearchKeyword.trim();
       // 设置加载状态
       this.orderLoading = true;
-      this.orderSearched = true; // 标记已执行过搜索操作
-      console.log("当前会员id："+this.fsUserId)
+      this.orderSearched = true;
       // 调用API
-      getNoReceiveOrderList(this.fsUserId) // 使用实例上的 fsUserId
+      getNoReceiveOrderList(this.fsUserId)
         .then(response => {
-          let orders = response.data || []; // 获取订单列表
+          let orders = response.data || [];
 
-          // 如果有搜索关键词，则在前端进行过滤
           if (keyword) {
             orders = orders.filter(item => item.orderCode && item.orderCode.includes(keyword));
           }
@@ -351,13 +354,25 @@ export default {
         .catch(error => {
           console.error('获取订单列表失败:', error);
           this.$message.error('获取订单列表失败，请稍后重试');
-          this.orderList = []; // 出错时清空列表
+          this.orderList = [];
         })
         .finally(() => {
-          // 无论成功与否，都要关闭加载状态
           this.orderLoading = false;
         });
     },
+    /**
+     * 格式化订单状态数字为文本
+     */
+    formatOrderStatus(status) {
+      switch (status) {
+        case 3:
+          return '待收货';
+        case 4:
+          return '待评价';
+        default:
+          return '未知状态';
+      }
+    },
 
     /** 提交处理 */
     submitForm() {
@@ -378,12 +393,10 @@ export default {
           }
           submitData.orderCode = this.form.selectedOrderNo;
         } else if (submitData.handleType === 2) {
-          // 注意：这里校验的是 form.sendDays，因为 rules 是针对 form 的
           if (this.form.sendDays === null || this.form.sendDays === undefined) {
             this.$message.warning('请先填写提醒天数');
             return;
           }
-          // 提交时发送数字类型的 sendDays
           submitData.sendDays = Number(this.form.sendDays);
         }
         submitDoctorTask(submitData).then(() => {
@@ -399,3 +412,10 @@ export default {
   }
 };
 </script>
+
+<style scoped>
+/*隐藏单选框的文本，可以添加这个样式 */
+.custom-radio ::v-deep .el-radio__label {
+  display: none;
+}
+</style>