From 1ec1fcc47455a2e702f3a88a9f42410f76dfcec0 Mon Sep 17 00:00:00 2001
From: dzc <2388224167@qq.com>
Date: Sat, 9 May 2026 11:49:10 +0800
Subject: [PATCH] =?UTF-8?q?feat:bug=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .env                                          |   2 +-
 index.html                                    |   2 +-
 src/views/login/index.vue                     |   4 +-
 .../components/take-out-setting.vue           | 385 +++++++++++++++---
 src/views/mch/mch-manage/detail.vue           |   6 +-
 5 files changed, 345 insertions(+), 54 deletions(-)

diff --git a/.env b/.env
index 5e253f45..b69abccb 100644
--- a/.env
+++ b/.env
@@ -1,5 +1,5 @@
 # 网站主标题
-VITE_GLOBAL_TITLE= '资安信'
+VITE_GLOBAL_TITLE= '后勤管理系统'
 
 # footer
 VITE_FOOTER_TITLE= '©2024 bsd.com'
diff --git a/index.html b/index.html
index 4d236f09..55c177cb 100644
--- a/index.html
+++ b/index.html
@@ -23,7 +23,7 @@
 		<!--避免微信管理防盗链机制-->
 		<meta name="referrer" content="no-referrer" />
 		<link rel="icon" href="/favicon.ico" />
-		<title>资安信</title>
+		<title>%VITE_GLOBAL_TITLE%</title>
 	</head>
 
 	<body>
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index 1e00e78b..a6583268 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -17,8 +17,8 @@
 				<!-- 右侧登录表单区域 -->
 				<div class="w-full px-5 py-12 md:w-[45%] md:px-12">
 					<div class="mb-12 text-center">
-						<h1 class="text-4xl font-bold text-gray-900 dark:text-white tracking-wide font-['Inter']">{{
-							getThemeConfig.globalTitle }}</h1>
+						<h1 class="text-4xl font-bold text-gray-900 dark:text-white tracking-wide font-['Inter']">
+							{{ getThemeConfig.globalTitle }}</h1>
 						<!-- 租户选择 -->
 						<div class="mt-6">
 							<tenant class="shadow-sm" />
diff --git a/src/views/mch/mch-manage/components/take-out-setting.vue b/src/views/mch/mch-manage/components/take-out-setting.vue
index adf643cc..c684bdff 100644
--- a/src/views/mch/mch-manage/components/take-out-setting.vue
+++ b/src/views/mch/mch-manage/components/take-out-setting.vue
@@ -1,42 +1,117 @@
 <template>
-    <div class="take-card">
-        <div class="flex justify-end pr-[10px]">
-            <el-button icon="Edit" circle @click="takeOutFormRef.openDialog(state.mchId)" />
-            <el-button icon="RefreshRight" circle @click="getTakeOutSettingDetail" />
-        </div>
-        <div class="take-info">
-            <div class="take-info-item">
-                <span>是否启用:</span>
-                <span>
-                    <dict-tag :options="yes_no_type" :value="state.takeOutSetting?.enable" />
-                </span>
+    <div class="take-setting-list">
+        <div class="take-card">
+            <div class="take-card__header">
+                <div class="take-card__intro">
+                    <div class="take-card__title">外卖配置</div>
+                    <div class="take-card__subtitle">查看并维护商户外卖配送相关参数</div>
+                </div>
+                <div class="take-card__toolbar">
+                    <div class="take-card__switch-panel">
+                        <div class="take-card__switch-copy">
+                            <div class="take-card__switch-title">启用外卖</div>
+                            <div class="take-card__switch-desc">控制商户外卖配送与配送费能力</div>
+                        </div>
+                        <el-switch v-model="state.mchDetail.functionScope.takeOutEnable"
+                            :loading="state.switchLoadingKey === 'takeOutEnable'" inline-prompt active-text="开"
+                            inactive-text="关" @change="handleTakeOutSwitchChange" />
+                    </div>
+                    <div class="take-card__actions">
+                        <el-button icon="Edit" circle @click="takeOutFormRef.openDialog(state.mchId)" />
+                        <el-button icon="RefreshRight" circle @click="getTakeOutSettingDetail" />
+                    </div>
+                </div>
             </div>
-            <div class="take-info-item">
-                <span>起送价格:</span>
-                <span>
-                    {{ displayPrice(state.takeOutSetting?.minDeliveryAmt || 0) }}
-                </span>
-            </div>
-            <div class="take-info-item">
-                <span>商家配送费:</span>
-                <span>
-                    {{ displayPrice(state.takeOutSetting?.mchTakeOutAmt || 0) }}
-                </span>
-            </div>
-            <div class="take-info-item">
-                <span>用户配送费:</span>
-                <span>
-                    {{ displayPrice(state.takeOutSetting?.userTakeOutAmt || 0) }}
-                </span>
+            <div class="take-info">
+                <div class="take-info-item">
+                    <span class="take-info-item__label">是否启用起送价</span>
+                    <span class="take-info-item__value">
+                        <dict-tag :options="yes_no_type" :value="state.takeOutSetting?.enable" />
+                    </span>
+                </div>
+                <div class="take-info-item">
+                    <span class="take-info-item__label">起送价格</span>
+                    <span class="take-info-item__value">
+                        {{ displayPrice(state.takeOutSetting?.minDeliveryAmt || 0) }}
+                    </span>
+                </div>
+                <div class="take-info-item">
+                    <span class="take-info-item__label">商家配送费</span>
+                    <span class="take-info-item__value">
+                        {{ displayPrice(state.takeOutSetting?.mchTakeOutAmt || 0) }}
+                    </span>
+                </div>
+                <div class="take-info-item">
+                    <span class="take-info-item__label">用户配送费</span>
+                    <span class="take-info-item__value">
+                        {{ displayPrice(state.takeOutSetting?.userTakeOutAmt || 0) }}
+                    </span>
+                </div>
             </div>
         </div>
+
+        <div class="take-card take-card--placeholder">
+            <div class="take-card__header">
+                <div class="take-card__intro">
+                    <div class="take-card__title">报餐配置</div>
+                    <div class="take-card__subtitle">预留报餐功能配置区域，后续可继续补充具体参数项</div>
+                </div>
+                <div class="take-card__toolbar">
+                    <div class="take-card__switch-panel">
+                        <div class="take-card__switch-copy">
+                            <div class="take-card__switch-title">启用报餐</div>
+                            <div class="take-card__switch-desc">控制商户报餐相关能力开关</div>
+                        </div>
+                        <el-switch v-model="state.mchDetail.functionScope.orderingFoodEnable"
+                            :loading="state.switchLoadingKey === 'orderingFoodEnable'" inline-prompt active-text="开"
+                            inactive-text="关" @change="handleReportFoodSwitchChange" />
+                    </div>
+                    <div class="take-card__actions">
+                        <el-button icon="Edit" circle />
+                        <el-button icon="RefreshRight" circle />
+                    </div>
+                </div>
+            </div>
+            <div class="take-card__placeholder">
+                预留报餐配置内容区，后续可以继续补充统计规则、时段限制、报餐说明等配置项。
+            </div>
+        </div>
+
+        <div class="take-card take-card--placeholder">
+            <div class="take-card__header">
+                <div class="take-card__intro">
+                    <div class="take-card__title">定餐配置</div>
+                    <div class="take-card__subtitle">预留定餐功能配置区域，后续可继续补充具体参数项</div>
+                </div>
+                <div class="take-card__toolbar">
+                    <div class="take-card__switch-panel">
+                        <div class="take-card__switch-copy">
+                            <div class="take-card__switch-title">启用定餐</div>
+                            <div class="take-card__switch-desc">控制商户线上定餐与预约下单能力</div>
+                        </div>
+                        <el-switch v-model="state.mchDetail.functionScope.tableReservation"
+                            :loading="state.switchLoadingKey === 'tableReservation'" inline-prompt active-text="开"
+                            inactive-text="关" @change="handleOrderingFoodSwitchChange" />
+                    </div>
+                    <div class="take-card__actions">
+                        <el-button icon="Edit" circle />
+                        <el-button icon="RefreshRight" circle />
+                    </div>
+                </div>
+            </div>
+            <div class="take-card__placeholder">
+                预留定餐配置内容区，后续可以继续补充预约时间、可订餐次、下单限制等配置项。
+            </div>
+        </div>
+
         <take-out-form ref="takeOutFormRef" @refresh="getTakeOutSettingDetail" />
     </div>
 </template>
 
 <script setup lang="ts" name="TakeOutSetting">
-import { displayPrice, storePrice } from "/@/utils/formatMoney"
+import { displayPrice } from "/@/utils/formatMoney"
 import { useDict } from "/@/hooks/dict"
+import { useMessage } from "/@/hooks/message"
 
 const TakeOutForm = defineAsyncComponent(() => import("./take-out-form.vue"));
 
@@ -50,9 +125,19 @@ const props = withDefaults(defineProps<{
     mchId: ""
 })
 
+const createDefaultFunctionScope = () => ({
+    orderingFoodEnable: false,
+    tableReservation: false,
+    takeOutEnable: false,
+})
+
 const takeOutFormRef = ref()
 const state = reactive<any>({
     mchId: null,
+    switchLoadingKey: "",
+    mchDetail: {
+        functionScope: createDefaultFunctionScope(),
+    },
     takeOutSetting: {}
 })
 
@@ -61,6 +146,7 @@ watch(
     (newVal, oldVal) => {
         if (newVal !== oldVal) {
             state.mchId = newVal
+            getMchDetail()
             getTakeOutSettingDetail()
         }
     }, { immediate: true }
@@ -79,38 +165,243 @@ async function getTakeOutSettingDetail() {
     }
 }
 
+// 获取食堂详情
+async function getMchDetail() {
+    try {
+        const { data, code } = await mchManageApi.getObj(state.mchId)
+        if (code != 0) {
+            throw new Error()
+        }
+        data.functionScope = {
+            ...createDefaultFunctionScope(),
+            ...(data.functionScope || {})
+        }
+        state.mchDetail = data
+    } catch (error) {
+        console.log("获取食堂详情详情", error);
+    }
+}
+async function handleFunctionScopeChange(key: string, value: boolean, label: string) {
+    if (!state.mchDetail.id) return
+    const oldValue = !value
+    try {
+        state.switchLoadingKey = key
+        await mchManageApi.putObj({
+            ...state.mchDetail,
+            functionScope: {
+                ...state.mchDetail.functionScope,
+                [key]: value
+            }
+        })
+        useMessage().success(value ? `已开启${label}` : `已关闭${label}`)
+        await getMchDetail()
+    } catch (error: any) {
+        state.mchDetail.functionScope[key] = oldValue
+        useMessage().error(error?.msg || `切换${label}失败`)
+    } finally {
+        state.switchLoadingKey = ""
+    }
+}
+
+function handleTakeOutSwitchChange(value: boolean) {
+    return handleFunctionScopeChange("takeOutEnable", value, "外卖配置")
+}
+
+function handleOrderingFoodSwitchChange(value: boolean) {
+    return handleFunctionScopeChange("tableReservation", value, "定餐配置")
+}
+
+function handleReportFoodSwitchChange(value: boolean) {
+    return handleFunctionScopeChange("orderingFoodEnable", value, "报餐配置")
+}
+
 </script>
 
 <style lang="scss" scoped>
+.take-setting-list {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+}
+
 .take-card {
     width: 100%;
-    border-radius: 4px;
-    margin-bottom: 5px;
+    padding: 18px 20px 20px;
+    border: 1px solid #ebeef5;
+    border-radius: 16px;
+    box-shadow: 0 8px 24px rgba(31, 35, 41, 0.06);
+
+    &__header {
+        display: flex;
+        align-items: flex-start;
+        justify-content: space-between;
+        gap: 20px;
+        padding-bottom: 16px;
+        margin-bottom: 16px;
+        border-bottom: 1px solid rgba(235, 238, 245, 0.9);
+    }
+
+    &__intro {
+        min-width: 220px;
+        padding-top: 6px;
+    }
+
+    &__title {
+        color: #1f2329;
+        font-size: 18px;
+        font-weight: 600;
+        line-height: 26px;
+    }
+
+    &__subtitle {
+        margin-top: 4px;
+        color: #86909c;
+        font-size: 13px;
+        line-height: 20px;
+    }
+
+    &__toolbar {
+        display: flex;
+        align-items: center;
+        justify-content: flex-end;
+        gap: 12px;
+    }
+
+    &__switch-panel {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 12px;
+        min-height: 72px;
+        min-width: 320px;
+        padding: 14px 16px;
+        border: 1px solid rgba(64, 158, 255, 0.14);
+        border-radius: 14px;
+
+        &--disabled {
+            border-color: rgba(201, 205, 212, 0.68);
+        }
+    }
+
+    &__switch-copy {
+        min-width: 0;
+    }
+
+    &__switch-title {
+        color: #1f2329;
+        font-size: 14px;
+        font-weight: 600;
+        line-height: 22px;
+    }
+
+    &__switch-desc {
+        margin-top: 4px;
+        color: #86909c;
+        font-size: 12px;
+        line-height: 18px;
+    }
+
+    &__actions {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        flex-shrink: 0;
+        padding-left: 4px;
+    }
+
+    &__placeholder {
+        padding: 20px 18px;
+        border: 1px dashed rgba(201, 205, 212, 0.9);
+        border-radius: 14px;
+        color: #86909c;
+        font-size: 13px;
+        line-height: 22px;
+    }
 }
 
 .take-info {
-    padding: 10px 10px;
     display: grid;
     grid-template-columns: repeat(4, minmax(0, 1fr));
-    gap: 10px;
+    gap: 14px;
 
     &-item {
         display: flex;
-        align-items: center;
-        width: 100%;
+        flex-direction: column;
+        align-items: flex-start;
+        gap: 8px;
+        min-height: 96px;
+        padding: 16px;
+        border: 1px solid rgba(235, 238, 245, 0.9);
+        border-radius: 14px;
+        transition: all 0.2s ease;
 
-        >span:first-child {
-            width: 20%;
-            color: #333;
-            font-size: 13px;
-            font-weight: 500;
-        }
-
-        >span:last-child {
-            flex: 1;
-            color: #666;
-            font-size: 13px;
+        &:hover {
+            transform: translateY(-2px);
+            border-color: rgba(64, 158, 255, 0.28);
+            box-shadow: 0 10px 22px rgba(64, 158, 255, 0.08);
         }
     }
 }
-</style>
\ No newline at end of file
+
+.take-info-item {
+    &__label {
+        color: #86909c;
+        font-size: 13px;
+        line-height: 20px;
+    }
+
+    &__value {
+        color: #1f2329;
+        font-size: 18px;
+        font-weight: 600;
+        line-height: 24px;
+        word-break: break-all;
+    }
+}
+
+@media (max-width: 1200px) {
+    .take-card {
+        &__toolbar {
+            flex-direction: column;
+            align-items: stretch;
+        }
+
+        &__actions {
+            justify-content: flex-end;
+        }
+    }
+
+    .take-info {
+        grid-template-columns: repeat(2, minmax(0, 1fr));
+    }
+}
+
+@media (max-width: 768px) {
+    .take-card {
+        padding: 16px;
+
+        &__header {
+            flex-direction: column;
+            align-items: stretch;
+        }
+
+        &__intro {
+            padding-top: 0;
+        }
+
+        &__switch-panel {
+            flex-direction: column;
+            align-items: flex-start;
+        }
+
+        &__actions {
+            justify-content: flex-end;
+            flex-wrap: wrap;
+        }
+    }
+
+    .take-info {
+        grid-template-columns: 1fr;
+    }
+}
+</style>
diff --git a/src/views/mch/mch-manage/detail.vue b/src/views/mch/mch-manage/detail.vue
index ac5fe0af..09c91cfb 100644
--- a/src/views/mch/mch-manage/detail.vue
+++ b/src/views/mch/mch-manage/detail.vue
@@ -93,9 +93,9 @@
         <div class="main">
             <div class="main-tab">
                 <el-tabs v-model="activeTab" class="demo-tabs">
-                    <el-tab-pane label="分店" name="FD_SETTING" />
-                    <el-tab-pane label="食堂" name="TAKE_OUT_SETTING" />
                     <el-tab-pane label="支付相关" name="PAY_SETTING" />
+                    <el-tab-pane label="商户功能" name="TAKE_OUT_SETTING" />
+                    <el-tab-pane label="分店" name="FD_SETTING" />
                 </el-tabs>
             </div>
             <div class="main-content">
@@ -115,7 +115,7 @@ const PaySetting = defineAsyncComponent(() => import("./components/pay-setting.v
 
 const { merchant_type } = useDict("merchant_type")
 
-const activeTab = ref("FD_SETTING")
+const activeTab = ref("PAY_SETTING")
 
 const takeOutSettingRef = ref()
 const paySettingRef = ref()