From 504aa80c9e7b46a316dc32296a913976ce7ddb82 Mon Sep 17 00:00:00 2001
From: YeMingfei666 <1619116647@qq.com>
Date: Sat, 22 Feb 2025 10:00:04 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BB=A3=E5=AE=A2=E4=B8=8B=E5=8D=95=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9=EF=BC=8C=E5=A2=9E=E5=8A=A0=E7=BA=BF=E4=B8=8A=E5=BA=97?=
 =?UTF-8?q?=E9=93=BA=E8=A3=85=E4=BF=AE=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/account/shopExtend.ts                 |  86 +++
 src/assets/icons/Coffee.svg                   |   1 +
 src/assets/icons/postcard.svg                 |   1 +
 src/assets/icons/wallet.svg                   |   1 +
 src/components/Upload/SingleImageUpload.vue   |  17 +-
 src/store/modules/carts.ts                    |  37 +-
 src/utils/websocket.ts                        |  20 +
 src/views/online-shop/index.vue               | 728 +++++++++++++++++-
 .../tool/Instead/components/carts/item.vue    |   9 +-
 .../tool/Instead/components/carts/list.vue    |  11 +-
 src/views/tool/Instead/components/control.vue |  17 +-
 .../Instead/components/dialog-goods-sel.vue   |  24 +-
 .../tool/Instead/components/goods-item.vue    |  12 +-
 .../components/popup-cart-changePrice.vue     | 138 ++++
 .../Instead/components/popup-linshiCai.vue    | 111 +++
 src/views/tool/Instead/index.vue              | 203 ++++-
 16 files changed, 1371 insertions(+), 45 deletions(-)
 create mode 100644 src/api/account/shopExtend.ts
 create mode 100644 src/assets/icons/Coffee.svg
 create mode 100644 src/assets/icons/postcard.svg
 create mode 100644 src/assets/icons/wallet.svg
 create mode 100644 src/views/tool/Instead/components/popup-cart-changePrice.vue
 create mode 100644 src/views/tool/Instead/components/popup-linshiCai.vue

diff --git a/src/api/account/shopExtend.ts b/src/api/account/shopExtend.ts
new file mode 100644
index 0000000..9890a9e
--- /dev/null
+++ b/src/api/account/shopExtend.ts
@@ -0,0 +1,86 @@
+import request from "@/utils/request";
+import { Account_BaseUrl } from "@/api/config";
+const baseURL = Account_BaseUrl + "/admin/shopExtend";
+const API = {
+  get(data: getRequest) {
+    return request<any, ShopExtend>({
+      url: `${baseURL}`,
+      method: "get",
+      params: data
+    });
+  },
+  edit(data: editRequest) {
+    return request({
+      url: `${baseURL}`,
+      method: "put",
+      data: data,
+    });
+  }
+}
+export default API;
+
+export interface getRequest {
+  /**
+   * key名称
+   */
+  autoKey?: string;
+  [property: string]: any;
+}
+
+/**
+ * ShopExtendDTO
+ */
+export interface editRequest {
+  /**
+   * 自增id
+   */
+  autokey: null | string;
+  /**
+   * 值
+   */
+  value: null | string;
+  [property: string]: any;
+}
+
+
+/**
+* 店铺扩展信息 实体类。
+*
+* ShopExtend
+*/
+export interface ShopExtend {
+  /**
+   * 自定义key
+   */
+  autoKey?: null | string;
+  /**
+   * 创建时间
+   */
+  createTime?: null | string;
+  detail?: null | string;
+  /**
+   * 自增id
+   */
+  id?: number | null;
+  /**
+   * 描述
+   */
+  name?: null | string;
+  /**
+   * 商户Id
+   */
+  shopId?: number | null;
+  /**
+   * img:图片；text:文本；
+   */
+  type?: null | string;
+  /**
+   * 更新时间
+   */
+  updateTime?: null | string;
+  /**
+   * 值
+   */
+  value?: null | string;
+  [property: string]: any;
+}
\ No newline at end of file
diff --git a/src/assets/icons/Coffee.svg b/src/assets/icons/Coffee.svg
new file mode 100644
index 0000000..840c2f1
--- /dev/null
+++ b/src/assets/icons/Coffee.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1740188619494" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10600" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M867.360957 146.270357h16.015883c9.141486 0 16.893466 2.925275 23.402204 8.629562a36.565944 36.565944 0 0 1 11.99363 22.232094l25.157369 146.263775a35.980889 35.980889 0 0 1-8.556431 29.179623 34.664515 34.664515 0 0 1-28.009513 13.090608h-55.945894l-44.610451 623.961263a36.346548 36.346548 0 0 1-36.565943 34.298855H253.638158a36.346548 36.346548 0 0 1-36.565943-34.298855L172.461763 365.666019H116.589001a34.664515 34.664515 0 0 1-28.009513-13.16374 35.980889 35.980889 0 0 1-8.55643-29.106491l25.157369-146.263775a36.858471 36.858471 0 0 1 11.993629-22.232094A34.152591 34.152591 0 0 1 140.57626 146.270357h16.015884L148.547636 38.766482c0-10.604124 3.656594-19.74561 10.896651-27.351326A34.445119 34.445119 0 0 1 185.186712 0.006582h652.482699c10.677256 0 19.599346 3.802858 26.839402 11.481706 7.166925 7.605716 10.45786 16.747202 9.726541 27.424458L867.360957 146.270357zM793.058959 146.270357l5.704288-73.131888H225.116722l4.607309 73.131888h563.334928zM166.90374 292.534131h697.020018l-11.408574-73.131887H171.437917L160.029342 292.534131h6.874398z m78.836174 73.131888l42.270231 585.055099h447.93281l42.270231-585.055099H245.593651z" p-id="10601" fill="#000000"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/postcard.svg b/src/assets/icons/postcard.svg
new file mode 100644
index 0000000..273af0b
--- /dev/null
+++ b/src/assets/icons/postcard.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1740188417254" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8262" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M160 224a32 32 0 0 0-32 32v512a32 32 0 0 0 32 32h704a32 32 0 0 0 32-32V256a32 32 0 0 0-32-32z m0-64h704a96 96 0 0 1 96 96v512a96 96 0 0 1-96 96H160a96 96 0 0 1-96-96V256a96 96 0 0 1 96-96" p-id="8263" fill="#000000"></path><path d="M704 320a64 64 0 1 1 0 128 64 64 0 0 1 0-128M288 448h256q32 0 32 32t-32 32H288q-32 0-32-32t32-32m0 128h256q32 0 32 32t-32 32H288q-32 0-32-32t32-32" p-id="8264" fill="#000000"></path></svg>
\ No newline at end of file
diff --git a/src/assets/icons/wallet.svg b/src/assets/icons/wallet.svg
new file mode 100644
index 0000000..a3043e4
--- /dev/null
+++ b/src/assets/icons/wallet.svg
@@ -0,0 +1 @@
+<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1740188698469" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="11697" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M640 288h-64V128H128v704h384v32c0 9.344 2.986667 17.024 8.96 23.04 6.016 5.973333 13.696 8.96 23.04 8.96H96a31.146667 31.146667 0 0 1-23.04-8.96 31.146667 31.146667 0 0 1-8.96-23.04v-768a31.146667 31.146667 0 0 1 8.96-23.04 31.146667 31.146667 0 0 1 23.04-8.96h512a31.146667 31.146667 0 0 1 23.04 8.96c5.973333 6.016 8.96 13.696 8.96 23.04v192zM128 320v512h768v-512H128zM96 256h832a31.146667 31.146667 0 0 1 23.04 8.96c5.973333 6.016 8.96 13.696 8.96 23.04v576a31.146667 31.146667 0 0 1-8.96 23.04 31.146667 31.146667 0 0 1-23.04 8.96H96a31.146667 31.146667 0 0 1-23.04-8.96 31.146667 31.146667 0 0 1-8.96-23.04V288a31.146667 31.146667 0 0 1 8.96-23.04 31.146667 31.146667 0 0 1 23.04-8.96z m608 384a64.512 64.512 0 0 1-45.013333-18.986667 61.226667 61.226667 0 0 1-18.005334-45.013333c0-17.962667 5.973333-32.981333 18.005334-45.013333a61.098667 61.098667 0 0 1 45.013333-18.005334c17.962667 0 32.981333 6.016 45.013333 18.005334 12.032 12.032 18.005333 27.008 18.005334 45.013333 0 17.962667-6.058667 32.981333-18.005334 45.013333-12.032 11.989333-27.008 18.346667-45.013333 18.986667z" fill="#000000" fill-opacity=".96" p-id="11698"></path></svg>
\ No newline at end of file
diff --git a/src/components/Upload/SingleImageUpload.vue b/src/components/Upload/SingleImageUpload.vue
index 5546777..7adb11e 100644
--- a/src/components/Upload/SingleImageUpload.vue
+++ b/src/components/Upload/SingleImageUpload.vue
@@ -1,8 +1,17 @@
 <!-- 单图上传组件 -->
 <template>
-  <el-upload v-model="modelValue" class="single-upload" list-type="picture-card" :show-file-list="false"
-    :accept="props.accept" :before-upload="handleBeforeUpload" :http-request="handleUpload" :on-success="onSuccess"
-    :on-error="onError" multiple>
+  <el-upload
+    v-model="modelValue"
+    class="single-upload"
+    list-type="picture-card"
+    :show-file-list="false"
+    :accept="props.accept"
+    :before-upload="handleBeforeUpload"
+    :http-request="handleUpload"
+    :on-success="onSuccess"
+    :on-error="onError"
+    multiple
+  >
     <template #default>
       <el-image v-if="modelValue" :src="modelValue" />
       <el-icon v-if="modelValue" class="single-upload__delete-btn" @click.stop="handleDelete">
@@ -138,6 +147,7 @@ function handleDelete() {
   modelValue.value = "";
 }
 
+const emits = defineEmits(["onSuccess"]);
 /**
  * 上传成功回调
  *
@@ -146,6 +156,7 @@ function handleDelete() {
 const onSuccess = (fileInfo: string) => {
   ElMessage.success("上传成功");
   modelValue.value = fileInfo;
+  emits("onSuccess", fileInfo);
 };
 
 /**
diff --git a/src/store/modules/carts.ts b/src/store/modules/carts.ts
index e2a41d7..760ca5a 100644
--- a/src/store/modules/carts.ts
+++ b/src/store/modules/carts.ts
@@ -7,6 +7,9 @@ export interface CartsState {
 }
 
 export const useCartsStore = defineStore("carts", () => {
+  //台桌id
+  const table_code = ref('');
+
   //当前购物车数据
   const list = useStorage<any[]>("carts", []);
   //赠菜
@@ -20,6 +23,10 @@ export const useCartsStore = defineStore("carts", () => {
     id: '',
     number: 0,
   }
+  //购物车是否为空
+  const isEmpty = computed(() => {
+    return list.value.length === 0 && giftList.value.length === 0
+  })
   const selCart = computed(() => {
     if (isSelGift.value) {
       return giftList.value[selListIndex.value] || defaultCart
@@ -43,7 +50,12 @@ export const useCartsStore = defineStore("carts", () => {
   //支付总价
   const payMoney = computed(() => {
     const money = list.value.reduce((acc: number, cur: any) => {
-      return acc + cur.number * cur.salePrice
+      if (cur.is_temporary) {
+        //临时菜
+        return acc + cur.number * (cur.discount_sale_amount)
+      } else {
+        return acc + cur.number * (cur.salePrice)
+      }
     }, 0)
     return money.toFixed(2)
   })
@@ -59,13 +71,13 @@ export const useCartsStore = defineStore("carts", () => {
   })
 
 
-  const table_code = ref('');
   function changeNumber(step: number, item: CartsState) {
     if (item.number * 1 + step <= 0) {
       del(item);
       return;
     }
-    update({ ...item, number: step * 1 });
+    const newNumber = item.number * 1 + step * 1;
+    update({ ...item, number: step * 1, pack_number: newNumber < item.pack_number ? (item.pack_number * 1 + step * 1) : item.pack_number });
   }
 
   function changeSelCart(cart: CartsState) {
@@ -86,6 +98,7 @@ export const useCartsStore = defineStore("carts", () => {
   function add(data: any) {
     sendMessage('add', data);
   }
+
   function del(data: any) {
     sendMessage('del', data);
   }
@@ -94,8 +107,8 @@ export const useCartsStore = defineStore("carts", () => {
     console.log(data);
     sendMessage('edit', data);
   }
-  function updateTag(key: string, val: any) {
-    sendMessage('edit', { ...selCart.value, number: 0, [key]: val });
+  function updateTag(key: string, val: any, cart: CartsState) {
+    sendMessage('edit', { ...cart || selCart.value, number: 0, [key]: val });
   }
   function clear() {
     sendMessage('cleanup', {});
@@ -123,6 +136,9 @@ export const useCartsStore = defineStore("carts", () => {
       if (msg.hasOwnProperty('status') && msg.status != 1) {
         return ElMessage.error(msg.message || '操作失败')
       }
+      if (msg && msg.data && msg.data[0]) {
+        table_code.value = table_code.value ? table_code.value : msg.data[0].table_code
+      }
       // 初始化
       if (msg.operate_type === "manage_init") {
         // 设置单价
@@ -164,6 +180,7 @@ export const useCartsStore = defineStore("carts", () => {
           } else {
             giftList.value[giftIndex] = { ...giftItem, ...newCart }
           }
+          ElMessage.success(msg.message || '修改成功')
           return
         }
         if (!isSelGift.value) {
@@ -175,6 +192,7 @@ export const useCartsStore = defineStore("carts", () => {
           } else {
             list.value[index] = { ...cartItem, ...newCart }
           }
+          ElMessage.success(msg.message || '修改成功')
           return
         }
 
@@ -199,8 +217,11 @@ export const useCartsStore = defineStore("carts", () => {
             return ElMessage.success(msg.message || '删除成功')
           }
         }
-
-
+      }
+      if (msg.operate_type === "manage_cleanup") {
+        list.value = []
+        giftList.value = []
+        table_code.value = ''
       }
       console.log(list.value)
     });
@@ -216,7 +237,7 @@ export const useCartsStore = defineStore("carts", () => {
     del,
     update,
     init,
-    changeNumber,
+    changeNumber, isEmpty,
     selCart, totalNumber,
     changeSelCart, payMoney,
     clear, yiyouhui, giftList
diff --git a/src/utils/websocket.ts b/src/utils/websocket.ts
index da3e637..3a2d7ce 100644
--- a/src/utils/websocket.ts
+++ b/src/utils/websocket.ts
@@ -58,11 +58,23 @@ class WebSocketManager {
     this.client.onopen = () => {
       this.connected = true;
       console.log("WebSocket 连接已建立");
+      ElNotification.success('WebSocket 连接已建立')
       this.sendMessage(this.initParams)
     };
     this.client.onclose = () => {
+      if (!this.connected) {
+        ElMessageBox.alert('WebSocket 连接已断开', 'Title', {
+          // if you want to disable its autofocus
+          // autofocus: false,
+          confirmButtonText: '立即重连',
+          callback: () => {
+            this.sendMessage(this.initParams)
+          },
+        })
+      }
       this.connected = false;
       console.log("WebSocket 连接已断开");
+
     };
     this.client.onerror = (error) => {
       console.error("WebSocket 发生错误:", error);
@@ -71,6 +83,14 @@ class WebSocketManager {
         message: "WebSocket 发生错误",
         type: "error",
       });
+      ElMessageBox.alert('WebSocket 发生错误', 'Title', {
+        // if you want to disable its autofocus
+        // autofocus: false,
+        confirmButtonText: '立即重连',
+        callback: () => {
+          this.sendMessage(this.initParams)
+        },
+      })
     };
     this.client.onmessage = (event) => {
       const message = event.data;
diff --git a/src/views/online-shop/index.vue b/src/views/online-shop/index.vue
index 41a40c8..db64e76 100644
--- a/src/views/online-shop/index.vue
+++ b/src/views/online-shop/index.vue
@@ -1 +1,727 @@
-<template></template>
\ No newline at end of file
+<template>
+  <div class="app-container">
+    <div class="btn_wraps">
+      <div
+        class="btn"
+        :class="{ active: tableActive == item.autoKey }"
+        v-for="item in tableData"
+        :key="item.autoKey"
+        @click="selectItemChange(item.autoKey)"
+      >
+        {{ item.name }}
+      </div>
+    </div>
+    <div class="form">
+      <div class="preview_wrap">
+        <div class="phone_wrap">
+          <div class="index_bg" v-if="tableActive == 'home'">
+            <img class="bg" :src="selectItem.value" />
+            <div class="menu_wrap">
+              <div class="menu_wrap_div">
+                <div class="left">
+                  <div class="icon_wrap">
+                    <SvgIcon
+                      style="margin-right: 0"
+                      color="rgb(0,0,0)"
+                      size="30"
+                      iconClass="Coffee"
+                    ></SvgIcon>
+                  </div>
+                  <div class="info">
+                    <div class="t1">点餐</div>
+                    <div class="t2">在线点不排队</div>
+                  </div>
+                </div>
+                <div class="right">
+                  <div class="btn">
+                    <SvgIcon
+                      style="margin-right: 0"
+                      size="30"
+                      color="rgb(0,0,0)"
+                      iconClass="postcard"
+                    ></SvgIcon>
+                    <div class="info">
+                      <div class="t1">会员</div>
+                      <div class="t2">入会享权益</div>
+                    </div>
+                  </div>
+                  <div class="btn">
+                    <SvgIcon
+                      style="margin-right: 0"
+                      color="rgb(0,0,0)"
+                      size="30"
+                      iconClass="wallet"
+                    ></SvgIcon>
+                    <div class="info">
+                      <div class="t1">充值</div>
+                      <div class="t2">充值享更多优惠</div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="my_bg" v-if="tableActive == 'my_bg'">
+            <img class="bg" :src="selectItem.value" />
+            <div class="content">
+              <div class="item" style="display: flex">
+                <div class="left">
+                  <div class="avatar">
+                    <i class="icon el-icon-s-custom"></i>
+                  </div>
+                  <span>微信用户</span>
+                </div>
+                <div class="ewm">
+                  <i class="icon el-icon-menu"></i>
+                </div>
+              </div>
+              <div class="item">
+                <div class="title" style="padding-bottom: 10px">我的资产</div>
+                <div class="flex">
+                  <div class="btn">
+                    <i class="icon el-icon-s-finance"></i>
+                    <span class="name">储值</span>
+                    <span class="num">**</span>
+                  </div>
+                  <div class="btn">
+                    <i class="icon el-icon-s-ticket"></i>
+                    <span class="name">优惠券</span>
+                    <span class="num">**</span>
+                  </div>
+                </div>
+              </div>
+              <div class="item">
+                <div class="title" style="padding-bottom: 10px">我的功能</div>
+                <div class="row">
+                  <div class="left">
+                    <i class="icon el-icon-s-ticket"></i>
+                    <div class="label">我的优惠券</div>
+                  </div>
+                  <i class="arrow el-icon-arrow-right"></i>
+                </div>
+                <div class="row">
+                  <div class="left">
+                    <i class="icon el-icon-s-order"></i>
+                    <div class="label">我的订单</div>
+                  </div>
+                  <i class="arrow el-icon-arrow-right"></i>
+                </div>
+                <div class="row">
+                  <div class="left">
+                    <i class="icon el-icon-user-solid"></i>
+                    <div class="label">个人资料</div>
+                  </div>
+                  <i class="arrow el-icon-arrow-right"></i>
+                </div>
+                <div class="row">
+                  <div class="left">
+                    <i class="icon el-icon-s-management"></i>
+                    <div class="label">我的会员卡</div>
+                  </div>
+                  <i class="arrow el-icon-arrow-right"></i>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="member_bg" v-if="tableActive == 'member_bg'">
+            <div class="card_wrap">
+              <div class="card">
+                <img class="bg" :src="selectItem.value" />
+                <div class="content">
+                  <div class="ewm">
+                    <i class="icon el-icon-menu"></i>
+                  </div>
+                  <div class="title">{{ shopName }}会员卡 Lv.1</div>
+                  <div class="tips">
+                    <span>欢迎加入本店会员</span>
+                    <span>查看特权</span>
+                  </div>
+                  <div class="btm">
+                    <div class="item">
+                      <span>0.00</span>
+                      <span>储值</span>
+                    </div>
+                    <div class="item">
+                      <span>0</span>
+                      <span>积分</span>
+                    </div>
+                    <div class="item">
+                      <span>0</span>
+                      <span>优惠券</span>
+                    </div>
+                    <div class="item">
+                      <span>0</span>
+                      <span>权益卡</span>
+                    </div>
+                  </div>
+                </div>
+              </div>
+              <div class="info_wrap">
+                <div class="avatar">
+                  <i class="icon el-icon-user"></i>
+                </div>
+                <div class="info">
+                  <div class="t1">感谢你2天陪伴</div>
+                  <div class="t2">
+                    您今天的幸运词：
+                    <span>林波微步</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="shopinfo_bg" v-if="tableActive == 'shopinfo_bg'">
+            <img class="bg" :src="selectItem.value" />
+            <div class="shop_name">{{ shopName }}</div>
+            <img class="content" src="@/assets/images/shop_editor_bg.png" alt="" />
+          </div>
+          <div class="ticket_wrap" v-if="tableActive == 'ticket_logo'">
+            <img class="logo" :src="selectItem.value" />
+            <img class="ewm" src="@/assets/images/1024.png" />
+            <div class="row">
+              <span class="num">123</span>
+              <span>座位号：#A9</span>
+            </div>
+            <div class="row">甜橙马黛茶</div>
+            <div class="row">
+              <span class="sku">加珍珠、加糖</span>
+            </div>
+            <div class="row">
+              <span class="b">2020-10-24 13:14:52</span>
+            </div>
+            <div class="row">
+              <span class="sku">建议尽快享用，风味更佳</span>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="editor_wrap">
+        <div class="header" style="padding-bottom: 20px">
+          <div class="t1">
+            {{ selectItem.name }}
+          </div>
+          <div class="t2">注：点击图片更换</div>
+        </div>
+        <div class="form_item">
+          <SingleImageUpload v-model="selectItem.value" @onSuccess="onSuccess">
+            <img v-if="selectItem.value" :src="selectItem.value" class="avatar" />
+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+          </SingleImageUpload>
+          <!-- <el-upload
+            :headers="headers"
+            class="avatar-uploader"
+            :action="qiNiuUploadApi"
+            :show-file-list="false"
+            :on-success="handleSuccess"
+            style="width: 200px; height: 200px"
+          >
+            <img v-if="selectItem.value" :src="selectItem.value" class="avatar" />
+            <i v-else class="el-icon-plus avatar-uploader-icon"></i>
+          </el-upload> -->
+          <!-- <div class="title" style="padding-left: 20px;">跳转路径</div>
+                  <el-input style="width: 300px;margin-left: 20px;" />
+                  <el-button type="primary" style="margin-left: 20px;">修改</el-button> -->
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import shopExtendApi from "@/api/account/shopExtend";
+export default {
+  data() {
+    return {
+      tableActive: "home",
+      tableData: [],
+      selectItem: {},
+      imageUrl: "",
+    };
+  },
+  mounted() {
+    this.getList();
+  },
+  methods: {
+    // 刷新列表数据
+    async doSubmit() {
+      await shopExtendApi.edit({
+        ...this.selectItem,
+        autokey: this.selectItem.autoKey,
+      });
+      this.$message({
+        message: "编辑成功",
+        type: "success",
+      });
+      this.getList();
+    },
+    onSuccess(response) {
+      this.doSubmit();
+    },
+    // 切换类型
+    selectItemChange(key) {
+      this.tableActive = key;
+      const { autoKey, id, name, value } = this.tableData.find((item) => item.autoKey == key);
+      this.selectItem = { autoKey, id, name, value };
+      console.log(this.selectItem);
+    },
+    // 获取装修数据
+    async getList() {
+      try {
+        let res = await shopExtendApi.get({});
+        this.tableData = res;
+        console.log(this.tableData[0]);
+        this.selectItemChange(this.tableActive);
+      } catch (error) {
+        console.log(error);
+      }
+    },
+  },
+};
+</script>
+
+<style scoped lang="scss">
+.btn_wraps {
+  display: flex;
+  $color: #40a9ff;
+  gap: 30px;
+
+  .btn {
+    width: 100px;
+    height: 40px;
+    border: 1px solid $color;
+    border-radius: 4px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    box-shadow: 0 0 0 4px #40a9ff29;
+    color: $color;
+    cursor: pointer;
+
+    &.active {
+      background-color: $color;
+      color: #fff;
+    }
+  }
+}
+
+.form {
+  display: flex;
+  padding-top: 30px;
+
+  .preview_wrap {
+    width: 317px;
+
+    .phone_wrap {
+      width: 100%;
+      background-color: #fff;
+      box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
+
+      .index_bg {
+        padding-bottom: 50px;
+        .bg {
+          width: 100%;
+          height: 500px;
+          object-fit: cover;
+          position: relative;
+        }
+
+        .info {
+          display: flex;
+          flex-direction: column;
+          align-items: center;
+          justify-content: center;
+          padding-top: 10px;
+
+          .t1 {
+            font-size: 14px;
+          }
+
+          .t2 {
+            font-size: 10px;
+            color: #999;
+          }
+        }
+
+        .menu_wrap {
+          padding: 0 20px;
+          margin-top: -50px;
+          position: relative;
+
+          .menu_wrap_div {
+            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
+            display: flex;
+            padding: 20px 10px;
+            border-radius: 10px;
+            background-color: #fff;
+
+            .left {
+              flex: 1;
+              display: flex;
+              flex-direction: column;
+
+              .icon_wrap {
+                display: flex;
+                justify-content: center;
+
+                .icon {
+                  font-size: 34px;
+                }
+              }
+            }
+
+            .right {
+              flex: 1;
+              display: flex;
+              flex-direction: column;
+              border-left: 1px solid #ddd;
+              padding-left: 20px;
+
+              .btn {
+                flex: 1;
+                display: flex;
+                align-items: center;
+
+                &:last-child {
+                  margin-top: 6px;
+                }
+
+                .icon {
+                  font-size: 30px;
+                }
+
+                .info {
+                  flex: 1;
+                  padding-top: 0;
+                }
+              }
+            }
+          }
+        }
+      }
+
+      .my_bg {
+        background-color: #f5f5f5;
+        height: 100%;
+        padding-bottom: 50px;
+
+        .bg {
+          width: 100%;
+          height: 180px;
+          object-fit: cover;
+          position: relative;
+        }
+
+        .content {
+          padding: 0 10px;
+          margin-top: -40px;
+          position: relative;
+
+          .item {
+            padding: 10px;
+            align-items: center;
+            justify-content: space-between;
+            background-color: #fff;
+            border-radius: 10px;
+            margin-bottom: 10px;
+
+            .left {
+              display: flex;
+              align-items: center;
+
+              .avatar {
+                width: 50px;
+                height: 50px;
+                background-color: #efefef;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                border-radius: 50%;
+
+                .icon {
+                  font-size: 24px;
+                  color: #ddd;
+                }
+              }
+
+              span {
+                margin-left: 10px;
+              }
+            }
+
+            .ewm {
+              width: 30px;
+              height: 30px;
+              border-radius: 50%;
+              background-color: #e3ad7f;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+
+              .icon {
+                font-size: 20px;
+                color: #fff;
+              }
+            }
+
+            .flex {
+              display: flex;
+
+              .btn {
+                flex: 1;
+                display: flex;
+                flex-direction: column;
+                align-items: center;
+                justify-content: center;
+                gap: 5px;
+
+                .icon {
+                  font-size: 28px;
+                }
+
+                .name {
+                  font-size: 14px;
+                }
+
+                .num {
+                  color: #e3ad7f;
+                }
+              }
+            }
+
+            .row {
+              display: flex;
+              justify-content: space-between;
+              align-items: center;
+              padding: 10px 0;
+
+              .left {
+                display: flex;
+                align-items: center;
+
+                .icon {
+                  font-size: 20px;
+                }
+
+                .label {
+                  font-size: 14px;
+                  margin-left: 10px;
+                }
+              }
+
+              .arrow {
+                font-size: 14px;
+                color: #999;
+              }
+            }
+          }
+        }
+      }
+
+      .member_bg {
+        height: 100%;
+        background-color: #f5f5f5;
+        padding: 10px;
+        padding-bottom: 400px;
+
+        .card_wrap {
+          background-color: #fff;
+          border-radius: 10px;
+          overflow: hidden;
+
+          .card {
+            height: 144px;
+            position: relative;
+
+            .bg {
+              width: 100%;
+              height: 100%;
+              position: absolute;
+              top: 0;
+              left: 0;
+              object-fit: cover;
+              border-radius: 0 0 10px 10px;
+            }
+
+            .content {
+              width: 100%;
+              height: 100%;
+              position: absolute;
+              top: 0;
+              left: 0;
+              background-color: rgba(0, 0, 0, 0.3);
+              border-radius: 0 0 10px 10px;
+              color: #fff;
+              padding: 20px;
+              font-size: 14px;
+
+              .ewm {
+                width: 30px;
+                height: 30px;
+                border-radius: 50%;
+                background-color: #000;
+                display: flex;
+                align-items: center;
+                justify-content: center;
+                position: absolute;
+                top: 15px;
+                right: 20px;
+
+                .icon {
+                  font-size: 16px;
+                  color: #fff;
+                }
+              }
+
+              .title {
+                font-size: 16px;
+              }
+
+              .tips {
+                display: flex;
+                justify-content: space-between;
+                margin-top: 10px;
+                color: inherit;
+              }
+
+              .btm {
+                width: 100%;
+                display: flex;
+                position: absolute;
+                bottom: 20px;
+                left: 0;
+
+                .item {
+                  flex: 1;
+                  display: flex;
+                  flex-direction: column;
+                  align-items: center;
+                  justify-content: center;
+                }
+              }
+            }
+          }
+
+          .info_wrap {
+            padding: 20px 10px;
+            display: flex;
+            align-items: center;
+
+            .avatar {
+              width: 40px;
+              height: 40px;
+              border-radius: 50%;
+              background-color: #efefef;
+              display: flex;
+              align-items: center;
+              justify-content: center;
+
+              .icon {
+                color: #555;
+                font-size: 24px;
+              }
+            }
+
+            .info {
+              flex: 1;
+
+              .t1 {
+                font-size: 14px;
+              }
+
+              .t2 {
+                font-size: 10px;
+                color: #999;
+              }
+            }
+          }
+        }
+      }
+
+      .shopinfo_bg {
+        .bg {
+          width: 100%;
+          height: 120px;
+          object-fit: cover;
+        }
+
+        .shop_name {
+          padding: 10px 10px 0 10px;
+        }
+
+        .content {
+          width: 100%;
+          height: auto;
+          display: block;
+        }
+      }
+
+      .ticket_wrap {
+        padding: 15px;
+        position: relative;
+
+        .ewm {
+          width: 80px;
+          height: 80px;
+          position: absolute;
+          top: 10px;
+          right: 15px;
+        }
+
+        .logo {
+          width: 90px;
+          height: 30px;
+          object-fit: cover;
+        }
+
+        .row {
+          margin-top: 5px;
+          display: flex;
+          align-items: center;
+
+          .sku {
+            font-size: 12px;
+            color: #666;
+          }
+
+          .b {
+            font-weight: bold;
+          }
+
+          .num {
+            font-size: 18px;
+            font-weight: bold;
+            margin-right: 10px;
+          }
+        }
+      }
+    }
+  }
+
+  .editor_wrap {
+    padding-left: 20px;
+
+    .header {
+      .t2 {
+        color: #999;
+        font-size: 12px;
+      }
+    }
+
+    .form_item {
+      display: flex;
+      align-items: center;
+
+      .avatar {
+        display: block;
+        width: 200px;
+        height: 200px;
+        object-fit: cover;
+      }
+
+      .title {
+        flex-shrink: 0;
+      }
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/tool/Instead/components/carts/item.vue b/src/views/tool/Instead/components/carts/item.vue
index 801a7b8..7e85a99 100644
--- a/src/views/tool/Instead/components/carts/item.vue
+++ b/src/views/tool/Instead/components/carts/item.vue
@@ -16,7 +16,7 @@
         </div>
         <div
           class="isSeatFee img u-line-1 u-flex u-col-center u-row-center"
-          v-else-if="!item.product_id"
+          v-else-if="item.is_temporary"
         >
           <span>临时菜</span>
         </div>
@@ -25,7 +25,7 @@
       <div class="good-info u-p-t-6">
         <div class="flex lh-16">
           <div class="name" :class="{ 'free-price': item.status === 'return' }">
-            {{ item.name }}
+            {{ item.name || item.product_name }}
           </div>
           <span class="good_info_discount" v-if="item.is_gift">赠</span>
         </div>
@@ -177,6 +177,9 @@ const vipAllPrice = computed(() => {
   return 0;
 });
 const allPrice = computed(() => {
+  if (props.item.discount_sale_amount * 1 != 0) {
+    return props.item.number * props.item.discount_sale_amount;
+  }
   return props.item.number * props.item.salePrice;
 });
 
@@ -199,7 +202,7 @@ const emits = defineEmits([
   "itemClick",
 ]);
 function editNote() {
-  emits("editNote", props.index);
+  emits("editNote");
 }
 //购物车商品输入框数量改变
 function cartGoodsNumberChange(newval) {
diff --git a/src/views/tool/Instead/components/carts/list.vue b/src/views/tool/Instead/components/carts/list.vue
index ce1cd2e..c9720b5 100644
--- a/src/views/tool/Instead/components/carts/list.vue
+++ b/src/views/tool/Instead/components/carts/list.vue
@@ -8,18 +8,22 @@
           @changeNumber="changeNumber"
           :selCart="carts.selCart"
           @itemClick="itemClick(item)"
+          @editNote="editNote"
         ></carts-item>
       </div>
       <!-- 赠菜 -->
-      <div class="cart-title"><span>以下是优惠菜品</span></div>
+      <div class="cart-title" v-if="carts.giftList.length > 0"><span>以下是优惠菜品</span></div>
       <div v-for="(item, index) in carts.giftList" :key="index">
         <carts-item
           :item="item"
           @changeNumber="changeNumber"
           :selCart="carts.selCart"
           @itemClick="itemClick(item)"
+          @editNote="editNote"
         ></carts-item>
       </div>
+
+      <el-empty image-size="60" v-if="carts.isEmpty" description="点餐列表为空" />
     </div>
     <div class="bottom">
       <div class="yiyouhui">{{ carts.yiyouhui }}</div>
@@ -54,6 +58,11 @@ const props = defineProps({
   },
 });
 
+const emits = defineEmits(["editNote"]);
+function editNote() {
+  emits("editNote");
+}
+
 const selCartId = ref(null);
 
 const carts = useCartsStore();
diff --git a/src/views/tool/Instead/components/control.vue b/src/views/tool/Instead/components/control.vue
index c595053..cf6f5ad 100644
--- a/src/views/tool/Instead/components/control.vue
+++ b/src/views/tool/Instead/components/control.vue
@@ -37,12 +37,12 @@ const controls = ref([
   { label: "整单备注", key: "all-note", disabled: false, per: "all-note" },
   { label: "退菜", key: "", disabled: false, per: "order" },
   { label: "免厨打", key: "is_print", disabled: false, per: "cart" },
-  { label: "单品改价", key: "", disabled: false, per: "cart" },
-  { label: "等叫", key: "", disabled: false, per: "cart" },
+  { label: "单品改价", key: "changePriceClick", disabled: false, per: "cart" },
+  { label: "等叫", key: "is_wait_call", disabled: false, per: "cart" },
   { label: "整单等叫", key: "", disabled: false, per: "all-wating" },
 ]);
 
-const emits = defineEmits(["noteClick"]);
+const emits = defineEmits(["noteClick", "changePriceClick", "packClick"]);
 function controlsClick(item) {
   switch (item.key) {
     case "is_gift":
@@ -57,8 +57,8 @@ function controlsClick(item) {
     case "del":
       carts.del(carts.selCart);
       break;
-    case "save":
-      carts.saveCart();
+    case "changePriceClick":
+      emits("changePriceClick", carts.selCart);
       break;
     case "one-note":
       emits("noteClick", true);
@@ -66,8 +66,8 @@ function controlsClick(item) {
     case "all-note":
       emits("noteClick", false);
       break;
-    case "order":
-      carts.order();
+    case "is_wait_call":
+      carts.updateTag("is_wait_call", carts.selCart.is_wait_call ? 0 : 1);
       break;
     case "all-wating":
       carts.allWating();
@@ -96,6 +96,9 @@ function returnLabel(item) {
   if (item.key == "is_print") {
     return carts.selCart.is_print ? "免厨打" : "打印";
   }
+  if (item.key == "is_wait_call") {
+    return carts.selCart.is_wait_call ? "取消等叫" : "等叫";
+  }
   return item.label;
 }
 </script>
diff --git a/src/views/tool/Instead/components/dialog-goods-sel.vue b/src/views/tool/Instead/components/dialog-goods-sel.vue
index 06d6674..35118bf 100644
--- a/src/views/tool/Instead/components/dialog-goods-sel.vue
+++ b/src/views/tool/Instead/components/dialog-goods-sel.vue
@@ -35,7 +35,7 @@
         <div class="u-flex" style="margin-top: 14px">
           <el-button v-if="!skuData.isGrounding" disabled style="width: 100%">已下架</el-button>
           <template v-else>
-            <el-button type="primary" style="width: 100%">确 定</el-button>
+            <el-button type="primary" style="width: 100%" @click="confirm">确 定</el-button>
           </template>
         </div>
       </template>
@@ -87,6 +87,7 @@ function open(data) {
 }
 function close() {
   show.value = false;
+  number.value = 1;
   resetData();
 }
 const skuName = computed(() => {
@@ -110,6 +111,27 @@ const skuData = computed(() => {
   });
 });
 
+watch(
+  () => skuData.value,
+  (newval) => {
+    if (newval) {
+      number.value = newval.suitNum;
+    }
+  }
+);
+
+const emits = defineEmits(["confirm"]);
+function confirm() {
+  if (skuData.value) {
+    emits("confirm", {
+      sku_id: skuData.value.id,
+      product_id: goods.value.id,
+      number: number.value,
+    });
+    close();
+  }
+}
+
 defineExpose({ open, close });
 </script>
 
diff --git a/src/views/tool/Instead/components/goods-item.vue b/src/views/tool/Instead/components/goods-item.vue
index 9007ce9..d1b04df 100644
--- a/src/views/tool/Instead/components/goods-item.vue
+++ b/src/views/tool/Instead/components/goods-item.vue
@@ -3,7 +3,7 @@
     <el-image v-if="item.coverImg" class="goods-image" :src="item.coverImg" fit="cover"></el-image>
     <div class="info">
       <div class="name u-flex u-flex-wrap">
-        <span class="weight" v-if="item.type == 'weigh'">称重</span>
+        <span class="weight" v-if="item.type == 'weight'">称重</span>
         <span>{{ item.name }}</span>
       </div>
       <div class="">￥{{ item.lowPrice }}</div>
@@ -47,4 +47,14 @@ const props = defineProps({
     background-color: rgba(46, 46, 46, 0.38);
   }
 }
+.weight {
+  height: 15px;
+  background: linear-gradient(124deg, rgb(115, 201, 105) 6%, rgb(39, 146, 27) 93%);
+  border-radius: 2px;
+  font-size: 12px;
+  text-align: center;
+  line-height: 15px;
+  padding: 0px 2px;
+  margin-right: 2px;
+}
 </style>
\ No newline at end of file
diff --git a/src/views/tool/Instead/components/popup-cart-changePrice.vue b/src/views/tool/Instead/components/popup-cart-changePrice.vue
new file mode 100644
index 0000000..5f2754f
--- /dev/null
+++ b/src/views/tool/Instead/components/popup-cart-changePrice.vue
@@ -0,0 +1,138 @@
+<template>
+  <el-dialog title="单品改价" width="410px" v-model="show" @close="reset" :modal="modal">
+    <div class="u-m-t-30 u-flex">
+      <div class="no-wrap u-m-r-20">价格更改为</div>
+      <el-input
+        :min="min"
+        placeholder="请输入更改后的价格"
+        v-model="price"
+        @blur="checkPrice"
+        type="number"
+      >
+        <template #append>元</template>
+      </el-input>
+    </div>
+    <div class="u-m-t-16">
+      <span class="color-red">*</span>
+      <span>当前单品单价：{{ originPrice }}元</span>
+    </div>
+
+    <template #footer>
+      <div>
+        <el-button size="medium" @click="close">取消</el-button>
+        <el-button size="medium" type="primary" @click="confirm">确定</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+    <script>
+import { ElMessage } from "element-plus";
+export default {
+  props: {
+    modal: {
+      type: Boolean,
+      default: true,
+    },
+    vipUser: {
+      type: Object,
+      default: () => {
+        return {
+          isVip: false,
+        };
+      },
+    },
+  },
+  data() {
+    return {
+      min: 0,
+      originPrice: "",
+      price: "",
+      show: false,
+      goods: {
+        productId: -999,
+      },
+    };
+  },
+  computed: {
+    isSeatFee() {
+      return returnIsSeatFee(this.goods);
+    },
+  },
+  methods: {
+    checkPrice() {
+      if (this.price < 0) {
+        this.price = 0;
+      }
+    },
+    changeSel(item) {
+      item.checked = !item.checked;
+    },
+    reset() {
+      this.price = "";
+    },
+    open(item) {
+      console.log(item);
+      this.show = true;
+      const price = item.discount_sale_amount * 1 || item.salePrice * 1;
+      this.price = price;
+      this.originPrice = price;
+    },
+    close() {
+      this.show = false;
+      this.price = "";
+      this.originPrice = "";
+    },
+    async confirm() {
+      if (this.price < 0) {
+        return ElMessage.error("价格不能小于0");
+      }
+      this.$emit("confirm", this.price);
+      this.close();
+      // this.$emit("confirm", { note: note, num: this.number });
+    },
+  },
+  mounted() {},
+};
+</script>
+    
+    <style lang="scss" scoped>
+:deep(.el-dialog__body) {
+  margin-bottom: 14px;
+  margin-top: 14px;
+  padding: 0 20px;
+}
+:deep(.el-tag) {
+  margin-top: 10px;
+  margin-right: 10px;
+  margin-bottom: 5px;
+  cursor: pointer;
+  font-size: 15px;
+  line-height: 35px;
+  height: 35px;
+}
+.tags {
+  .tag {
+    margin: 10px 10px 0 0;
+    border: 1px solid #dcdfe6;
+    border-radius: 4px;
+    padding: 10px 13px;
+    font-size: 14px;
+    color: #666;
+    cursor: pointer;
+    &.active {
+      color: #1890ff;
+      background: #e8f4ff;
+      border-color: #a3d3ff;
+    }
+  }
+}
+:deep(.el-dialog__body) {
+  color: #333;
+}
+:deep(input::-webkit-outer-spin-button) {
+  -webkit-appearance: none !important;
+}
+:deep(input::-webkit-inner-spin-button) {
+  -webkit-appearance: none !important;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/tool/Instead/components/popup-linshiCai.vue b/src/views/tool/Instead/components/popup-linshiCai.vue
new file mode 100644
index 0000000..f5ff848
--- /dev/null
+++ b/src/views/tool/Instead/components/popup-linshiCai.vue
@@ -0,0 +1,111 @@
+<template>
+  <el-dialog title="添加临时菜" width="410px" v-model="show" @close="reset">
+    <div>
+      <div>将临时菜添加至购物车，不会影响总商品库</div>
+      <div class="u-m-t-16">
+        <el-form ref="form" :model="form" label-width="80px" :rules="rules">
+          <el-form-item label="菜品名称" prop="product_name">
+            <el-input v-model="form.product_name" placeholder="请输入菜品名称"></el-input>
+          </el-form-item>
+          <el-form-item label="价格" prop="discount_sale_amount">
+            <el-input v-model="form.discount_sale_amount" placeholder="请输入价格" type="number">
+              <template #append>元</template>
+            </el-input>
+          </el-form-item>
+          <el-form-item label="下单数量" prop="number">
+            <el-input v-model="form.number" placeholder="请输入下单数量" type="number"></el-input>
+          </el-form-item>
+          <el-form-item label="备注">
+            <el-input v-model="form.remark" placeholder="请输入备注"></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+    </div>
+    <template #footer>
+      <div>
+        <el-button size="medium" @click="close">取消</el-button>
+        <el-button size="medium" type="primary" @click="confirm">确定</el-button>
+      </div>
+    </template>
+  </el-dialog>
+</template>
+  <script>
+import { ElMessage } from "element-plus";
+export default {
+  data() {
+    return {
+      show: false,
+      rules: {
+        product_name: [{ required: true, message: "请输入菜品名称", trigger: "blur" }],
+        discount_sale_amount: [{ required: true, message: "请输入菜品价格", trigger: "blur" }],
+        number: [{ required: true, message: "请输入下单数量", trigger: "blur" }],
+      },
+      form: {
+        product_name: "",
+        discount_sale_amount: "",
+        number: 1,
+        remark: "",
+      },
+      category: [],
+      units: [],
+      option: {},
+    };
+  },
+
+  methods: {
+    reset() {
+      this.$refs.form.resetFields();
+    },
+
+    open(opt) {
+      this.show = true;
+      this.option = opt;
+    },
+    close() {
+      this.show = false;
+    },
+    async submit() {
+      this.$emit("confirm", this.form);
+      this.close();
+    },
+    confirm() {
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          console.log(valid);
+          if (this.form.discount_sale_amount * 1 <= 0 || this.form.discount_sale_amount * 1 <= 0) {
+            return ElMessage.error("价格和数量必须大于0");
+          }
+          this.submit();
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+  },
+  mounted() {},
+};
+</script>
+  
+  <style lang="scss" scoped>
+::v-deep .el-dialog__body {
+  margin-bottom: 14px;
+  margin-top: 14px;
+}
+::v-deep .el-form-item__label {
+  text-align: left;
+}
+input[type="number"]::-webkit-inner-spin-button,
+input[type="number"]::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+::v-deep .el-input__inner::-webkit-inner-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+::v-deep .el-input__inner::-webkit-outer-spin-button {
+  -webkit-appearance: none;
+  margin: 0;
+}
+</style>
\ No newline at end of file
diff --git a/src/views/tool/Instead/index.vue b/src/views/tool/Instead/index.vue
index 1036c6a..e4298fd 100644
--- a/src/views/tool/Instead/index.vue
+++ b/src/views/tool/Instead/index.vue
@@ -6,12 +6,43 @@
           <span class="title">代客下单</span>
           <div class="u-m-l-20 flex">
             <el-button type="primary">选择用户</el-button>
-            <el-button>选择桌号</el-button>
+            <el-popover placement="right" width="333" trigger="click" v-model="tableShow">
+              <el-input
+                placeholder="请输入内容"
+                prefix-icon="search"
+                v-model="tableSearchText"
+                @input="tablesearchInput"
+              ></el-input>
+              <div style="max-height: 398px; overflow-y: scroll" class="u-m-t-12">
+                <div
+                  class="u-flex u-row-between u-p-t-8 table-item u-p-b-8 u-p-r-30"
+                  v-for="(item, index) in tableList"
+                  :key="index"
+                  @click="tableClick(item, index)"
+                >
+                  <span>{{ item.name }}</span>
+                  <span :style="{ color: returnTableColor(item.status) }">
+                    {{ returnTableLabel(item.status) }}
+                  </span>
+                </div>
+                <div class="color-999 u-p-30 u-text-center" v-if="!tableList.length">
+                  无可用桌台
+                </div>
+              </div>
+              <template #reference>
+                <el-button>选择桌号</el-button>
+              </template>
+            </el-popover>
             <el-button type="warning">扫码验券</el-button>
           </div>
         </div>
         <div class="right">
-          <el-input placeholder="请输入商品名称" v-model="keywords" clearable>
+          <el-input
+            placeholder="请输入商品名称"
+            v-model="goods.query.name"
+            clearable
+            @change="getGoods"
+          >
             <template #suffix>
               <el-icon class="el-input__icon"><search /></el-icon>
             </template>
@@ -43,13 +74,18 @@
             <a @click="clearCarts" style="color: #1890ff">清空</a>
           </div>
           <cartsList
+            @editNote="showNote(true)"
             :goodsMapisFinish="goodsMapisFinish"
             :goodsList="goods.list"
             ref="refCart"
           ></cartsList>
         </div>
         <div class="center">
-          <Controls @noteClick="showNote" @packClick="showPack" />
+          <Controls
+            @noteClick="showNote"
+            @packClick="showPack"
+            @changePriceClick="showChangePrice"
+          />
         </div>
         <div class="right">
           <div class="flex categoty u-col-center">
@@ -73,17 +109,20 @@
               >
                 <el-tag
                   size="large"
-                  type="primary"
+                  :type="goods.query.categoryId === item.id ? 'primary' : 'info'"
                   effect="dark"
-                  v-if="goods.query.categoryId === item.id"
                 >
                   {{ item.name }}
                 </el-tag>
-                <el-tag size="large" type="info" v-else effect="plain">{{ item.name }}</el-tag>
               </div>
             </div>
           </div>
+          <div v-if="goods.list.length <= 0" class="no-goods">未找到相关商品</div>
           <div class="goods-list">
+            <div class="lingshicai" @click="showaddLingShiCai">
+              <el-icon size="26"><Plus /></el-icon>
+              <div class="u-m-t-10">临时菜</div>
+            </div>
             <GoodsItem
               :item="item"
               @click="goodsClick(item)"
@@ -95,20 +134,81 @@
       </div>
     </div>
 
-    <dialogGoodsSel ref="refSelSku"></dialogGoodsSel>
+    <dialogGoodsSel ref="refSelSku" @confirm="skuSelConfirm"></dialogGoodsSel>
     <note ref="refNote" @confirm="noteConfirm"></note>
     <pack ref="refPack" @confirm="packConfirm"></pack>
+    <addLingShiCai ref="refAddLingShiCai" @confirm="addLingShiCaiConfirm"></addLingShiCai>
+    <changePrice ref="refChangePrice" @confirm="changePriceConfirm"></changePrice>
   </div>
 </template>
 <script setup>
 import Controls from "./components/control.vue";
 import note from "./components/note.vue";
 import pack from "./components/pack.vue";
+import changePrice from "./components/popup-cart-changePrice.vue";
+import addLingShiCai from "./components/popup-linshiCai.vue";
 import GoodsItem from "./components/goods-item.vue";
 import dialogGoodsSel from "./components/dialog-goods-sel.vue";
 import cartsList from "./components/carts/list.vue";
 import categoryApi from "@/api/product/productclassification";
 import productApi from "@/api/product/index";
+import tableApi from "@/api/account/table";
+import $status from "@/views/tool/table/status.js";
+
+//桌台
+const tableSearchText = ref("");
+const tableList = ref([]);
+function getTableList() {
+  tableApi.getList({ page: 1, size: 999 }).then((res) => {
+    tableList.value = res.records;
+  });
+}
+//返回台桌状态颜色
+function returnTableColor(key) {
+  const item = $status[key];
+  return item ? item.type : "";
+}
+//返回台桌状态
+function returnTableLabel(key) {
+  const item = $status[key];
+  return item ? item.label : "";
+}
+function tableClick(item) {
+  console.log(item);
+}
+
+//临时菜
+const refAddLingShiCai = ref();
+function showaddLingShiCai() {
+  refAddLingShiCai.value.open();
+}
+function addLingShiCaiConfirm(data) {
+  refCart.value.carts.add({
+    sku_id: "-999",
+    product_id: "-999",
+    is_temporary: 1,
+    sku_name: 1,
+    number: 1,
+    is_pack: 0,
+    is_gift: 0,
+    discount_sale_amount: 0,
+    discount_sale_note: "",
+    is_print: 0,
+    is_wait_call: 0,
+    product_name: "",
+    remark: "",
+    ...data,
+  });
+}
+//单品改价
+const refChangePrice = ref();
+function showChangePrice(cart) {
+  refChangePrice.value.open(cart);
+}
+function changePriceConfirm(discount_sale_amount) {
+  refCart.value.carts.updateTag("discount_sale_amount", discount_sale_amount);
+}
+
 //打包
 const refPack = ref();
 function showPack(packNumber, max) {
@@ -151,7 +251,9 @@ const category = reactive({
 function toggleShowAll() {
   category.showAll = !category.showAll;
 }
-function changeCategoryId() {}
+function changeCategoryId(category) {
+  goods.query.categoryId = category.id;
+}
 
 function getCategoryList() {
   categoryApi
@@ -160,6 +262,7 @@ function getCategoryList() {
       size: 200,
     })
     .then((res) => {
+      res.unshift({ name: "全部", id: "" });
       category.list = res;
     });
 }
@@ -171,23 +274,20 @@ const goods = reactive({
   list: [],
   query: {
     categoryId: "",
-    keywords: "",
+    name: "",
   },
 });
 
 let goodsMapisFinish = ref(false);
 
-function getGoods() {
-  productApi
-    .getPage({
-      page: 1,
-      size: 200,
-      ...goods.query,
-    })
-    .then((res) => {
-      goods.list = res.records;
-      goodsMapisFinish.value = true;
-    });
+async function getGoods() {
+  const res = await productApi.getPage({
+    page: 1,
+    size: 200,
+    ...goods.query,
+  });
+  goods.list = res.records;
+  goodsMapisFinish.value = true;
 }
 
 function goodsClick(item) {
@@ -213,6 +313,31 @@ function goodsClick(item) {
     refSelSku.value.open(item);
   }
 }
+
+// 多规格选择确认
+function skuSelConfirm(item) {
+  console.log(item);
+  const listItem = refCart.value.carts.list.find(
+    (v) => v.product_id == item.product_id && v.sku_id == item.sku_id
+  );
+  if (listItem) {
+    refCart.value.carts.update({ ...listItem, ...item });
+  } else {
+    refCart.value.carts.add({
+      is_pack: 0,
+      is_gift: 0,
+      is_temporary: 0,
+      discount_sale_amount: 0,
+      discount_sale_note: "",
+      is_print: 0,
+      is_wait_call: 0,
+      product_name: "",
+      remark: "",
+      ...item,
+    });
+  }
+}
+
 //购物车
 const refCart = ref(null);
 function clearCarts() {
@@ -236,7 +361,14 @@ function addCarts(item) {
   }
 }
 
+watch(
+  () => goods.query.categoryId,
+  (newval) => {
+    getGoods();
+  }
+);
 function init() {
+  getTableList();
   getCategoryList();
   getGoods();
 }
@@ -348,6 +480,7 @@ $pl: 30px;
   background-color: #f7f7fa;
   z-index: 1;
   padding-top: 14px;
+  padding-right: 81px;
 
   .show_more_btn {
     padding: 0 10px;
@@ -400,4 +533,34 @@ $pl: 30px;
     padding-left: $pl;
   }
 }
+.lingshicai {
+  width: 100px;
+  height: 100px;
+  border-radius: 4px;
+  position: relative;
+  overflow: hidden;
+  cursor: pointer;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  border: 1px solid #dddfe6;
+  color: #999;
+}
+:deep(.el-tag--dark.el-tag--info) {
+  background-color: #fff;
+  color: #000;
+  border: 1px solid #dcdfe6;
+}
+.table-item {
+  cursor: pointer;
+  transition: 0.2s ease-in-out;
+
+  &:hover {
+    background: #f4f9ff;
+  }
+}
+.no-goods {
+  color: #999;
+}
 </style>
\ No newline at end of file