ytj

config/index.js

     proxyTable: {
       '/api': {
         // target: 'https://dp.huiju360.com.cn/hj_operations',
-        // target: 'http://192.168.0.62:8080', //wf
-        target: 'http://192.168.0.11', //ys
+        target: 'http://192.168.0.62:8080', //wf
+        // target: 'http://192.168.0.11', //ys
         // target: 'http://dev.ycjcjy.com/', //frp
         changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
         // pathRewrite: {

src/pages/system/newOrder/newOrderList/index.vue

     <div class="system-table-search">
       <div class="flex-h">
         <div class="flex-item flex-h">
-          <el-button size="mini" type="danger">营业</el-button>
+          <el-button size="mini" v-if="!businessStatus" type="danger" @click="open">营业</el-button>
+          <el-button size="mini" v-else type="submit" @click="close">歇业</el-button>
         </div>
         <ul>
           <li>
-            <!-- <span>选择案场：</span> -->
-            <el-select v-model="CaseId" placeholder="请选择">
+            <el-select v-model="caseid" placeholder="请选择案场">
               <el-option
                 v-for="item in cases"
                 :key="item.CaseId"
         </ul>
         <el-button
           size="mini"
-          type="primary" @click="GetOrdersList({ caseid: CaseId })">搜索</el-button>
+          type="primary" @click="init">搜索</el-button>
       </div>
       <div class="moreFilter"></div>
     </div>
             <div style="display:flex;justify-content: space-between;align-items: center;"><span>{{item1.GoodsName}}</span><span style="display:inline-block;width:20%;text-align:right" v-if='!item1.SpecName'>x {{item1.Number}}</span></div>
             <div style="margin-top:8px;" v-if='item1.SpecName'>
               <span style="display:inline-block;width:75%;text-align:left;color:#cccccc">{{item1.SpecName}}</span>
-              <span style="display:inline-block;width:20%;text-align:right">x {{item1.Number}}</span>
+              <span style="display:inline-block;width:20%;text-align:right">× {{item1.Number}}</span>
             </div>
           </div>
           <div style="padding:10px 20px;border-bottom:1px solid #cccccc">备注：{{item.Remark}}</div>
               <img class="topIcon" style="display:block;width:60%;margin:0 0 20px 10px;" src="http://jingcheng-resourceplat.oss-cn-shanghai.aliyuncs.com/upload/111101940020.png" alt="">
               <span style="display:block;font-size:20px;font-weight:700;"> <img width='25px' height="25px" src="http://jingcheng-resourceplat.oss-cn-shanghai.aliyuncs.com/upload/111101940020.png" alt=""> {{item.AreaName}}</span>
               <span style="display:block;margin-top:10px;font-size:12px;">下单时间：{{toolClass.dateFormat(item.CreateDate)}}</span>
-              <span style="display:block;margin-top:10px;font-size:12px;">已等待：<span style="color:red;font-weight:700;">{{leftTimes[item.OrdersId]}}</span></span>
             </div>
           </div>
           <div style="padding:10px 20px 5px;border-bottom:1px solid #cccccc;" v-for='(item1,index1) in item.Goods' :key='index1'>
             <div style="display:flex;justify-content: space-between;align-items: center;"><span>{{item1.GoodsName}}</span><span style="display:inline-block;width:20%;text-align:right" v-if='!item1.SpecName'>x {{item1.Number}}</span></div>
             <div style="margin-top:8px;" v-if='item1.SpecName'>
               <span style="display:inline-block;width:75%;text-align:left;color:#cccccc;font-size:12px;">{{item1.SpecName}}</span>
-              <span style="display:inline-block;width:20%;text-align:right;font-size:12px;">x {{item1.Number}}</span>
+              <span style="display:inline-block;width:20%;text-align:right;font-size:12px;">× {{item1.Number}}</span>
             </div>
           </div>
           <div style="padding:10px 20px;border-bottom:1px solid #cccccc">备注：{{item.Remark}}</div>
-          <div style="padding:10px 20px;">下单人：{{item.UserName}}</div>
         </div>
         <div class="btns">
-          <span @click="cancel">取消</span>
-          <span @click="submit(`item${index}`)">确定</span>
+          <span @click="cancel(item.id)">取消</span>
+          <span @click="submit(item.id)">确定</span>
         </div>
       </div>
     </div>
       },
       currentList: [],
       leftTimes: {},
+      business: false,
+      caseid: '',
+      interval: () => { }
     }
   },
   computed: {
     ...mapOrderState({
       list: x => (x.ordersList || {}).list || [],
+      businessStatus: x => x.businessStatus
     }),
     ...mapState({
       cases: x => x.app.cases.list,
   },
   created () {
     this.updateSystemInfo().then(() => {
-      this.initWebSocket()
-      this.GetOrdersList({ caseid: this.CaseId }).then(() => {
-        setInterval(() => {
+      if (this.caseid) {
+        this.init()
+      }
+    })
+  },
+  methods: {
+    init () {
+      if (!this.caseid) {
+        this.$message({
+          type: 'info',
+          message: '请先选择案场'
+        })
+        return
+      }
+      this.getBusinessStatus(this.caseid)
+      clearInterval(this.interval)
+      this.GetOrdersList({ caseid: this.caseid }).then(() => {
+        if (this.business) {
+          this.initWebSocket()
+        }
+        this.interval = setInterval(() => {
           const now = (new Date()).valueOf()
           this.leftTimes = this.list.reduce((acc, it) => {
             const showDT = now - ((new Date(it.CreateDate)).valueOf())
-
             return { ...acc, [`${it.OrdersId}`]: formatTimeBySeconds(showDT) }
           }, {})
         }, 1000)
       })
-    })
-  },
-  methods: {
+    },
     timeOut (c) {
       let cTime = new Date(c).valueOf()
       let time = new Date().valueOf()
     },
     ...mapOrderActions([
       'GetOrdersList',
+      'openBusiness',
+      'closeBusiness',
+      'checkOrder',
+      'cancelOrder',
+      'getBusinessStatus'
     ]),
     ...mapActions([
       'updateSystemInfo'
     ]),
-    submit (cl) {
+    submit (id) {
       this.$confirm('确定完成此饮品?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       }).then((res) => {
-        this.printPdf(cl)
+        this.checkOrder().then(() => {
+          this.$message({
+            type: 'success',
+            message: '确认订单成功'
+          })
+        })
       }).catch((res) => {
         this.$message({
           type: 'info',
-          message: '已取消'
+          message: '已取消操作'
         })
       })
     },
-    printPdf (cl) {
-      this.CreateOneFormPage(cl)
-      LODOP.PRINT()
-      // LODOP.PREVIEW()
-    },
-    CreateOneFormPage (cl) {
-      LODOP = getLodop()
-      LODOP.PRINT_INIT('订单')
-      LODOP.SET_PRINT_PAGESIZE(3, 480, 40, '')
-      LODOP.ADD_PRINT_HTM(0, 0, document.getElementsByClassName(cl)[0].offsetWidth, document.getElementsByClassName(cl)[0].offsetHeight, document.getElementsByClassName(cl)[0].innerHTML)
-    },
-    cancel () {
+    cancel (id) {
       this.$confirm('确定取消此饮品?', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
         type: 'warning'
       }).then((res) => {
-        // this.cancel()
+        this.cancelOrder().then(() => {
+          this.$message({
+            type: 'success',
+            message: '取消订单成功'
+          })
+        })
       }).catch((res) => {
         this.$message({
           type: 'info',
-          message: '已取消'
+          message: '已取消操作'
         })
       })
     },
+    printPdf (cl) {
+      this.CreateOneFormPage(cl)
+      LODOP.PRINT()
+      // LODOP.PREVIEW()
+    },
+    CreateOneFormPage (cl) {
+      LODOP = getLodop()
+      LODOP.PRINT_INIT('订单')
+      LODOP.SET_PRINT_PAGESIZE(3, 480, 40, '')
+      LODOP.ADD_PRINT_HTM(0, 0, document.getElementsByClassName(cl)[0].offsetWidth, document.getElementsByClassName(cl)[0].offsetHeight, document.getElementsByClassName(cl)[0].innerHTML)
+    },
     initWebSocket () {
       console.log(this.user)
-      let caseid = this.defaultCaseId
+      let caseid = this.caseid
       let id = this.userInfo.UserId
       // const wsuri = `${window.location.origin.replace('http', 'ws')}/api/common/MQ/websocket/${caseid}/${id}`
       const wsuri = `ws://192.168.0.11/api/guest/MQ/websocket/${caseid}/${id}`
     },
     websocketonmessage (e) {
       console.log(e)
-      // const redata = JSON.parse(e.data)
+      let lengthOld = this.list.length
+      let lengthNew = JSON.parse(e.data).data.refreshOnlineGoodsOrders.length
+      let newData = JSON.parse(e.data).data.refreshOnlineGoodsOrders.slice(lengthOld - lengthNew)
       this.list = JSON.parse(e.data).data.refreshOnlineGoodsOrders
+      for (let i = 0; i < newData.length; i++) {
+        let index = newData.indexOf(this.list)
+        this.printPdf(`item${index}`)
+      }
+    },
+    open () {
+      if (!this.caseid) {
+        this.$message({
+          type: 'info',
+          message: '请先选择案场'
+        })
+        return
+      }
+      this.openBusiness(this.caseid)
+    },
+    close () {
+      if (!this.caseid) {
+        this.$message({
+          type: 'info',
+          message: '请先选择案场'
+        })
+        return
+      }
+      this.closeBusiness(this.caseid)
     }
   }
 }

src/pages/system/newOrder/newOrderList/page.scss

   overflow: scroll;
   width: auto;
   height: 600px;
-  display: flex;
-  flex-flow: column wrap;
   margin-top: 10px;
   >div{
     display: inline-block;

src/store/goods/order.js

   state: {
     ordersList: [],
     recordOrders: [],
+    business: false,
+    businessStatus: false
   },
   mutations: {
     updateList (state, payload) {
     updateRecordList (state, payload) {
       state.recordOrders = payload || []
     },
+    updateBusiness (state, data) {
+      state.businessStatus = data
+    }
   },
   actions: {
     GetOrdersList ({ commit }, payload) {
           callback()
         }
       })
+    },
+    openBusiness ({ commit }, caseid) {
+      return new Promise((resolve) => {
+        ajax(api.goodsOrder.openBusiness.url, {
+          method: api.goodsOrder.openBusiness.method,
+          urlData: {
+            caseid
+          }
+        }).then(res => {
+          commit('updateBusiness', true)
+          resolve(res)
+        })
+      })
+    },
+    closeBusiness ({ commit }, caseid) {
+      return new Promise((resolve) => {
+        ajax(api.goodsOrder.closeBusiness.url, {
+          method: api.goodsOrder.closeBusiness.method,
+          urlData: {
+            caseid
+          }
+        }).then(res => {
+          commit('updateBusiness', false)
+          resolve(res)
+        })
+      })
+    },
+    getBusinessStatus ({ commit }, caseid) {
+      return new Promise((resolve) => {
+        ajax(api.goodsOrder.getBusinessStatus.url, {
+          method: api.goodsOrder.getBusinessStatus.method,
+          urlData: {
+            id: caseid
+          }
+        }).then(res => {
+          commit('updateBusiness', res)
+          resolve(res)
+        })
+      })
+    },
+    checkOrder ({ commit }, data) {
+      return new Promise((resolve) => {
+        ajax(api.goodsOrder.checkOrder.url, {
+          method: api.goodsOrder.checkOrder.method
+        }).then(res => {
+          resolve(res)
+        })
+      })
+    },
+    cancelOrder ({ commit }, data) {
+      return new Promise((resolve) => {
+        ajax(api.goodsOrder.cancelOrder.url, {
+          method: api.goodsOrder.cancelOrder.method
+        }).then(res => {
+          resolve(res)
+        })
+      })
     }
   }
 }

src/util/api.js

       method: 'get',
       url: `${baseUrl}${common}/order/goods/record/:id`
     },
+    openBusiness: {
+      method: 'put',
+      url: `${baseUrl}${common}/case/open/:caseid`
+    },
+    closeBusiness: {
+      method: 'put',
+      url: `${baseUrl}${common}/case/close/:caseid`
+    },
+    getBusinessStatus: {
+      method: 'get',
+      url: `${baseUrl}${common}/case/conf/:id`
+    }
   },
   cardManager: {
     viplist: {