批发-新增订单列表修改备注功能

ghsApp/src/admin/home/components/OrderItem.vue

@@ -161,6 +161,7 @@
     <uni-popup ref="morePopup" background-color="#fff" type="center" :animation="true" class="class-popup-style">
       <view class="more-popup-body">
         <view class="text-center"><button class="admin-button-com" @click="openPrintLog(item)">打印时间</button></view>
+        <view class="text-center"><button class="admin-button-com" @click="openRemarkEdit(item)">备注</button></view>
         <block v-if="item.sendStatus == -4 && item.status == 2">
           <view class="text-center"><button class="admin-button-com" @click="callIntraCity(item)">呼叫跑腿</button></view>
         </block>
@@ -182,8 +183,8 @@
     <uni-popup ref="printLogPopup" background-color="#fff" type="center" :animation="true" class="class-popup-style">
       <view class="print-log-popup-body">
         <view class="print-log-sn-box">
-          <view class="print-log-sn-label">打印机编号</view>
-          <view class="print-log-sn-value">{{ printLogData.printSn || '-' }}</view>
+          <text class="print-log-sn-label">打印机编号</text>
+          <text class="print-log-sn-value">{{ printLogData.printSn || '-' }}</text>
         </view>
         <view class="print-log-head">打印时间 / 打印订单ID</view>
         <view class="print-log-list" v-if="printLogData.list && printLogData.list.length">
@@ -199,6 +200,24 @@
       </view>
     </uni-popup>
 
+    <!-- 修改订单备注 -->
+    <uni-popup ref="remarkPopup" background-color="#fff" type="center" :animation="true" class="class-popup-style">
+      <view class="remark-popup-body">
+        <view class="remark-popup-title">备注</view>
+        <textarea
+          class="remark-popup-input"
+          v-model="modifyRemarkText"
+          maxlength="200"
+          placeholder="请填写备注"
+          :show-confirm-bar="false"
+        />
+        <view class="remark-popup-actions">
+          <button class="admin-button-com default remark-popup-btn" @click="closeRemarkPopup">取消</button>
+          <button class="admin-button-com bule remark-popup-btn" @click="confirmRemarkModify">确定</button>
+        </view>
+      </view>
+    </uni-popup>
+
     <!-- 新增物流下单弹窗 -->
     <uni-popup ref="expressAddressRef" background-color="#fff" type="center" :animation="true" class="class-popup-style" :mask-click="false">
       <view class="express-popup-body">
@@ -299,7 +318,7 @@ import { getUserDet } from '@/api/member';
 import { createExpressOrder, cancelExpressOrder as cancelSFExpressOrder } from '@/api/express';
 import { cancelDeliveryOrder } from '@/api/express/delivery';
 import { createCallExpressOrder, cancelCallExpressOrder,getOrderFee } from '@/api/shop/shop-express';
-import { printWlLabel, cloudPrintOrder, getOrderPrintLog } from '@/api/order';
+import { printWlLabel, cloudPrintOrder, getOrderPrintLog, modifyRemarkFn } from '@/api/order';
 import { iconSrc } from '@/utils/iconSrc';
 export default {
   name: 'OrderItem',
@@ -335,7 +354,10 @@ export default {
       receiverName: '',
       receiverMobile: '',
       callExpressData: {sendCost:0,packageNum:1,weight:0},
-      printLogData: { printSn: '', list: [] }
+      printLogData: { printSn: '', list: [] },
+      /** 当前正在编辑备注的订单 */
+      remarkEditItem: null,
+      modifyRemarkText: ''
     };
   },
   mounted() {
@@ -437,6 +459,38 @@ export default {
     closePrintLog() {
       this.$refs.printLogPopup.close();
     },
+    /** 打开备注编辑弹窗 */
+    openRemarkEdit(item) {
+      this.closeMore();
+      this.remarkEditItem = item;
+      this.modifyRemarkText = item.remark || '';
+      this.$refs.remarkPopup.open('center');
+    },
+    closeRemarkPopup() {
+      this.$refs.remarkPopup.close();
+      this.remarkEditItem = null;
+      this.modifyRemarkText = '';
+    },
+    /** 保存订单备注并同步列表展示 */
+    confirmRemarkModify() {
+      const item = this.remarkEditItem;
+      if (!item || !item.id) {
+        return;
+      }
+      const remark = (this.modifyRemarkText || '').trim();
+      uni.showLoading({ title: '保存中...', mask: true });
+      modifyRemarkFn({ id: item.id, remark }).then((res) => {
+        uni.hideLoading();
+        if (res.code == 1) {
+          this.$set(item, 'remark', remark);
+          this.updateFiled({ id: item.id, key: 'remark', value: remark });
+          this.closeRemarkPopup();
+          this.$msg('操作成功');
+        }
+      }).catch(() => {
+        uni.hideLoading();
+      });
+    },
     callIntraCity(item) {
       this.closeMore();
       // this.callExpressData = {
@@ -792,23 +846,27 @@ export default {
 }
 
 .print-log-sn-box {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: center;
   border: 2upx solid #333;
   border-radius: 12upx;
   padding: 24upx 20upx;
-  text-align: center;
   margin-bottom: 30upx;
 }
 
 .print-log-sn-label {
   font-size: 30upx;
   color: #333;
-  margin-bottom: 12upx;
+  flex-shrink: 0;
 }
 
 .print-log-sn-value {
   font-size: 34upx;
   color: #333;
   font-weight: bold;
+  margin-left: 16upx;
 }
 
 .print-log-head {
@@ -856,6 +914,46 @@ export default {
   }
 }
 
+.remark-popup-body {
+  width: 88vw;
+  padding: 40upx 30upx 30upx;
+  box-sizing: border-box;
+}
+
+.remark-popup-title {
+  text-align: center;
+  font-size: 34upx;
+  color: #333333;
+  font-weight: bold;
+  margin-bottom: 30upx;
+}
+
+.remark-popup-input {
+  width: 100%;
+  height: 280upx;
+  padding: 20upx;
+  font-size: 28upx;
+  color: #333333;
+  border: 2upx solid #e0e0e0;
+  border-radius: 8upx;
+  box-sizing: border-box;
+}
+
+.remark-popup-actions {
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+  margin-top: 30upx;
+}
+
+.remark-popup-btn {
+  width: 45%;
+  height: 80upx;
+  line-height: 80upx;
+  margin: 0;
+}
+
 .express-popup-body,
 .call-express-popup-body {
   padding: 40upx 50upx;