feat:bug修改
This commit is contained in:
1 parent
f3d849489b
commit
1ec1fcc474
5 files changed
+345
-54
No files matched your search
@@ -1,5 +1,5 @@
|
||||
# 网站主标题
|
||||
VITE_GLOBAL_TITLE= '资安信'
|
||||
VITE_GLOBAL_TITLE= '后勤管理系统'
|
||||
|
||||
# footer
|
||||
VITE_FOOTER_TITLE= '©2024 bsd.com'
|
||||
|
||||
+1
-1
@@ -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>
|
||||
|
||||
@@ -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" />
|
||||
|
||||
@@ -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>
|
||||
|
||||
.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>
|
||||
@@ -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()
|
||||
|
||||
Reference in new issue
Block a user