feat 外卖设置页面

src/components/settingComponents/voiceSetting.vue

@@ -11,16 +11,6 @@
       </div>
       <div class="top-set">
         <div class="t-left">
-          自动配送
-          <span @click="openSetTime">[时长设置]</span>
-        </div>
-        <div class="t-right">
-          <span>默认下单{{autodeliveryOrderTime}}分钟后</span>
-          <el-switch @change="autodelivery" v-model="openAutodelivery" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
-        </div>
-      </div>
-      <div class="top-set">
-        <div class="t-left">
           自动打印
           <span style="color: #999;">(开启后将为您自动打印小票)</span>
         </div>
@@ -36,28 +26,20 @@
         </div>
         <div class="voice-list">
           <el-row>
-            <el-col :span="24">
-              <div class="item">
-                <div class="left">
-                  <span>即时单自动发单</span>
-                </div>
-                <div class="right">
-                  <el-switch @change="autodelivery" v-model="openAutodelivery" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
-                </div>
-              </div>
-            </el-col>
-            <el-col :span="24">
+            <el-col :span="24" v-for="(v,i) in list1" :key="i">
               <div class="item">
                 <div class="left">
-                  <span>预定单自动发单</span>
+                  <span class="name">{{v.name}}</span>
+                  <span class="time" @click="openSetTime(v,i)">[时长设置]</span>
                 </div>
                 <div class="right">
-                  <el-switch @change="changetemp2" v-model="modeltemp2" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
+                  <span @click="openSetTime(v)" v-if="!i">顾客下单{{autodeliveryOrderTime}}分钟后</span>
+                  <span @click="openSetTime(v)" v-if="i===1">期望送达前{{bookingAutodeliveryOrderTime}}分钟</span>
+                  <el-switch @change="change(v)" v-model="v.value" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
                 </div>
               </div>
             </el-col>
           </el-row>
-
         </div>
       </div>
       <div class="voice-content">
@@ -65,55 +47,22 @@
           <div class="t-left">
             同步设置
           </div>
-
         </div>
         <div class="voice-list">
           <el-row>
-            <el-col :span="24">
-              <div class="item">
-                <div class="left">
-                  <span>同步订单给骑手</span>
-                </div>
-                <div class="right">
-                  <el-switch @change="autodelivery" v-model="openAutodelivery" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
-                </div>
-              </div>
-            </el-col>
-            <el-col :span="24">
-              <div class="item">
-                <div class="left">
-                  <span>同步外卖订单备注给骑手</span>
-                </div>
-                <div class="right">
-                  <el-switch @change="changetemp2" v-model="modeltemp2" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
-                </div>
-              </div>
-            </el-col>
-            <el-col :span="24">
+            <el-col :span="24" v-for="(v,i) in list" :key="i">
               <div class="item">
                 <div class="left">
-                  <span>同步商家备注给骑手</span>
+                  <span class="name">{{v.name}}</span>
                 </div>
                 <div class="right">
-                  <el-switch @change="changetemp2" v-model="modeltemp2" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
-                </div>
-              </div>
-            </el-col>
-            <el-col :span="24">
-              <div class="item">
-                <div class="left">
-                  <span>订单详情显示出图片</span>
-                </div>
-                <div class="right">
-                  <el-switch @change="changetemp2" v-model="modeltemp2" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
+                  <el-switch @change="change(v)" v-model="v.value" :active-value="1" :inactive-value="0" active-color="#FC7200" inactive-color="#999" />
                 </div>
               </div>
             </el-col>
           </el-row>
-
         </div>
       </div>
-
     </template>
     <div class="voice-content">
       <div class="top-set" style="border-bottom: 1px solid #eee;">
@@ -141,19 +90,13 @@
         </el-row>
       </div>
     </div>
-    <!-- // 选择自动配送运力 -->
-    <el-dialog title="自动配送设置" @close="getConfig" :visible.sync="centerDialogVisible" width="800px" center>
+    <el-dialog :title="!curIndex ? '即时单自动发单时间设置' : '预定单自动发单时间设置'" @close="getConfig" :visible.sync="centerDialogVisible" width="800px" center>
       <el-form label-width="120px">
-        <el-form-item label="自动接单时间">
-          <el-input size="small" class="auto-time" v-model="autodeliveryOrderTime" clearable>
-            <template slot="append">分钟</template>
+        <el-form-item :label="!curIndex ? '顾客下单' : '期望送达前'">
+          <el-input size="small" class="auto-time" v-model="time" clearable>
+            <template slot="append">分钟{{curIndex ? '' : '后'}}</template>
           </el-input>
         </el-form-item>
-        <!-- <el-form-item label="自动配送运力">
-          <el-checkbox-group v-model="autodeliveryIds">
-            <el-checkbox :label="String(v.deliveryId)" name="type" v-for="(v,i) in deliveryList" :key="i">{{v.name}}</el-checkbox>
-          </el-checkbox-group>
-        </el-form-item> -->
       </el-form>
       <span slot="footer" class="dialog-footer">
         <el-button size="medium" @click="getConfig">取 消</el-button>
@@ -175,16 +118,44 @@ export default {
   data() {
     return {
       voiceList: [],
-      openAutodelivery: 0,
       openAutoorder: 0,
       openPrintSwitch: 0,
       autodeliveryOrderTime: 0,
+      bookingAutodeliveryOrderTime: 0,
+      time: 0,
       msasterSwitch: 1,
       centerDialogVisible: false,
-      // autodeliveryIds: [],
-      deliveryList: [], // 运力列表
-      deliveryIdList: [],
       memberType: this.$store.state.userInfo.memberType,
+      list: [
+        {
+          name: "同步订单商品给骑手",
+          value: 1,
+          field: "syncGoodsDetailToDelivery",
+        },
+        {
+          name: "同步打印客户联商品明细",
+          value: 1,
+          field: "customerLinkPrintGoodsDetail",
+        },
+        {
+          name: "同步打印客户联商品价格",
+          value: 1,
+          field: "customerLinkPrintGoodsPrice",
+        },
+      ],
+      curIndex: 0,
+      list1: [
+        {
+          name: "即时单自动发单",
+          value: 1,
+          field: "openAutodelivery",
+        },
+        {
+          name: "预定单自动发单",
+          value: 1,
+          field: "openBookingAutodelivery",
+        },
+      ],
     };
   },
   watch: {
@@ -198,18 +169,38 @@ export default {
   created() {
     this.getConfig();
     this.queryPushMessageStatus();
-    // this.floorListDelivery();
   },
   methods: {
-    openSetTime() {
-      if (this.openAutodelivery) {
-        this.centerDialogVisible = true;
-      } else {
-        this.$message({
+    change(e) {
+      console.log(e);
+      updateConfig({
+        [e.field]: e.value,
+      }).then((res) => {
+        if (res.code === 200) {
+          this.getConfig();
+        } else {
+          e.value = !e.value;
+          this.$message({
+            type: "error",
+            message: res.msg,
+          });
+        }
+      });
+    },
+    openSetTime(v, i) {
+      if (!v.value) {
+        return this.$message({
           type: "info",
           message: "请先开启自动配送再设置时长！",
         });
       }
+      this.curIndex = i;
+      if (!i) {
+        this.time = this.autodeliveryOrderTime;
+      } else if (i === 1) {
+        this.time = this.bookingAutodeliveryOrderTime;
+      }
+      this.centerDialogVisible = true;
     },
     play(index) {
       let src = "https://pc.liebaoai.cn/audio/alone.mp3";
@@ -249,30 +240,15 @@ export default {
       mp3.play(); //播放 mp3这个音频对象
     },
     confirm() {
-      // if (!this.autodeliveryIds.length) {
-      //   return this.$message({
-      //     type: "error",
-      //     message: "开启自动配送必须选择至少一个运力平台！",
-      //   });
-      // }
       this.centerDialogVisible = true;
-      this.updateConfig();
+      let data = {};
+      if (!this.curIndex) {
+        data = { autodeliveryOrderTime: this.time * 60 };
+      } else if (this.curIndex === 1) {
+        data = { bookingAutodeliveryOrderTime: this.time * 60 };
+      }
+      this.updateConfig(data);
     },
-    // floorListDelivery() {
-    //   floorListDelivery().then((res) => {
-    //     if (res.code === 200) {
-    //       this.deliveryList = res.data;
-    //       this.deliveryIdList = this.deliveryList.map((v) => {
-    //         return String(v.deliveryId);
-    //       });
-    //     } else {
-    //       this.$message({
-    //         type: "error",
-    //         message: res.msg,
-    //       });
-    //     }
-    //   });
-    // },
     changeMessageStatus() {
       this.voiceList = this.voiceList.map((v) => {
         v.msasterSwitch = this.msasterSwitch;
@@ -285,12 +261,14 @@ export default {
       getConfig().then((res) => {
         if (res.code === 200) {
           this.autodeliveryOrderTime = res.data.autodeliveryOrderTime / 60;
-          this.openAutodelivery = res.data.openAutodelivery;
+          this.bookingAutodeliveryOrderTime =
+            res.data.bookingAutodeliveryOrderTime / 60;
           this.openAutoorder = res.data.openAutoorder;
           this.openPrintSwitch = res.data.openPrintSwitch;
-          // this.autodeliveryIds = res.data.autodeliveryIds
-          //   ? res.data.autodeliveryIds.split(",")
-          //   : [];
+          this.list = this.list.map((v) => {
+            v.value = res.data[v.field];
+            return v;
+          });
         } else {
           this.$message({
             type: "error",
@@ -329,30 +307,9 @@ export default {
         }
       );
     },
-    autodelivery() {
-      if (this.openAutodelivery === 1) {
-        this.centerDialogVisible = true;
-        // this.autodeliveryIds = this.deliveryIdList
-      } else {
-        // this.autodeliveryIds = "";
-        this.autodeliveryOrderTime = 5;
-        this.updateConfig();
-      }
-    },
-    updateConfig() {
-      let params = {
-        autodeliveryOrderTime: this.autodeliveryOrderTime * 60,
-        // autodeliveryIds: this.autodeliveryIds.toString(),
-        openAutodelivery: this.openAutodelivery,
-        openAutoorder: this.openAutoorder,
-        openPrintSwitch: this.openPrintSwitch,
-      };
-      updateConfig(params).then((res) => {
+    updateConfig(data) {
+      updateConfig(data).then((res) => {
         if (res.code === 200) {
-          this.$message({
-            type: "success",
-            message: "修改成功！",
-          });
           this.getConfig();
         } else {
           this.$message({
@@ -390,7 +347,7 @@ export default {
     .t-left {
       font-size: 16px;
       font-family: PingFang SC;
-      font-weight: 600;
+      font-weight: bold;
       color: #333333;
       span {
         cursor: pointer;
@@ -419,6 +376,16 @@ export default {
         .left {
           display: flex;
           align-items: center;
+          .name {
+            font-size: 14px;
+            // font-weight: bold;
+          }
+          .time {
+            margin-left: 10px;
+            font-size: 12px;
+            color: #175199;
+            cursor: pointer;
+          }
           .voice-icon {
             width: 15px;
             height: 12px;
@@ -433,6 +400,12 @@ export default {
             color: #333333;
           }
         }
+        .right {
+          display: flex;
+          align-items: center;
+          font-size: 14px;
+          color: #999999;
+        }
       }
     }
   }