修复总结后的问题,详见企业微信文档

This commit is contained in:
gyq
2026-05-07 14:34:03 +08:00
parent ffad9432c5
commit ea5a4c14e9
41 changed files with 2678 additions and 1120 deletions

View File

@@ -59,6 +59,22 @@ const ShopApi = {
params, params,
}); });
}, },
// 重置密码
putPassword(data: any) {
return request({
url: `/account/admin/sysUser/pwd`,
method: "put",
data,
});
},
// 续期记录
registerRecord(params: any) {
return request({
url: `${baseURL}/registerRecord`,
method: "get",
params,
});
},
}; };
export default ShopApi; export default ShopApi;

View File

@@ -45,14 +45,13 @@ const API = {
responseType: "blob", responseType: "blob",
}); });
}, },
// 重置密码
pwd(data: any) { pwd(data: any) {
return request({ return request({
url: `${baseURL}/pwd`, url: `${baseURL}/pwd`,
method: "put", method: "put",
data data
}); });
} },
,
} }
export default API; export default API;

View File

@@ -12,6 +12,19 @@ export const getRegion = () => {
}); });
} }
/**
* 获取所有短信签名
* @param params
* @returns
*/
export const getSms = ({ type }: { type: string }) => {
return request<any, any[]>({
url: `/account/admin/common/sms`,
method: "get",
params: { type }
});
}
/** /**
* 获取所有银行 * 获取所有银行
* @param params * @param params

View File

@@ -213,6 +213,14 @@ const AuthAPI = {
params, params,
responseType: 'blob' responseType: 'blob'
}); });
},
// 商品-批量操作
batchOperate(params: any) {
return request<any, Responseres>({
url: `${baseURL}/batchOperate`,
method: "get",
params
});
} }
}; };

View File

@@ -386,6 +386,7 @@ const emit = defineEmits<{
editClick: [row: IObject]; editClick: [row: IObject];
operatClick: [data: IOperatData]; operatClick: [data: IOperatData];
filterChange: [data: IObject]; filterChange: [data: IObject];
selectChange: []
}>(); }>();
// 主键 // 主键
@@ -490,6 +491,7 @@ function handleSelectionChange(selection: any[]) {
console.log("defaultSelData.value", defaultSelData.value); console.log("defaultSelData.value", defaultSelData.value);
selectionData.value = selection; selectionData.value = selection;
removeIds.value = selection.map((item) => item[pk]); removeIds.value = selection.map((item) => item[pk]);
emit('selectChange', getselectTable())
} }
// 获取选中的表格数据 // 获取选中的表格数据
function getselectTable() { function getselectTable() {

View File

@@ -5,18 +5,8 @@
<el-input v-model="searhForm.name" placeholder="商品名称"></el-input> <el-input v-model="searhForm.name" placeholder="商品名称"></el-input>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-select <el-select style="width: 200px" v-model="searhForm.category" placeholder="商品分类" :disabled="disableCategory">
style="width: 200px" <el-option :label="item.name" :value="item.id" v-for="item in categoryList" :key="item.id"></el-option>
v-model="searhForm.category"
placeholder="商品分类"
:disabled="disableCategory"
>
<el-option
:label="item.name"
:value="item.id"
v-for="item in categoryList"
:key="item.id"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@@ -25,7 +15,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
<div class="head-container"> <div class="head-container">
<el-table ref="table" :data="tableData.list" height="500" v-loading="tableData.loading"> <el-table ref="table" :data="tableData.list" height="500" border stripe v-loading="tableData.loading">
<el-table-column type="selection" width="55" align="center" v-if="!radio"></el-table-column> <el-table-column type="selection" width="55" align="center" v-if="!radio"></el-table-column>
<el-table-column label="商品信息"> <el-table-column label="商品信息">
<template v-slot="scope"> <template v-slot="scope">
@@ -72,14 +62,9 @@
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<el-pagination <el-pagination :total="tableData.total" :current-page="tableData.page" :page-size="tableData.size"
:total="tableData.total" @current-change="paginationChange" @size-change="sizeChange"
:current-page="tableData.page" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
:page-size="tableData.size"
@current-change="paginationChange"
@size-change="sizeChange"
layout="total, sizes, prev, pager, next, jumper"
></el-pagination>
<template #footer> <template #footer>
<span class="dialog-footer" v-if="!radio"> <span class="dialog-footer" v-if="!radio">
<el-button @click="dialogVisible = false"> </el-button> <el-button @click="dialogVisible = false"> </el-button>
@@ -132,7 +117,7 @@ export default {
}, },
// 确定选商品 // 确定选商品
confirmHandle() { confirmHandle() {
let res = this.$refs.table.selection; let res = this.$refs.table.getSelectionRows();
console.log(res); console.log(res);
if (!res) { if (!res) {
return ElMessage.error("请选择商品"); return ElMessage.error("请选择商品");
@@ -148,6 +133,7 @@ export default {
this.tableData.page = 1; this.tableData.page = 1;
this.tableData.size = 10; this.tableData.size = 10;
this.tableData.list = []; this.tableData.list = [];
this.getTableData();
}, },
// 分页大小改变 // 分页大小改变
sizeChange(e) { sizeChange(e) {

View File

@@ -0,0 +1,123 @@
<template>
<!-- 验证码按钮 - 纯功能高度定制版 -->
<el-button :type="buttonType" :size="buttonSize" :disabled="disabled || isCountingDown" :loading="isLoading"
class="captcha-btn" @click="handleGetCaptcha">
<!-- 倒计时状态展示 -->
<span v-if="isCountingDown">{{ countDown }} 秒后重新获取</span>
<!-- 正常状态展示 -->
<span v-else>{{ buttonText }}</span>
</el-button>
</template>
<script setup>
import { ref } from 'vue'
import { getSms } from "@/api/common";
// 接收父组件传递的自定义参数
const props = defineProps({
// 验证码类型
// editShopInfoOpePwd 店铺操作密码
// wxMiniPwd 微信小程序用户登录密码
// shopPwd 店铺登录密码
type: {
type: String,
default: 'editShopInfoOpePwd'
},
// 按钮类型primary/success/warning/danger/info/default
buttonType: {
type: String,
default: 'primary'
},
// 按钮尺寸large/default/small
buttonSize: {
type: String,
default: 'default'
},
// 正常状态按钮文字
buttonText: {
type: String,
default: '获取验证码'
},
// 倒计时总秒数
countDownNum: {
type: Number,
default: 60
},
// 手动控制按钮禁用状态
disabled: {
type: Boolean,
default: false
}
})
// 发射事件给父组件
const emit = defineEmits(['get-captcha'])
// 加载状态(请求验证码时)
const isLoading = ref(false)
// 是否正在倒计时
const isCountingDown = ref(false)
// 倒计时秒数
const countDown = ref(0)
// 倒计时定时器
let timer = null
// 获取验证码点击事件
const handleGetCaptcha = async () => {
// 倒计时中 / 加载中 / 禁用状态 禁止点击
if (isCountingDown.value || isLoading.value || props.disabled) return
try {
// 开启加载状态
isLoading.value = true
// 触发父组件的请求方法(真正的接口请求写在父组件)
await getSms({ type: props.type });
ElNotification.success({
title: '成功',
message: '验证码已发送,请注意查收',
});
// ======================
// 请求成功 → 开始倒计时
// ======================
startCountDown()
} catch (error) {
// 请求失败 → 不触发倒计时,控制台提示
console.error('', error)
} finally {
// 关闭加载状态
setTimeout(() => {
isLoading.value = false
}, 500) // 适当延迟,避免闪烁
}
}
// 倒计时核心逻辑
const startCountDown = () => {
// 初始化倒计时时间
countDown.value = props.countDownNum
isCountingDown.value = true
// 开启定时器
timer = setInterval(() => {
countDown.value--
// 倒计时结束
if (countDown.value <= 0) {
clearInterval(timer)
timer = null
isCountingDown.value = false
}
}, 1000)
}
// 页面销毁时清除定时器(防止内存泄漏)
onUnmounted(() => {
if (timer) clearInterval(timer)
})
</script>
<style scoped>
/* 你可以在这里自定义按钮默认样式,也可以在父组件覆盖 */
.captcha-btn {
min-width: 120px;
}
</style>

View File

@@ -0,0 +1,180 @@
<template>
<el-dialog title="修改密码" modal-append-to-body append-to-body v-model="dialogVisible" @close="reset" width="400px">
<el-form ref="refForm" :model="form" :rules="rules" label-width="100px">
<el-form-item label="手机号">
<el-input :value="maskPhone(shopInfo.phone)" disabled></el-input>
</el-form-item>
<el-form-item label="旧密码" prop="originalPassword">
<el-input type="password" show-password v-model="form.originalPassword" placeholder="请输入旧密码"></el-input>
</el-form-item>
<el-form-item label="新密码" prop="password">
<el-input type="password" show-password v-model="form.password" placeholder="请输入新密码"></el-input>
</el-form-item>
<el-form-item style="margin-top: -10px;"><el-text :type="isPws ? 'danger' : 'info'" size="small"
style="line-height: 16px;">注意新密码必须至少包含字母数字特殊符号中的两种且长度6-18</el-text></el-form-item>
<el-form-item label="确认新密码" prop="checkPassword">
<el-input type="password" show-password v-model="form.checkPassword" placeholder="请再次输入新密码"></el-input>
</el-form-item>
<el-form-item label="验证码" prop="code">
<div class="center">
<el-input v-model="form.code" placeholder="请输入验证码"></el-input>
<captcha-btn type="shopPwd" />
</div>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" :loading="formLoading" @click="submitHandle"> </el-button>
</span>
</template>
</el-dialog>
</template>
<script setup lang="ts">
import sysUser from "@/api/account/sysUser";
import { ElNotification } from "element-plus";
import { maskPhone } from "@/utils";
import CaptchaBtn from "./CaptchaBtn.vue";
const props = defineProps({
// 修改成功后的跳转类型 1- 跳转到登录页 2- 留在当前页
type: {
type: [String, Number],
default: 1
}
})
const shopInfo = ref({
phone: ''
})
const router = useRouter();
const dialogVisible = ref(false);
const formLoading = ref(false);
const isPws = ref(false);
const form = reactive({
id: '',
originalPassword: "", // 原密码
code: '', // 验证码
checkPassword: "", // 确认新密码
password: "", // 新密码
});
function reset() {
form.originalPassword = "";
form.checkPassword = "";
form.password = "";
form.code = "";
refForm.value.resetFields();
}
const reg = /^(?![0-9]+$)(?![a-zA-Z]+$)(?![^\da-zA-Z]+$).{6,}$/;
const validateNewPass = (rule: any, value: string, callback: (error?: Error) => void) => {
if (!form.password) {
callback(new Error(" "));
} else if (form.password === form.originalPassword) {
callback(new Error("请输入与旧密码不同的新密码"));
} else if (form.password.length < 6 || form.password.length > 18) {
// 密码长度6 - 18位
callback(new Error("密码长度应为6-18位"));
} else if (!reg.test(form.password)) {
// 新密码长度不能小于6 需包含字母、数字、特殊符号中至少两种
isPws.value = true;
callback(new Error(""));
} else {
isPws.value = false;
callback();
}
};
const validateRnewPass = (rule: any, value: string, callback: (error?: Error) => void) => {
if (!form.checkPassword) {
callback(new Error(" "));
} else if (form.checkPassword !== form.password) {
callback(new Error("两次密码输入不一致"));
} else {
callback();
}
};
const rules = {
originalPassword: [
{
required: true,
message: " ",
trigger: "blur",
},
],
password: [
{
required: true,
validator: validateNewPass,
trigger: "blur",
},
],
checkPassword: [
{
required: true,
validator: validateRnewPass,
trigger: "blur",
},
],
code: [
{
required: true,
message: " ",
trigger: "blur",
},
],
};
const emit = defineEmits(['success'])
const refForm = ref();
// 提交修改密码
function submitHandle() {
refForm.value.validate(async (vaild: boolean) => {
if (vaild) {
try {
formLoading.value = true;
await sysUser.pwd(form);
if (props.type == 1) {
ElNotification.success("密码修改成功,请重新登录");
setTimeout(() => {
router.push("/login");
}, 1000);
} else {
ElNotification.success("密码修改成功");
dialogVisible.value = false;
}
emit('success')
} catch (error) {
formLoading.value = false;
console.log(error);
}
}
});
}
function show(e: object) {
console.log(e);
shopInfo.value = e
form.id = e.id
dialogVisible.value = true
}
defineExpose({
show,
});
</script>
<style lang="scss" scoped>
.center {
display: flex;
align-items: center;
gap: 10px;
}
</style>

View File

@@ -10,41 +10,25 @@
<template #dropdown> <template #dropdown>
<el-dropdown-menu> <el-dropdown-menu>
<el-dropdown-item @click="handleOpenUserProfile">店铺配置</el-dropdown-item> <el-dropdown-item @click="handleOpenUserProfile">店铺配置</el-dropdown-item>
<el-dropdown-item divided @click="dialogVisible = true">修改密码</el-dropdown-item> <el-dropdown-item divided @click="refResetPasswordRef.show(shopInfo)">修改密码</el-dropdown-item>
<el-dropdown-item divided @click="logout">退出登录</el-dropdown-item> <el-dropdown-item divided @click="logout">退出登录</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</template> </template>
</el-dropdown> </el-dropdown>
<el-dialog title="修改密码" modal-append-to-body append-to-body v-model="dialogVisible" @close="reset" width="400px"> <resetPassword ref="refResetPasswordRef" />
<el-form ref="refForm" :model="form" :rules="rules">
<el-form-item label="旧密码" prop="oldPass">
<el-input type="password" show-password v-model="form.oldPass" placeholder="请输入旧密码"></el-input>
</el-form-item>
<el-form-item label="新密码" prop="newPass">
<el-input type="password" show-password v-model="form.newPass" placeholder="请输入新密码"></el-input>
</el-form-item>
<el-form-item label="确认新密码" prop="rnewPass">
<el-input type="password" show-password v-model="form.rnewPass" placeholder="请再次输入新密码"></el-input>
</el-form-item>
</el-form>
<template #footer>
<span class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" :loading="formLoading" @click="submitHandle"> </el-button>
</span>
</template>
</el-dialog>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import sysUser from "@/api/account/sysUser";
defineOptions({ defineOptions({
name: "UserProfile", name: "UserProfile",
}); });
import { ElNotification } from "element-plus";
import { useTagsViewStore, useUserStore } from "@/store"; import { useTagsViewStore, useUserStore } from "@/store";
import { useCartsStore } from '@/store/modules/carts' import { useCartsStore } from '@/store/modules/carts'
import resetPassword from "@/components/resetPassword/index.vue";
const shopInfo = JSON.parse(localStorage.getItem("userInfo") || "{}");
const refResetPasswordRef = ref(null);
const tagsViewStore = useTagsViewStore(); const tagsViewStore = useTagsViewStore();
const userStore = useUserStore(); const userStore = useUserStore();
@@ -53,91 +37,6 @@ const cartStore = useCartsStore()
const route = useRoute(); const route = useRoute();
const router = useRouter(); const router = useRouter();
const dialogVisible = ref(false);
const formLoading = ref(false);
const form = reactive({
oldPass: "",
newPass: "",
rnewPass: "",
});
function reset() {
form.oldPass = "";
form.newPass = "";
form.rnewPass = "";
refForm.value.resetFields();
}
const validateNewPass = (rule: any, value: string, callback: (error?: Error) => void) => {
if (!form.newPass) {
callback(new Error(" "));
} else if (form.newPass === form.oldPass) {
callback(new Error("请输入与旧密码不同的新密码"));
} else {
callback();
}
};
const validateRnewPass = (rule: any, value: string, callback: (error?: Error) => void) => {
if (!form.rnewPass) {
callback(new Error(" "));
} else if (form.rnewPass !== form.newPass) {
callback(new Error("两次密码输入不一致"));
} else {
callback();
}
};
const rules = {
oldPass: [
{
required: true,
message: " ",
trigger: "blur",
},
],
newPass: [
{
required: true,
validator: validateNewPass,
trigger: "blur",
},
],
rnewPass: [
{
required: true,
validator: validateRnewPass,
trigger: "blur",
},
],
};
const refForm = ref();
// 提交修改密码
function submitHandle() {
refForm.value.validate(async (vaild: boolean) => {
if (vaild) {
try {
formLoading.value = true;
const res = await sysUser.pwd({
originalPassword: form.oldPass,
checkPassword: form.newPass,
password: form.newPass,
});
ElNotification.success("修改成功,请重新登陆");
userStore
.logout()
.then(() => {
tagsViewStore.delAllViews();
})
.then(() => {
router.push(`/login?redirect=${route.fullPath}`);
});
} catch (error) {
formLoading.value = false;
console.log(error);
}
}
});
}
/** /**
* 打开个人中心页面 * 打开个人中心页面
*/ */

View File

@@ -322,3 +322,41 @@ export function isValidMobile(phone: string): boolean {
const mobileRegex = /^1[3-9]\d{9}$/; const mobileRegex = /^1[3-9]\d{9}$/;
return mobileRegex.test(s); return mobileRegex.test(s);
} }
/**
* 手机号脱敏:隐藏中间四位数字
* @param {string | number} phone - 原始手机号(支持数字/字符串)
* @returns {string} 脱敏后的手机号,如 138****1234
*/
export function maskPhone(phone) {
// 先转成字符串,避免传入数字类型报错
const phoneStr = String(phone).trim();
// 简单校验必须是11位数字
if (!/^1\d{10}$/.test(phoneStr)) {
console.warn('手机号格式不正确');
return phoneStr; // 格式错误直接返回原值
}
// 核心前3位 + **** + 后4位
return phoneStr.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
}
/**
* 金额保留两位小数 不四舍五入
* @param {number} num 金额数字
* @param {boolean} hasSymbol 是否带¥符号默认true
* @returns {string}
*/
export function formatMoney(num, hasSymbol = true) {
// 防止非数字、空值报错
if (isNaN(Number(num))) num = 0;
// 不四舍五入截断两位小数
const value = Math.floor(Math.abs(num) * 100) / 100;
// 拼接两位小数
const fixedNum = value.toFixed(2);
// 负数处理
const result = num < 0 ? `-${fixedNum}` : fixedNum;
// 默认返回带¥
return hasSymbol ? `¥${result}` : result;
}

View File

@@ -0,0 +1,81 @@
<template>
<el-dialog :title="form.id ? '编辑耗材类型' : '添加耗材类型'" width="600px" v-model="visible" @close="onClose">
<el-form ref="formRef" :model="form" :rules="rules" label-width="120" label-position="right">
<el-form-item label="耗材类型名称" prop="name">
<el-input v-model="form.name" placeholder="请输入耗材类型名称" :maxlength="20"></el-input>
</el-form-item>
<el-form-item label="启用">
<el-switch v-model="form.status" :active-value="1" :inactive-value="0"></el-switch>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="visible = false"> </el-button>
<el-button type="primary" @click="handleOk" :loading="confirmLoading"> </el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import _ from 'lodash'
import { ref } from 'vue'
import Api from "@/api/product/cons-group";
const visible = ref(false)
const formRef = ref(null)
const form = ref({
name: '',
status: 1
})
const rules = ref({
name: [
{
required: true,
message: '请输入耗材类型名称',
trigger: 'blur'
}
]
})
const emit = defineEmits(['success'])
const confirmLoading = ref(false)
function handleOk() {
formRef.value.validate(async vaild => {
try {
if (vaild) {
confirmLoading.value = true
if (form.value.id) {
await Api.edit(form.value)
ElMessage.success('编辑成功')
} else {
await Api.add(form.value)
ElMessage.success('添加成功')
}
emit('success')
visible.value = false
}
} catch (error) {
console.log(error);
} finally {
confirmLoading.value = false
}
})
}
function onClose() {
formRef.value.resetFields()
form.value.name = ''
form.value.status = 1
}
function open(obj) {
visible.value = true
if (obj && obj.id) {
form.value = _.cloneDeep(obj)
}
}
defineExpose({ open })
</script>

View File

@@ -9,17 +9,9 @@
@reset-click="handleResetClick" @reset-click="handleResetClick"
/> --> /> -->
<!-- 列表 --> <!-- 列表 -->
<page-content <page-content ref="contentRef" :content-config="contentConfig" @add-click="handleAddClick"
ref="contentRef" @edit-click="handleEditClick" @export-click="handleExportClick" @search-click="handleSearchClick"
:content-config="contentConfig" @toolbar-click="handleToolbarClick" @operat-click="handleOperatClick" @filter-change="handleFilterChange">
@add-click="handleAddClick"
@edit-click="handleEditClick"
@export-click="handleExportClick"
@search-click="handleSearchClick"
@toolbar-click="handleToolbarClick"
@operat-click="handleOperatClick"
@filter-change="handleFilterChange"
>
<template #status="scope"> <template #status="scope">
<el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'"> <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
{{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }} {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
@@ -29,36 +21,22 @@
{{ returnOptionsLabel(scope.prop, scope.row[scope.prop]) }} {{ returnOptionsLabel(scope.prop, scope.row[scope.prop]) }}
</template> </template>
<template #switch="scope"> <template #switch="scope">
<el-switch <el-switch v-model="scope.row[scope.prop]" disabled :active-value="1" :inactive-value="0"></el-switch>
v-model="scope.row[scope.prop]"
disabled
:active-value="1"
:inactive-value="0"
></el-switch>
</template> </template>
<template #mobile="scope"> <template #mobile="scope">
<el-text>{{ scope.row[scope.prop] }}</el-text> <el-text>{{ scope.row[scope.prop] }}</el-text>
<copy-button <copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" />
v-if="scope.row[scope.prop]"
:text="scope.row[scope.prop]"
style="margin-left: 2px"
/>
</template> </template>
</page-content> </page-content>
<!-- 新增 --> <!-- 新增 -->
<page-modal <page-modal ref="addModalRef" :modal-config="addModalConfig" @submit-click="handleSubmitClick"></page-modal>
ref="addModalRef"
:modal-config="addModalConfig"
@submit-click="handleSubmitClick"
></page-modal>
<!-- 编辑 --> <!-- 编辑 -->
<page-modal <page-modal ref="editModalRef" :modal-config="editModalConfig" @submit-click="handleSubmitClick"></page-modal>
ref="editModalRef"
:modal-config="editModalConfig" <!-- 添加分类 -->
@submit-click="handleSubmitClick" <addClassificationModal ref="addClassificationModalRef" @success="handleResetClick" />
></page-modal>
</div> </div>
</template> </template>
@@ -72,6 +50,9 @@ import editModalConfig from "./config/edit";
import searchConfig from "./config/search"; import searchConfig from "./config/search";
import { returnOptionsLabel } from "./config/config"; import { returnOptionsLabel } from "./config/config";
import { isSyncStatus } from "@/utils/index"; import { isSyncStatus } from "@/utils/index";
import addClassificationModal from "./components/addClassificationModal.vue";
const addClassificationModalRef = ref(null)
const { const {
searchRef, searchRef,
@@ -98,16 +79,18 @@ if (isSyncStatus()) {
// 新增 // 新增
async function handleAddClick() { async function handleAddClick() {
addModalRef.value?.setModalVisible(); addClassificationModalRef.value.open()
// addModalRef.value?.setModalVisible();
// addModalConfig.formItems[2]!.attrs!.data = // addModalConfig.formItems[2]!.attrs!.data =
} }
// 编辑 // 编辑
async function handleEditClick(row: IObject) { async function handleEditClick(row: IObject) {
editModalRef.value?.handleDisabled(false); addClassificationModalRef.value.open(row)
editModalRef.value?.setModalVisible(); // editModalRef.value?.handleDisabled(false);
// 根据id获取数据进行填充 // editModalRef.value?.setModalVisible();
console.log(row); // // 根据id获取数据进行填充
editModalRef.value?.setFormData({ ...row }); // console.log(row);
// editModalRef.value?.setFormData({ ...row });
} }
1; 1;
// 其他工具栏 // 其他工具栏

View File

@@ -6,10 +6,13 @@
<el-input v-model="form.conName" placeholder="请输入耗材名称"></el-input> <el-input v-model="form.conName" placeholder="请输入耗材名称"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="耗材分类" prop="consGroupId"> <el-form-item label="耗材分类" prop="consGroupId">
<el-select v-model="form.consGroupId" placeholder="请选择耗材分类" style="width: 200px"> <div class="center" style="gap: 14px;">
<el-option v-for="option in consGroups" :key="option.conTypeId" :label="option.label" <el-select v-model="form.consGroupId" placeholder="请选择耗材分类" style="width: 200px">
:value="option.id"></el-option> <el-option v-for="option in consGroups" :key="option.conTypeId" :label="option.label"
</el-select> :value="option.id"></el-option>
</el-select>
<el-button type="primary" icon="Plus" @click="addClassificationModalRef.open()">添加耗材类型</el-button>
</div>
</el-form-item> </el-form-item>
<el-form-item label="耗材价格" prop="price"> <el-form-item label="耗材价格" prop="price">
<div class="center"> <div class="center">
@@ -54,6 +57,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-dialog> </el-dialog>
<addClassificationModal ref="addClassificationModalRef" @success="getConsGroups" />
</template> </template>
@@ -62,6 +66,9 @@ import { ref, reactive, computed } from "vue";
import consApi from "@/api/product/cons"; import consApi from "@/api/product/cons";
import consGroupApi from "@/api/product/cons-group"; import consGroupApi from "@/api/product/cons-group";
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import addClassificationModal from "../../classification/components/addClassificationModal.vue";
const addClassificationModalRef = ref(null)
const consGroups = ref([]); const consGroups = ref([]);
const rules = { const rules = {

View File

@@ -97,13 +97,13 @@ const contentConfig: IContentConfig = {
align: "center", align: "center",
prop: "conName", prop: "conName",
}, },
{ // {
label: "单位", // label: "单位",
align: "center", // align: "center",
prop: "conUnit", // prop: "conUnit",
templet: "custom", // templet: "custom",
slotName: "conUnit", // slotName: "conUnit",
}, // },
{ {
label: "所属商品", label: "所属商品",
align: "center", align: "center",
@@ -112,14 +112,24 @@ const contentConfig: IContentConfig = {
}, },
{ {
label: "库存数量", label: "库存数量",
align: "center", align: "left",
prop: "stockNumber", prop: "stockNumber",
templet: "custom",
slotName: "stockNumber",
}, },
{ {
label: "预警值", label: "预警值",
align: "center", align: "center",
prop: "conWarning", prop: "conWarning",
}, },
{
width: '120',
label: "是否检测耗材",
align: "center",
prop: "isStock",
templet: "custom",
slotName: "isStock",
},
{ {
label: "是否启用", label: "是否启用",
align: "center", align: "center",

View File

@@ -10,6 +10,25 @@
<page-content ref="contentRef" :content-config="contentConfig" @add-click="handleAddClick" <page-content ref="contentRef" :content-config="contentConfig" @add-click="handleAddClick"
@edit-click="handleEditClick" @export-click="handleExportClick" @search-click="handleSearchClick" @edit-click="handleEditClick" @export-click="handleExportClick" @search-click="handleSearchClick"
@toolbar-click="handleToolbarClick" @operat-click="handleOperatClick" @filter-change="handleFilterChange"> @toolbar-click="handleToolbarClick" @operat-click="handleOperatClick" @filter-change="handleFilterChange">
<template #stockNumber="scope">
<div class="columne">
<div class="center">
<el-text>第一单位</el-text>
<el-text>{{ scope.row.stockNumber }}/{{ scope.row.conUnit }}</el-text>
</div>
<div class="center" v-if="scope.row.conUnitTwo">
<el-text>第二单位</el-text>
<el-text>{{ scope.row.stockNumber / scope.row.conUnitTwoConvert }}/{{ scope.row.conUnitTwo }}</el-text>
</div>
<div class="center" v-else>
<el-text type="info">未设置第二单位</el-text>
</div>
</div>
</template>
<template #isStock="scope">
<el-switch v-model="scope.row.isStock" :active-value="1" :inactive-value="0"
@click="isStockChange($event, scope.row)"></el-switch>
</template>
<template #status="scope"> <template #status="scope">
<el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'"> <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
{{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }} {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
@@ -124,6 +143,12 @@ const {
handleFilterChange, handleFilterChange,
} = usePage(); } = usePage();
async function isStockChange(e, row) {
// console.log('isStockChange.e', e);
// console.log('isStockChange.row', row);
await consApi.edit(row)
}
function toGoods(id: number | string) { function toGoods(id: number | string) {
router.push({ path: "/product/index", query: { id: id } }); router.push({ path: "/product/index", query: { id: id } });
} }
@@ -280,6 +305,11 @@ onMounted(() => {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.center {
display: flex;
gap: 10px;
}
.goodslang { .goodslang {
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;

View File

@@ -0,0 +1,163 @@
<template>
<el-dialog :title="forms.id ? '编辑分组' : '添加分组'" width="600px" v-model="visible" @close="onClose">
<el-form :model="forms" label-width="120px" ref="elFormref" :rules="rules">
<el-form-item label="分组名称" prop="name">
<el-input v-model="forms.name" />
</el-form-item>
<el-form-item label="选择商品">
<el-button type="primary" icon="Plus" @click="addgoods">添加商品</el-button>
</el-form-item>
<el-form-item label="" v-if="selectData.length">
<!-- 选责商品列表 -->
<selectGoodslist @deleteItememit="deleteItem($event)" :list="selectData"></selectGoodslist>
</el-form-item>
<el-form-item label="分组状态">
<el-radio-group v-model="forms.status">
<el-radio :value="1" label="启用" />
<el-radio :value="0" label="禁用" />
</el-radio-group>
</el-form-item>
<el-form-item label="售卖时间管控">
<el-radio-group v-model="forms.useTime">
<el-radio :value="1" label="启用" />
<el-radio :value="0" label="禁用" />
</el-radio-group>
</el-form-item>
<el-form-item label="时间选择" v-if="forms.useTime == 1">
<el-time-picker value-format="HH:mm:ss" v-model="forms.time" is-range range-separator="到"
start-placeholder="开始时间" end-placeholder="结束时间" />
</el-form-item>
<el-form-item label="排列方式">
<el-radio-group v-model="forms.sortMode">
<el-radio value="0" label="默认" />
<el-radio value="1" label="价格由高到低" />
<el-radio value="2" label="价格由低到高" />
<el-radio value="3" label="销量由高到低" />
<el-radio value="4" label="销量由低到高" />
</el-radio-group>
</el-form-item>
<el-form-item label="分组排序">
<el-input-number v-model="forms.sort" controls-position="right" />
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="visible = false"> </el-button>
<el-button type="primary" @click="addConfirm" :loading="confirmLoading"> </el-button>
</div>
</template>
</el-dialog>
<!-- 新增添加商品 -->
<GoodsSelect ref="GoodsSelectRef" @success="e => selectData = e" />
</template>
<script setup>
import _ from 'lodash'
import { ref } from 'vue'
import selectGoodslist from '../goodsGroupconfig/selectGoodslist.vue';
import UserAPI from "@/api/onlineShop/goodsGroupconfig";
import GoodsSelect from '@/components/GoodsSelect/index.vue'
const visible = ref(false)
const GoodsSelectRef = ref(null)
const elFormref = ref(null);
let selectData = ref([]);
const formsObj = {
name: "",
status: 1,
useTime: 0,
sortMode: "0",
sort: 1,
time: "",
saleEndTime: '',
saleStartTime: '',
productIds: '',
productList: ''
}
let forms = ref(_.cloneDeep(formsObj));
const rules = ref({
name: [{ required: true, message: "请输入分组名称", trigger: "blur" }],
});
// 重置表单
function onClose() {
forms.value = _.cloneDeep(formsObj)
elFormref.value.resetFields()
selectData.value = []
}
// 添加商品
async function addgoods() {
GoodsSelectRef.value.show(selectData.value);
}
// 删除商品
function deleteItem(data) {
selectData.value = data;
}
const emit = defineEmits(['success'])
const confirmLoading = ref(false)
// 添加编辑商品分组
function addConfirm() {
elFormref.value.validate(async (valid, fields) => {
try {
if (valid) {
let obj = {
...forms.value,
productList: selectData.value,
};
// 商品选择的合集
if (selectData.value.length) {
let arr = [];
selectData.value.forEach((item, index) => {
arr.push(item.id);
});
obj.productIds = arr;
}
console.log(obj, "商品分组的参数");
if (obj.time && obj.time.length) {
obj.saleStartTime = obj.time[0];
obj.saleEndTime = obj.time[1];
}
if (forms.value.id) {
if (obj.useTime == 0) {
obj.saleStartTime = null;
obj.saleEndTime = null;
}
let res = await UserAPI.update(obj);
if (res.code == 200) {
ElMessage.success("编辑成功");
}
} else {
let res = await UserAPI.addunit(obj);
if (res.code == 200) {
ElMessage.success("添加成功");
}
}
visible.value = false
emit('success')
} else {
console.log("error submit!", fields);
}
} catch (error) {
console.log(error);
}
});
}
function open(obj) {
visible.value = true
if (obj && obj.id) {
forms.value = _.cloneDeep(obj)
selectData.value = obj.productList || []
forms.value.time = [obj.saleStartTime, obj.saleEndTime]
}
}
defineExpose({
open
})
</script>

View File

@@ -5,17 +5,9 @@
<!-- 搜索 --> <!-- 搜索 -->
<!-- 列表 --> <!-- 列表 -->
<page-content <page-content ref="contentRef" :content-config="contentConfig" @add-click="handleAddClick"
ref="contentRef" @edit-click="handleEditClick" @export-click="handleExportClick" @search-click="handleSearchClick"
:content-config="contentConfig" @toolbar-click="handleToolbarClick" @operat-click="handleOperatClick" @filter-change="handleFilterChange">
@add-click="handleAddClick"
@edit-click="handleEditClick"
@export-click="handleExportClick"
@search-click="handleSearchClick"
@toolbar-click="handleToolbarClick"
@operat-click="handleOperatClick"
@filter-change="handleFilterChange"
>
<template #status="scope"> <template #status="scope">
<el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'"> <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
{{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }} {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
@@ -29,11 +21,7 @@
</template> </template>
<template #mobile="scope"> <template #mobile="scope">
<el-text>{{ scope.row[scope.prop] }}</el-text> <el-text>{{ scope.row[scope.prop] }}</el-text>
<copy-button <copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" />
v-if="scope.row[scope.prop]"
:text="scope.row[scope.prop]"
style="margin-left: 2px"
/>
</template> </template>
</page-content> </page-content>
@@ -62,11 +50,7 @@
</page-modal> --> </page-modal> -->
<!-- 编辑 --> <!-- 编辑 -->
<page-modal <page-modal ref="editModalRef" :modal-config="editModalConfig" @submit-click="handleSubmitClick">
ref="editModalRef"
:modal-config="editModalConfig"
@submit-click="handleSubmitClick"
>
<template #gender="scope"> <template #gender="scope">
<Dict v-model="scope.formData[scope.prop]" code="gender" v-bind="scope.attrs" /> <Dict v-model="scope.formData[scope.prop]" code="gender" v-bind="scope.attrs" />
</template> </template>
@@ -79,33 +63,20 @@
添加商品 添加商品
</el-button> </el-button>
<!-- 选责商品列表 --> <!-- 选责商品列表 -->
<selectGoodslist <selectGoodslist @deleteItememit="deleteItem($event)" :list="selectData"></selectGoodslist>
@deleteItememit="deleteItem($event)"
:list="selectData"
></selectGoodslist>
</div> </div>
</template> </template>
<template #addmanagementtime="scope"> <template #addmanagementtime="scope">
<template v-if="scope.formData.useTime == 1"> <template v-if="scope.formData.useTime == 1">
{{ scope.formData }} {{ scope.formData }}
<el-time-picker <el-time-picker value-format="HH:mm:ss" v-model="scope.formData.saleTime" is-range range-separator="到"
value-format="HH:mm:ss" start-placeholder="开始时间" end-placeholder="结束时间" />
v-model="scope.formData.saleTime"
is-range
range-separator=""
start-placeholder="开始时间"
end-placeholder="结束时间"
/>
</template> </template>
</template> </template>
</page-modal> </page-modal>
</template> </template>
<template v-else> <template v-else>
<page-content <page-content ref="contentRef" :content-config="contentConfig2" @operat-click="handleOperatClick">
ref="contentRef"
:content-config="contentConfig2"
@operat-click="handleOperatClick"
>
<template #status="scope"> <template #status="scope">
<el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'"> <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
{{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }} {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
@@ -113,32 +84,17 @@
</template> </template>
</page-content> </page-content>
</template> </template>
<!-- 添加/编辑分组 -->
<addGoodsGroup ref="addGoodsGroupRef" @success="handleQueryClick" />
<!-- 新增添加商品 --> <!-- 新增添加商品 -->
<myDialog <myDialog title="选择商品" width="50%" ref="myDialogRef" @Confirm="subitgood" @close="resetSelectData">
title="选择商品" <page-search ref="searchRefs" :search-config="searchConfig2" @query-click="searchs"
width="50%" @reset-click="handleResetClick" />
ref="myDialogRef" <page-content ref="contentRefs" v-if="switchref" :content-config="contentConfig2" @add-click="handleAddClick"
@Confirm="subitgood" @edit-click="handleEditClick" @export-click="handleExportClick" @search-click="handleSearchClick"
@close="resetSelectData" @toolbar-click="handleToolbarClick" @operat-click="handleOperatClick" @filter-change="handleFilterChange">
>
<page-search
ref="searchRefs"
:search-config="searchConfig2"
@query-click="searchs"
@reset-click="handleResetClick"
/>
<page-content
ref="contentRefs"
v-if="switchref"
:content-config="contentConfig2"
@add-click="handleAddClick"
@edit-click="handleEditClick"
@export-click="handleExportClick"
@search-click="handleSearchClick"
@toolbar-click="handleToolbarClick"
@operat-click="handleOperatClick"
@filter-change="handleFilterChange"
>
<template #status="scope"> <template #status="scope">
<el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'"> <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
{{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }} {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
@@ -152,21 +108,17 @@
</template> </template>
<template #mobile="scope"> <template #mobile="scope">
<el-text>{{ scope.row[scope.prop] }}</el-text> <el-text>{{ scope.row[scope.prop] }}</el-text>
<copy-button <copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" />
v-if="scope.row[scope.prop]"
:text="scope.row[scope.prop]"
style="margin-left: 2px"
/>
</template> </template>
</page-content> </page-content>
<!-- <el-table :data="selectData" border style="width: 100%"> <el-table :data="selectData" border style="width: 100%">
<el-table-column prop="date" align="center" label="Date" /> <el-table-column prop="date" align="center" label="Date" />
<el-table-column prop="address" align="center" label="Address" /> <el-table-column prop="address" align="center" label="Address" />
</el-table> --> </el-table>
</myDialog> </myDialog>
<!-- 新增 --> <!-- 新增 -->
<myDialog :title="title" width="30%" ref="myDialogRefAdd" @Confirm="addConfirm()"> <!-- <myDialog :title="title" width="50%" ref="myDialogRefAdd" @Confirm="addConfirm()">
<el-form :model="forms" label-width="120px" ref="elFormref" :rules="rules"> <el-form :model="forms" label-width="120px" ref="elFormref" :rules="rules">
<el-form-item label="分组名称" prop="name"> <el-form-item label="分组名称" prop="name">
<el-input v-model="forms.name" /> <el-input v-model="forms.name" />
@@ -175,11 +127,7 @@
<el-button type="primary" icon="Plus" @click="addgoods">添加商品</el-button> <el-button type="primary" icon="Plus" @click="addgoods">添加商品</el-button>
</el-form-item> </el-form-item>
<el-form-item label="" v-if="selectData.length"> <el-form-item label="" v-if="selectData.length">
<!-- 选责商品列表 --> <selectGoodslist @deleteItememit="deleteItem($event)" :list="selectData"></selectGoodslist>
<selectGoodslist
@deleteItememit="deleteItem($event)"
:list="selectData"
></selectGoodslist>
</el-form-item> </el-form-item>
<el-form-item label="分组状态"> <el-form-item label="分组状态">
<el-radio-group v-model="forms.status"> <el-radio-group v-model="forms.status">
@@ -194,14 +142,8 @@
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="时间选择" v-if="forms.useTime == 1"> <el-form-item label="时间选择" v-if="forms.useTime == 1">
<el-time-picker <el-time-picker value-format="HH:mm:ss" v-model="forms.time" is-range range-separator="到"
value-format="HH:mm:ss" start-placeholder="开始时间" end-placeholder="结束时间" />
v-model="forms.time"
is-range
range-separator=""
start-placeholder="开始时间"
end-placeholder="结束时间"
/>
</el-form-item> </el-form-item>
<el-form-item label="排列方式"> <el-form-item label="排列方式">
<el-radio-group v-model="forms.sortMode"> <el-radio-group v-model="forms.sortMode">
@@ -216,7 +158,7 @@
<el-input-number v-model="forms.sort" controls-position="right" /> <el-input-number v-model="forms.sort" controls-position="right" />
</el-form-item> </el-form-item>
</el-form> </el-form>
</myDialog> </myDialog> -->
</div> </div>
</template> </template>
@@ -235,6 +177,7 @@ import searchConfig2 from "./goodsGroupconfig/search2";
import myDialog from "@/components/mycomponents/myDialog.vue"; import myDialog from "@/components/mycomponents/myDialog.vue";
import selectGoodslist from "./goodsGroupconfig/selectGoodslist.vue"; import selectGoodslist from "./goodsGroupconfig/selectGoodslist.vue";
import { isSyncStatus } from "@/utils/index"; import { isSyncStatus } from "@/utils/index";
import addGoodsGroup from "./components/addGoodsGroup.vue";
const { const {
searchRef, searchRef,
@@ -268,10 +211,13 @@ if (isSyncStatus()) {
let switchref = ref(false); let switchref = ref(false);
const addGoodsGroupRef = ref(null)
// 新增 // 新增
async function handleAddClick() { async function handleAddClick() {
addModalRef.value?.setModalVisible(); addGoodsGroupRef.value.open()
selectData.value = []; // addModalRef.value?.setModalVisible();
// selectData.value = [];
// 加载上级规格下拉数据源 // 加载上级规格下拉数据源
// addModalConfig.formItems[2]!.attrs!.data = await UserAPI.getPage({ name: "" }); // addModalConfig.formItems[2]!.attrs!.data = await UserAPI.getPage({ name: "" });
// 加载角色下拉数据源 // 加载角色下拉数据源
@@ -377,22 +323,22 @@ function deleteItem(data: any) {
// 编辑 // 编辑
async function handleEditClick(row: IObject) { async function handleEditClick(row: IObject) {
editModalRef.value?.handleDisabled(false); // editModalRef.value?.handleDisabled(false);
title.value = "编辑分组"; // title.value = "编辑分组";
// 加载部门下拉数据源 // 加载部门下拉数据源
// editModalConfig.formItems[2]!.attrs!.data = await UserAPI.getPage({ name: "" }); // editModalConfig.formItems[2]!.attrs!.data = await UserAPI.getPage({ name: "" });
// editModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions(); // editModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
// 加载角色下拉数据源 // 加载角色下拉数据源
// editModalConfig.formItems[4]!.options = await RoleAPI.getOptions(); // editModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
// 根据id获取数据进行填充 // 根据id获取数据进行填充
const data = await UserAPI.getunitinfo(row.id); // const data = await UserAPI.getunitinfo(row.id);
let obj = { ...data }; // let obj = { ...data };
selectData.value = data.productList; // selectData.value = data.productList;
obj.time = [obj.saleStartTime, obj.saleEndTime]; // obj.time = [obj.saleStartTime, obj.saleEndTime];
for (let key in obj) { // for (let key in obj) {
forms[key] = obj[key]; // forms[key] = obj[key];
} // }
myDialogRefAdd.value.open(); addGoodsGroupRef.value.open(row)
// editModalRef.value?.setFormData(obj); // editModalRef.value?.setFormData(obj);
// editModalRef.value?.setModalVisible(); // editModalRef.value?.setModalVisible();
} }
@@ -400,19 +346,20 @@ async function handleEditClick(row: IObject) {
function handleToolbarClick(name: string) { function handleToolbarClick(name: string) {
console.log(name); console.log(name);
if (name === "custom1") { if (name === "custom1") {
forms = reactive({ // forms = reactive({
name: "", // name: "",
status: 1, // status: 1,
useTime: 0, // useTime: 0,
sortMode: "0", // sortMode: "0",
sort: 1, // sort: 1,
time: "", // time: "",
}); // });
selectData.value = []; // selectData.value = [];
title.value = "新增分组"; // title.value = "新增分组";
// 新增 // // 新增
myDialogRefAdd.value.open(); // myDialogRefAdd.value.open();
addGoodsGroupRef.value.open()
} }
} }
// 其他操作列 // 其他操作列

View File

@@ -9,13 +9,20 @@
<div class="form"> <div class="form">
<div class="preview_wrap"> <div class="preview_wrap">
<div class="phone_wrap"> <div class="phone_wrap">
<!-- 首页背景 -->
<div class="index_bg" v-if="tableActive == 'index_bg'"> <div class="index_bg" v-if="tableActive == 'index_bg'">
<img class="bg" v-if="!isJsonArrayString(selectItem.value)" :src="selectItem.value" alt=""> <!-- 多图轮播 -->
<el-carousel height="500px" v-else> <el-carousel height="500px"
<el-carousel-item v-for="item in JSON.parse(selectItem.value)"> v-if="isJsonArrayString(selectItem.value) && JSON.parse(selectItem.value).length > 0">
<el-carousel-item v-for="(item, idx) in JSON.parse(selectItem.value)" :key="idx">
<img class="bg" :src="item" /> <img class="bg" :src="item" />
</el-carousel-item> </el-carousel-item>
</el-carousel> </el-carousel>
<!-- 单图渲染 -->
<img class="bg" v-else-if="selectItem.value" :src="selectItem.value" alt="" />
<!-- 空状态提示 -->
<div class="empty-tip" v-else>暂无图片请上传</div>
<div class="menu_wrap"> <div class="menu_wrap">
<div class="menu_wrap_div"> <div class="menu_wrap_div">
<div class="left"> <div class="left">
@@ -46,8 +53,11 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 个人中心背景 -->
<div class="my_bg" v-if="tableActive == 'my_bg'"> <div class="my_bg" v-if="tableActive == 'my_bg'">
<img class="bg" :src="selectItem.value" /> <img class="bg" :src="selectItem.value" v-if="selectItem.value" />
<div class="empty-tip my-empty-tip" v-else>暂无图片请上传</div>
<div class="content"> <div class="content">
<div class="item" style="display: flex"> <div class="item" style="display: flex">
<div class="left"> <div class="left">
@@ -108,10 +118,13 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 会员背景 -->
<div class="member_bg" v-if="tableActive == 'member_bg'"> <div class="member_bg" v-if="tableActive == 'member_bg'">
<div class="card_wrap"> <div class="card_wrap">
<div class="card"> <div class="card">
<img class="bg" :src="selectItem.value" /> <img class="bg" :src="selectItem.value" v-if="selectItem.value" />
<div class="empty-tip member-empty-tip" v-else>暂无图片请上传</div>
<div class="content"> <div class="content">
<div class="ewm"> <div class="ewm">
<i class="icon el-icon-menu"></i> <i class="icon el-icon-menu"></i>
@@ -155,18 +168,29 @@
</div> </div>
</div> </div>
</div> </div>
<!-- 商品列表背景 -->
<div class="shopinfo_bg" v-if="tableActive == 'shopinfo_bg'"> <div class="shopinfo_bg" v-if="tableActive == 'shopinfo_bg'">
<img class="bg" :src="selectItem.value" v-if="!isJsonArrayString(selectItem.value)" /> <!-- 多图轮播 -->
<el-carousel height="120px" v-else> <el-carousel height="120px"
<el-carousel-item v-for="item in JSON.parse(selectItem.value)"> v-if="isJsonArrayString(selectItem.value) && JSON.parse(selectItem.value).length > 0">
<el-carousel-item v-for="(item, idx) in JSON.parse(selectItem.value)" :key="idx">
<img class="bg" :src="item" /> <img class="bg" :src="item" />
</el-carousel-item> </el-carousel-item>
</el-carousel> </el-carousel>
<!-- 单图渲染 -->
<img class="bg" v-else-if="selectItem.value" :src="selectItem.value" alt="" />
<!-- 空状态提示 -->
<div class="empty-tip shopinfo-empty-tip" v-else>暂无图片请上传</div>
<div class="shop_name">{{ shopName }}</div> <div class="shop_name">{{ shopName }}</div>
<img class="content" src="@/assets/images/shop_editor_bg.png" alt="" /> <img class="content" src="@/assets/images/shop_editor_bg.png" alt="" />
</div> </div>
<!-- 小票logo -->
<div class="ticket_wrap" v-if="tableActive == 'ticket_logo'"> <div class="ticket_wrap" v-if="tableActive == 'ticket_logo'">
<img class="logo" :src="selectItem.value" /> <img class="logo" :src="selectItem.value" v-if="selectItem.value" />
<div class="empty-tip ticket-empty-tip" v-else>暂无图片请上传</div>
<img class="ewm" src="@/assets/images/1024.png" /> <img class="ewm" src="@/assets/images/1024.png" />
<div class="row"> <div class="row">
<span class="num">123</span> <span class="num">123</span>
@@ -185,42 +209,48 @@
</div> </div>
</div> </div>
</div> </div>
<div class="editor_wrap"> <div class="editor_wrap">
<div class="header" style="padding-bottom: 20px"> <div class="header" style="padding-bottom: 20px">
<div class="t1"> <div class="t1">{{ selectItem.name }}</div>
{{ selectItem.name }}
</div>
<div class="t2">点击图片更换</div> <div class="t2">点击图片更换</div>
</div> </div>
<div class="form_item"> <div class="form_item">
<div class="upload_wrap" style="display: flex;flex-direction: column;gap: 28px;" <!-- 多图上传 -->
<div class="upload_wrap" style="display: flex; flex-direction: column; gap: 28px"
v-if="selectItem.autoKey == 'index_bg' || selectItem.autoKey == 'shopinfo_bg'"> v-if="selectItem.autoKey == 'index_bg' || selectItem.autoKey == 'shopinfo_bg'">
<MultiImageUpload v-model="imgList" @uploadStart="uploading = true" @uploadAllSuccess="MultiOnSuccess" /> <MultiImageUpload v-model="imgList" @uploadStart="uploading = true" @uploadAllSuccess="MultiOnSuccess" />
<div>
<el-button type="primary" size="large" @click="doSubmit" :loading="uploading"
loading-text="图片上传中...">确认修改</el-button>
</div>
</div> </div>
<div v-else> <!-- 单图上传 -->
<div v-else style="display: flex;">
<SingleImageUpload v-model="selectItem.value" @onSuccess="onSuccess"> <SingleImageUpload v-model="selectItem.value" @onSuccess="onSuccess">
<img v-if="selectItem.value" :src="selectItem.value" class="avatar" /> <img v-if="selectItem.value" :src="selectItem.value" class="avatar" />
<i v-else class="el-icon-plus avatar-uploader-icon"></i> <i v-else class="el-icon-plus avatar-uploader-icon"></i>
</SingleImageUpload> </SingleImageUpload>
</div> </div>
<!-- <el-upload <div class="model_wapra">
:headers="headers" <!-- 个人中心模板图 -->
class="avatar-uploader" <template v-if="selectItem.autoKey == 'my_bg'">
:action="qiNiuUploadApi" <div class="title">个人中心模板图</div>
:show-file-list="false" <div class="user-bg-list" v-if="userBgList.length > 0">
:on-success="handleSuccess" <img v-for="(url, index) in userBgList" :key="index" :src="url" @click="selectUserBg(url)"
style="width: 200px; height: 200px" class="user-bg-item" />
> </div>
<img v-if="selectItem.value" :src="selectItem.value" class="avatar" /> </template>
<i v-else class="el-icon-plus avatar-uploader-icon"></i> <!-- VIP背景模板图 -->
</el-upload> --> <template v-else-if="selectItem.autoKey == 'member_bg'">
<!-- <div class="title" style="padding-left: 20px;">跳转路径</div> <div class="title">会员卡背景模板图</div>
<el-input style="width: 300px;margin-left: 20px;" /> <div class="user-bg-list" v-if="vipBgList.length > 0">
<el-button type="primary" style="margin-left: 20px;">修改</el-button> --> <img v-for="(url, index) in vipBgList" :key="index" :src="url" @click="selectVipBg(url)"
class="user-bg-item" />
</div>
</template>
</div>
<div>
<el-button type="primary" size="large" @click="doSubmit" :loading="uploading" loading-text="图片上传中...">
确认修改
</el-button>
</div>
</div> </div>
</div> </div>
</div> </div>
@@ -230,7 +260,13 @@
<script> <script>
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
import shopExtendApi from "@/api/account/shopExtend"; import shopExtendApi from "@/api/account/shopExtend";
// 确保SvgIcon组件已正确引入
import SvgIcon from "@/components/SvgIcon/index.vue";
export default { export default {
components: {
SvgIcon,
},
data() { data() {
return { return {
tableActive: "index_bg", tableActive: "index_bg",
@@ -238,91 +274,151 @@ export default {
selectItem: {}, selectItem: {},
imageUrl: "", imageUrl: "",
imgList: [], imgList: [],
shopName: '', shopName: "",
uploading: false uploading: false,
userBgList: [
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/5c8673150d8e449ba035e3f65866b4ed.png',
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/c442af63d29443c687b24d2a3abbf02b.png',
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/1da89980fa0f4c7abffbcdacc2c3a059.png',
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/16296e40f2634d0da0cf1ff377b2b848.png',
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/f442c0d005b94664ac4b37f7fa19731b.png',
],
vipBgList: [
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/c2add99b9b21464889bc14823b97c40e.png',
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/c0e65f576a1a485da7fac34658b87c24.png',
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/629b8c12b8904140bf84df3a57b3c021.png',
'https://cashier-oss.oss-cn-beijing.aliyuncs.com/upload/2/cd06e01ad7e848359cdca718f5a06231.png'
]
}; };
}, },
mounted() { mounted() {
this.getList(); this.getList();
}, },
methods: { methods: {
// 刷新列表数据 // 选择会员背景模板图
selectVipBg(url) {
this.selectItem.value = url;
// this.doSubmit();
},
// 选择个人中心背景模板图
selectUserBg(url) {
this.selectItem.value = url;
// this.doSubmit();
},
// 提交修改
async doSubmit() { async doSubmit() {
// console.log('this.selectItem.value', this.selectItem.value); // 多图类型强制同步imgList到selectItem.value
// return if (["index_bg", "shopinfo_bg"].includes(this.selectItem.autoKey)) {
this.selectItem.value =
this.imgList.length > 0 ? JSON.stringify(this.imgList) : "";
}
// this.selectItem.value = JSON.stringify(this.imgList) let data = {
await shopExtendApi.edit({
...this.selectItem, ...this.selectItem,
autokey: this.selectItem.autoKey, autokey: this.selectItem.autoKey,
}); };
ElMessage({
message: "编辑成功", if (data.value === "") {
type: "success", ElMessage({
}); message: "请上传图片",
this.getList(); type: "warning",
});
return;
}
try {
await shopExtendApi.edit(data);
ElMessage({
message: "编辑成功",
type: "success", // 修复提示类型错误
});
this.getList();
} catch (error) {
ElMessage({
message: "编辑失败:" + (error.message || "未知错误"),
type: "error",
});
}
}, },
// 单图上传成功 // 单图上传成功
onSuccess(response) { onSuccess(response) {
this.doSubmit(); this.doSubmit();
}, },
// 多图上传成功 // 多图上传成功
async MultiOnSuccess(response) { async MultiOnSuccess(response) {
console.log(response); this.uploading = false;
// console.log(this.imgList); // 确保imgList有值再序列化
// console.log(this.imgList); this.selectItem.value =
// await nextTick() this.imgList.length > 0 ? JSON.stringify(this.imgList) : "";
this.uploading = false // 强制触发视图更新
this.selectItem.value = JSON.stringify(this.imgList) this.$forceUpdate();
console.log('onSuccess.selectItem.value', this.selectItem.value); ElMessage({
message: "图片上传成功",
type: "success",
});
}, },
/** /**
* 判断字符串是否为合法的 JSON 数组 * 判断字符串是否为合法的 JSON 数组
* @param {string} str - 待判断的字符串 * @param {string} str - 待判断的字符串
* @returns {boolean} true=是JSON数组字符串 / false=普通字符串/其他 * @returns {boolean} true=是JSON数组字符串 / false=普通字符串/其他
*/ */
isJsonArrayString(str) { isJsonArrayString(str) {
// 1. 非字符串直接返回 false if (typeof str !== "string" || str.trim() === "") {
if (typeof str !== 'string') {
return false; return false;
} }
// 2. 空字符串返回 false根据业务可调整
if (str.trim() === '') {
return false;
}
try { try {
// 3. 尝试解析 JSON
const parsed = JSON.parse(str); const parsed = JSON.parse(str);
// 4. 校验解析结果是否为数组
return Array.isArray(parsed); return Array.isArray(parsed);
} catch (e) { } catch (e) {
// 解析失败(普通字符串/非法 JSON→ 返回 false
return false; return false;
} }
}, },
// 切换类型 // 切换类型
selectItemChange(key) { selectItemChange(key) {
this.tableActive = key; this.tableActive = key;
const { autoKey, id, name, value } = this.tableData.find((item) => item.autoKey == key); const targetItem = this.tableData.find((item) => item.autoKey === key) || {};
this.selectItem = { autoKey, id, name, value }; // 深拷贝避免引用问题
if (this.isJsonArrayString(value)) { this.selectItem = { ...targetItem };
this.imgList = JSON.parse(value)
// 多图类型特殊处理
if (["index_bg", "shopinfo_bg"].includes(key)) {
if (this.isJsonArrayString(targetItem.value)) {
this.imgList = JSON.parse(targetItem.value);
} else {
// 非JSON数组时若有单图值则转为数组否则置空
this.imgList = targetItem.value ? [targetItem.value] : [];
}
// 同步更新selectItem.value为JSON数组
this.selectItem.value = JSON.stringify(this.imgList);
} else { } else {
this.imgList = [] this.imgList = [];
// 单图类型保留原有值
this.selectItem.value = targetItem.value || "";
} }
console.log(this.selectItem);
}, },
// 获取装修数据 // 获取装修数据
async getList() { async getList() {
try { try {
let res = await shopExtendApi.get({}); const res = await shopExtendApi.get({});
this.tableData = res; this.tableData = res || [];
this.tableActive = !this.tableActive ? res[0].autoKey : this.tableActive; // 确保有数据时再切换
this.selectItemChange(this.tableActive); if (this.tableData.length > 0) {
this.tableActive = this.tableActive || this.tableData[0].autoKey;
this.selectItemChange(this.tableActive);
}
// 补充店铺名称(根据实际接口返回调整)
this.shopName = "我的店铺";
} catch (error) { } catch (error) {
console.log(error); console.error("获取装修数据失败:", error);
ElMessage({
message: "获取数据失败,请刷新重试",
type: "error",
});
} }
}, },
}, },
@@ -336,7 +432,7 @@ export default {
gap: 30px; gap: 30px;
.btn { .btn {
width: 100px; padding: 0 20px;
height: 40px; height: 40px;
border: 1px solid $color; border: 1px solid $color;
border-radius: 4px; border-radius: 4px;
@@ -366,6 +462,64 @@ export default {
background-color: #fff; background-color: #fff;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
// 空状态通用样式
.empty-tip {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
color: #999;
font-size: 14px;
background-color: #f5f5f5;
}
// 首页空状态
.index_bg .empty-tip {
height: 500px;
}
// 商品列表空状态
.shopinfo_bg .empty-tip {
height: 120px;
}
// 个人中心空状态
.my-empty-tip {
height: 180px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
color: #999;
font-size: 14px;
background-color: #f5f5f5;
}
// 会员背景空状态
.member-empty-tip {
height: 144px;
width: 100%;
display: flex;
align-items: center;
justify-content: center;
color: #999;
font-size: 14px;
background-color: #f5f5f5;
}
// 小票logo空状态
.ticket-empty-tip {
height: 80px;
width: 80px;
display: flex;
align-items: center;
justify-content: center;
color: #999;
font-size: 12px;
background-color: #f5f5f5;
border-radius: 4px;
}
.index_bg { .index_bg {
padding-bottom: 50px; padding-bottom: 50px;
@@ -653,35 +807,36 @@ export default {
} }
.info_wrap { .info_wrap {
padding: 20px 10px; padding: 10px;
display: flex; display: flex;
align-items: center; align-items: center;
gap: 10px;
.avatar { .avatar {
width: 40px; width: 40px;
height: 40px; height: 40px;
border-radius: 50%; border-radius: 50%;
background-color: #efefef; background-color: #f5f5f5;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
.icon { .icon {
color: #555; font-size: 20px;
font-size: 24px; color: #999;
} }
} }
.info { .info {
flex: 1;
.t1 { .t1 {
font-size: 14px; font-size: 14px;
color: #333;
} }
.t2 { .t2 {
font-size: 10px; font-size: 12px;
color: #999; color: #999;
margin-top: 4px;
} }
} }
} }
@@ -696,52 +851,55 @@ export default {
} }
.shop_name { .shop_name {
padding: 10px 10px 0 10px; padding: 10px;
font-size: 16px;
color: #333;
font-weight: 500;
} }
.content { .content {
width: 100%; width: 100%;
height: auto; height: auto;
display: block;
} }
} }
.ticket_wrap { .ticket_wrap {
padding: 15px; padding: 10px;
position: relative;
.logo {
width: 80px;
height: 80px;
object-fit: contain;
margin-bottom: 10px;
border-radius: 4px;
}
.ewm { .ewm {
width: 80px; width: 80px;
height: 80px; height: 80px;
position: absolute; object-fit: contain;
top: 10px; margin-bottom: 10px;
right: 15px;
}
.logo {
width: 90px;
height: 30px;
object-fit: cover;
} }
.row { .row {
margin-top: 5px; font-size: 12px;
display: flex; color: #666;
align-items: center; margin-bottom: 4px;
.num {
font-size: 14px;
color: #333;
font-weight: 500;
margin-right: 10px;
}
.sku { .sku {
font-size: 12px; color: #999;
color: #666;
} }
.b { .b {
font-weight: bold; font-weight: 500;
} color: #333;
.num {
font-size: 18px;
font-weight: bold;
margin-right: 10px;
} }
} }
} }
@@ -749,28 +907,63 @@ export default {
} }
.editor_wrap { .editor_wrap {
padding-left: 20px; flex: 1;
padding-left: 40px;
.header {
.t2 {
color: #999;
font-size: 12px;
}
}
.form_item { .form_item {
display: flex; display: flex;
align-items: center; flex-direction: column;
gap: 30px;
.avatar { .model_wapra {
display: block; .title {
width: 200px; font-size: 16px;
height: 200px; color: #333;
object-fit: cover; margin-bottom: 10px;
}
} }
.title { .user-bg-list {
flex-shrink: 0; display: flex;
gap: 10px;
.user-bg-item {
width: 120px;
height: 80px;
object-fit: cover;
border-radius: 4px;
cursor: pointer;
border: 2px solid transparent;
&:hover {
border-color: #40a9ff;
}
}
}
.avatar-uploader {
width: 200px;
height: 200px;
border: 1px dashed #d9d9d9;
border-radius: 6px;
cursor: pointer;
position: relative;
overflow: hidden;
.avatar-uploader-icon {
font-size: 28px;
color: #8c8c8c;
width: 178px;
height: 178px;
line-height: 178px;
text-align: center;
}
.avatar {
width: 100%;
height: 100%;
display: block;
}
} }
} }
} }

View File

@@ -32,20 +32,20 @@
<copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" /> <copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" />
</template> </template>
</page-content> </page-content>
<addCategory ref="addCategoryRef" @success="handleQueryClick" />
<!-- 新增 --> <!-- 新增 -->
<page-modal ref="addModalRef" :modal-config="addModalConfig" @submit-click="handleSubmitClick"> <!-- <page-modal ref="addModalRef" :modal-config="addModalConfig" @submit-click="handleSubmitClick">
<template #gender="scope"> <template #gender="scope">
<Dict v-model="scope.formData[scope.prop]" code="gender" /> <Dict v-model="scope.formData[scope.prop]" code="gender" />
</template> </template>
</page-modal> </page-modal> -->
<!-- 编辑 --> <!-- 编辑 -->
<page-modal ref="editModalRef" :modal-config="editModalConfig" @submit-click="handleSubmitClick"> <!-- <page-modal ref="editModalRef" :modal-config="editModalConfig" @submit-click="handleSubmitClick">
<template #gender="scope"> <template #gender="scope">
<Dict v-model="scope.formData[scope.prop]" code="gender" v-bind="scope.attrs" /> <Dict v-model="scope.formData[scope.prop]" code="gender" v-bind="scope.attrs" />
</template> </template>
</page-modal> </page-modal> -->
</template> </template>
<template v-else> <template v-else>
<page-content ref="contentRef" :content-config="contentConfig2" @operat-click="handleOperatClick"> <page-content ref="contentRef" :content-config="contentConfig2" @operat-click="handleOperatClick">
@@ -71,6 +71,9 @@ import contentConfig2 from "./categoryconfig/content2";
import editModalConfig from "./categoryconfig/edit"; import editModalConfig from "./categoryconfig/edit";
import searchConfig from "./categoryconfig/search"; import searchConfig from "./categoryconfig/search";
import { isSyncStatus, downloadFile } from "@/utils/index"; import { isSyncStatus, downloadFile } from "@/utils/index";
import addCategory from "./components/addCategory.vue";
const addCategoryRef = ref(null)
const options = ref([ const options = ref([
{ label: "退菜退库存", value: 1 }, { label: "退菜退库存", value: 1 },
@@ -133,7 +136,8 @@ async function isRefundStockChange(e: any, scope: any) {
// 新增 // 新增
async function handleAddClick() { async function handleAddClick() {
addModalRef.value?.setModalVisible(); addCategoryRef.value.open()
// addModalRef.value?.setModalVisible();
// 加载部门下拉数据源 // 加载部门下拉数据源
// addModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions(); // addModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
// 加载角色下拉数据源 // 加载角色下拉数据源
@@ -141,15 +145,16 @@ async function handleAddClick() {
} }
// 编辑 // 编辑
async function handleEditClick(row: IObject) { async function handleEditClick(row: IObject) {
editModalRef.value?.handleDisabled(false); addCategoryRef.value.open(row)
// 加载部门下拉数据源 // editModalRef.value?.handleDisabled(false);
// editModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions(); // // 加载部门下拉数据源
// 加载角色下拉数据源 // // editModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
// editModalConfig.formItems[4]!.options = await RoleAPI.getOptions(); // // 加载角色下拉数据源
// 根据id获取数据进行填充 // // editModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
const data = await UserAPI.getunitinfo(row.id); // // 根据id获取数据进行填充
editModalRef.value?.setFormData(data); // const data = await UserAPI.getunitinfo(row.id);
editModalRef.value?.setModalVisible(); // editModalRef.value?.setFormData(data);
// editModalRef.value?.setModalVisible();
} }
// 其他工具栏 // 其他工具栏
function handleToolbarClick(name: string) { function handleToolbarClick(name: string) {

View File

@@ -0,0 +1,100 @@
<template>
<el-dialog :title="form.id ? '添加分类' : '编辑分类'" width="650px" v-model="visible" @close="closeHandle">
<el-form ref="formRef" :rules="rules" :model="form" label-position="right" label-width="120px">
<el-form-item label="分类名称" prop="name">
<el-input placeholder="请输入分类名称" v-model="form.name"></el-input>
</el-form-item>
<el-form-item label="分类图片">
<SingleImageUpload v-model="form.pic" />
</el-form-item>
<el-form-item label="退菜是否退库存">
<el-radio-group v-model="form.refundMode">
<el-radio label="退菜退库存" :value="1"></el-radio>
<el-radio label="仅退菜不退库存" :value="2"></el-radio>
<el-radio label="每次询问-退菜后弹窗提示" :value="3"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序">
<el-input-number v-model="form.sort" :min="1" :step="1"></el-input-number>
</el-form-item>
<el-form-item label="状态">
<el-switch v-model="form.status" :active-value="1" :inactive-value="0"></el-switch>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="visible = false"> </el-button>
<el-button type="primary" @click="handleOk" :loading="loading"> </el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import _ from 'lodash'
import { ref } from 'vue'
import UserAPI from "@/api/product/productclassification";
const visible = ref(false)
const loading = ref(false)
const formRef = ref(null)
const form = ref({
id: '',
name: '',
pic: '',
refundMode: 1, // 退菜是否退库存 1退菜退库存 2仅退菜不退库存 3每次询问-退菜后弹窗提示
sort: 1,
status: 1
})
const rules = ref({
name: [
{
required: true,
message: '请输入单位名称',
trigger: 'blur'
}
]
})
const emit = defineEmits(['success'])
function handleOk() {
formRef.value.validate(async (valid) => {
try {
if (valid) {
loading.value = true
if (form.value.id == '') {
await UserAPI.addunit(form.value)
} else {
await UserAPI.update(form.value)
}
setTimeout(() => {
visible.value = false
ElMessage.success(form.value.id ? '添加成功' : '编辑成功')
emit('success')
}, 500);
}
} catch (error) {
console.log(error);
} finally {
setTimeout(() => {
loading.value = false
}, 500);
}
})
}
function closeHandle() {
form.value.name = ''
}
function open(obj) {
visible.value = true
if (obj && obj.id) {
form.value = _.cloneDeep(obj)
}
}
defineExpose({
open
})
</script>

View File

@@ -0,0 +1,417 @@
<template>
<el-dialog :title="form.id ? '编辑模板' : '新增模板'" width="900px" v-model="visible" @close="onClose">
<div class="form_wrap">
<div class="form_left">
<el-form ref="formRef" :model="form" :rules="rules" label-width="100" label-position="right">
<el-form-item label="模板名称" prop="name">
<el-input v-model="form.name" :maxlength="20" placeholder="如:主食、酒水、辣度、大小等"></el-input>
</el-form-item>
<transition-group name="slide">
<div class="sortable-parent" v-for="(item, index) in form.children" :key="item._id"
:data-parent-index="index"> <!-- 修复Vue3绑定语法 -->
<el-form-item label="规格名称">
<div class="center">
<el-input v-model="item.name" placeholder="如:口味、忌口、温度、分量等"></el-input>
<el-icon v-if="index > 0" size="20" @click="form.children.splice(index, 1)">
<Delete />
</el-icon>
</div>
</el-form-item>
<transition-group name="fade" tag="div">
<el-form-item label="规格值" v-for="(val, i) in item.children" :key="val._id" :data-child-index="i">
<!-- 修复Vue3绑定语法 -->
<div class="center">
<div style="flex:1;">
<el-input v-model="val.name" placeholder="如:五香、微辣、大份、小份等"></el-input>
</div>
<el-icon v-if="i > 0" size="20" @click="form.children[index].children.splice(i, 1)">
<Delete />
</el-icon>
</div>
</el-form-item>
</transition-group>
<el-form-item style="margin-top:-10px;">
<el-button size="small" @click="addSpecValue(index)">添加规格值</el-button>
</el-form-item>
</div>
</transition-group>
<el-form-item label-width="0">
<div class="flex_end">
<el-button type="primary" @click="addSpec">添加规格</el-button>
</div>
</el-form-item>
</el-form>
</div>
<div class="form_right">
<div class="preview_wrap">
<div class="title_wrap">
<el-text size="large">效果预览</el-text>
<el-text size="small">可拖动排序</el-text>
</div>
<div class="row_wrap" id="parent-sort">
<!-- 修复index未定义 + 绑定语法错误 -->
<div class="row" v-for="(item, index) in form.children" :key="item._id" :data-index="index">
<div class="row_top">
<el-text size="large">{{ item.name || '请输入规格名称' }}</el-text>
<el-icon size="20" class="drag-handle">
<Rank />
</el-icon>
</div>
<div class="row_content" v-if="item.children.length" :id="`child-sort-${item._id}`">
<div class="tag" v-for="val in item.children" :key="val._id">
<el-text>{{ val.name || '请输入规格值' }}</el-text>
</div>
</div>
<div class="tag empty-tag" v-else>
<el-text>请添加规格值</el-text>
</div>
</div>
</div>
</div>
</div>
</div>
<template #footer>
<div class="dialog-footer">
<el-button @click="visible = false"> </el-button>
<el-button type="primary" @click="handleOk" :loading="loading"> </el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import _ from 'lodash'
import { ref, onMounted, watch, nextTick } from 'vue'
import { ElMessage } from 'element-plus'
import { Delete, Rank } from '@element-plus/icons-vue'
import Sortable from 'sortablejs'
import UserAPI from "@/api/product/specificationsconfig";
const generateId = () => {
return Date.now() + '_' + Math.floor(Math.random() * 10000)
}
const childrenObj = ref({
_id: generateId(),
name: '',
children: [{ _id: generateId(), name: '' }]
})
const formObj = {
_id: '',
name: '',
children: [_.cloneDeep(childrenObj.value)]
}
const loading = ref(false)
const formRef = ref(null)
const form = ref(formObj)
const visible = ref(false)
const rules = ref({
name: [{ required: true, message: '模板名称不能为空', trigger: 'blur' }]
})
function onClose() {
form.value = _.cloneDeep(formObj)
// if (parentSortable) parentSortable.destroy()
// childSortableMap.forEach(s => s.destroy())
// childSortableMap.clear()
// setTimeout(() => {
// }, 50);
visible.value = false
}
function addSpec() {
form.value.children.push({
_id: generateId(),
name: '',
children: [{ _id: generateId(), name: '' }]
})
}
function addSpecValue(parentIndex) {
form.value.children[parentIndex].children.push({
_id: generateId(),
name: ''
})
}
const emit = defineEmits(['success'])
function handleOk() {
formRef.value.validate(async (valid) => {
try {
if (valid) {
let flag = true
let pIndex = 0
let index = 0
form.value.children.forEach((item, index) => {
if (item.name == '') {
flag = false
pIndex = index
return
}
item.children.forEach((val, i) => {
if (val.name == '') {
flag = false
pIndex = index
index = i
return
}
})
})
if (!flag) {
ElMessage.error('请补全规格信息')
return
}
loading.value = true
console.log('最终提交数据:', form.value)
await UserAPI.quickAdd(form.value)
ElMessage.success(form.value.id ? '编辑成功' : '添加成功')
visible.value = false
loading.value = false
emit('success')
}
} catch (error) {
console.log(error);
} finally {
loading.value = false
}
})
}
function open(obj) {
visible.value = true
if (obj && obj.id) {
obj.children.forEach(item => {
item._id = generateId()
item.children.forEach(val => {
val._id = generateId()
})
})
form.value = _.cloneDeep(obj)
console.log(form.value);
}
}
defineExpose({
open
})
let parentSortable = null
const childSortableMap = new Map()
onMounted(() => {
nextTick(() => {
initParentSort()
initAllChildSort()
})
})
watch(() => form.value.children, () => {
nextTick(() => {
initParentSort()
initAllChildSort()
})
}, { deep: true })
function initParentSort() {
const el = document.getElementById('parent-sort')
if (!el) return
if (parentSortable) parentSortable.destroy()
parentSortable = Sortable.create(el, {
handle: '.drag-handle', // 仅拖拽手柄生效
animation: 200,
ghostClass: 'sort-ghost', // 仅保留占位提示
forceFallback: true,
fallbackOnBody: false, // 禁用body上的克隆预览
fallbackClone: false, // 禁用拖拽克隆元素(核心:移除跟随预览)
// 移除dragClass禁用拖拽预览样式
onEnd(evt) {
const { oldIndex, newIndex } = evt
if (oldIndex === newIndex) return
const moved = form.value.children.splice(oldIndex, 1)[0]
form.value.children.splice(newIndex, 0, moved)
nextTick(initAllChildSort)
}
})
}
function initAllChildSort() {
childSortableMap.forEach(s => s.destroy())
childSortableMap.clear()
form.value.children.forEach(item => {
const id = `child-sort-${item._id}`
const el = document.getElementById(id)
if (!el) return
const s = Sortable.create(el, {
animation: 200,
ghostClass: 'sort-ghost', // 仅保留占位提示
direction: 'horizontal',
forceFallback: true,
fallbackOnBody: false, // 禁用body上的克隆预览
fallbackClone: false, // 禁用拖拽克隆元素(核心)
draggable: '.tag', // 仅tag可拖拽
// 移除dragClass禁用拖拽预览样式
onEnd(evt) {
const { oldIndex, newIndex } = evt
if (oldIndex === newIndex) return
const list = item.children
const moved = list.splice(oldIndex, 1)[0]
list.splice(newIndex, 0, moved)
}
})
childSortableMap.set(id, s)
})
}
</script>
<style scoped lang="scss">
.flex_end {
width: 100%;
display: flex;
justify-content: flex-end;
}
.sortable-parent {
border: 1px solid #ececec;
padding: 14px;
border-radius: 4px;
margin-bottom: 14px;
}
.form_wrap {
display: flex;
gap: 24px;
.form_left {
flex: 1;
height: 60vh;
overflow-y: auto;
}
.form_right {
flex: 1;
}
.preview_wrap {
border: 1px solid #ececec;
border-radius: 4px;
padding: 14px;
.title_wrap {
display: flex;
justify-content: center;
align-items: flex-end;
gap: 10px;
}
.row_wrap {
padding-top: 14px;
.row {
margin-bottom: 16px;
position: relative;
.row_top {
display: flex;
align-items: center;
justify-content: space-between;
cursor: default;
padding-bottom: 10px;
.drag-handle {
cursor: grab;
&:active {
cursor: grabbing;
}
}
}
.row_content {
display: flex;
flex-wrap: wrap;
gap: 10px;
min-height: 36px;
}
.tag {
padding: 4px 20px;
border-radius: 4px;
background: #e6e6e6;
cursor: grab;
user-select: none;
white-space: nowrap;
display: flex;
align-items: center;
&:active {
cursor: grabbing;
}
}
.empty-tag {
background: #f5f5f5;
color: #999;
cursor: not-allowed;
}
}
}
}
}
.center {
width: 100%;
display: flex;
align-items: center;
gap: 10px;
}
// 仅保留占位提示样式(无跟随预览)
:deep(.sort-ghost) {
opacity: 0.4;
background: #f5f5f5 !important;
border: 1px dashed #409eff !important;
}
// 移除所有拖拽预览相关样式
:deep(.parent-dragging),
:deep(.child-dragging) {
display: none !important;
}
.slide-move-active,
.fade-move-active {
transition: all 0.3s ease;
}
.slide-enter-from,
.slide-leave-to {
opacity: 0;
transform: translateX(-20px);
}
.fade-enter-from,
.fade-leave-to {
opacity: 0;
transform: scale(0.95);
}
</style>

View File

@@ -0,0 +1,80 @@
<template>
<el-dialog :title="form.id ? '添加单位' : '编辑单位'" width="500px" v-model="visible" @close="closeHandle">
<el-form ref="formRef" :rules="rules" :model="form" label-position="right" label-width="80px">
<el-form-item label="单位名称" prop="name">
<el-input placeholder="请输入单位名称" v-model="form.name"></el-input>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="visible = false"> </el-button>
<el-button type="primary" @click="handleOk" :loading="loading"> </el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import _ from 'lodash'
import { ref } from 'vue'
import UserAPI from "@/api/product/commonUnits";
const visible = ref(false)
const loading = ref(false)
const formRef = ref(null)
const form = ref({
id: '',
name: ''
})
const rules = ref({
name: [
{
required: true,
message: '请输入单位名称',
trigger: 'blur'
}
]
})
const emit = defineEmits(['success'])
function handleOk() {
formRef.value.validate(async (valid) => {
try {
if (valid) {
loading.value = true
if (form.value.id == '') {
await UserAPI.addunit(form.value)
} else {
await UserAPI.update(form.value)
}
setTimeout(() => {
visible.value = false
ElMessage.success(form.value.id ? '添加成功' : '编辑成功')
emit('success')
}, 500);
}
} catch (error) {
console.log(error);
} finally {
setTimeout(() => {
loading.value = false
}, 500);
}
})
}
function closeHandle() {
form.value.name = ''
}
function open(obj) {
visible.value = true
if (obj && obj.id) {
form.value = _.cloneDeep(obj)
}
}
defineExpose({
open
})
</script>

View File

@@ -9,7 +9,8 @@
<!-- 列表 --> <!-- 列表 -->
<page-content ref="contentRef" :content-config="contentConfig" @add-click="handleAddClick" <page-content ref="contentRef" :content-config="contentConfig" @add-click="handleAddClick"
@edit-click="handleEditClick" @export-click="handleExportClick" @search-click="handleSearchClick" @edit-click="handleEditClick" @export-click="handleExportClick" @search-click="handleSearchClick"
@toolbar-click="handleToolbarClick" @operat-click="handleOperatClick" @filter-change="handleFilterChange"> @toolbar-click="handleToolbarClick" @operat-click="handleOperatClick" @filter-change="handleFilterChange"
@selectChange="handleSelectionChange">
<!-- <template #status="scope"> <!-- <template #status="scope">
<el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'"> <el-tag :type="scope.row[scope.prop] == 1 ? 'success' : 'info'">
{{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }} {{ scope.row[scope.prop] == 1 ? "启用" : "禁用" }}
@@ -17,6 +18,12 @@
</template> --> </template> -->
<template #custom> <template #custom>
<importData :type="3" @close="newHandleQueryClick" /> <importData :type="3" @close="newHandleQueryClick" />
<el-select :disabled="batchOperationSelectRows.length == 0"
:placeholder="`批量操作${batchOperationSelectRows.length == 0 ? '(请选择商品后操作)' : ''}`" v-model="batchOperationValue"
style="width: 240px;margin-left: 16px;">
<el-option v-for="item in batchOperationList" :key="item.id" :value="item.id" :label="item.lable"
@click="batchOperationChange(item.id)"></el-option>
</el-select>
</template> </template>
<template #type="scope"> <template #type="scope">
{{ typeFilter(scope.row[scope.prop]) }} {{ typeFilter(scope.row[scope.prop]) }}
@@ -43,9 +50,9 @@
</template> </template>
<template #tuikuantuihui="scope"> <template #tuikuantuihui="scope">
<!-- <el-switch v-if="!scope.row.productId" v-model="scope.row[scope.prop]" :active-value="1" :inactive-value="0" <el-switch v-if="!scope.row.productId" v-model="scope.row[scope.prop]" :active-value="1" :inactive-value="0"
@click="handleSwitchhaocai(scope.row)"></el-switch> --> @click="handleSwitchhaocai(scope.row)"></el-switch>
<el-text>{{ returnLabel(scope.row[scope.prop]) }}</el-text> <!-- <el-text>{{ returnLabel(scope.row[scope.prop]) }}</el-text> -->
</template> </template>
<template #sellOut="scope"> <template #sellOut="scope">
<el-switch v-model="scope.row[scope.prop]" :active-value="1" :inactive-value="0" <el-switch v-model="scope.row[scope.prop]" :active-value="1" :inactive-value="0"
@@ -109,7 +116,7 @@
</el-form> </el-form>
</MyDialog> </MyDialog>
<!-- 耗材绑定 --> <!-- 耗材绑定 -->
<MyDialog ref="myDialogRefhaocai" @confirm="confirmhaocai" width="50%" title="耗材绑定"> <MyDialog ref="myDialogRefhaocai" @confirm="confirmhaocai" width="60%" title="耗材绑定">
<el-row> <el-row>
<el-col :span="12"> <el-col :span="12">
<el-form-item label="商品名"> <el-form-item label="商品名">
@@ -189,12 +196,32 @@
<!-- 分页 --> <!-- 分页 -->
<Paging :pagingConfig="dataAll.pagingConfig" @sizeChange="sizeChange" @currentChange="currentChange"></Paging> <Paging :pagingConfig="dataAll.pagingConfig" @sizeChange="sizeChange" @currentChange="currentChange"></Paging>
</MyDialog> </MyDialog>
<!-- 批量操作更改分类弹窗 -->
<el-dialog title="更改分类" width="400px" v-model="visibleBatchOperation" @close="bateOperationForm.categoryId = ''">
<el-form ref="bateOperationFormRef" :model="bateOperationForm" :rules="bateOperationFormRules"
label-position="right" label-width="120">
<el-form-item label="请选择分类" prop="categoryId">
<el-select v-model="bateOperationForm.categoryId" placeholder="请选择">
<el-option v-for="item in batchOperationCategorys" :key="item.id" :label="item.name"
:value="item.id"></el-option>
</el-select>
</el-form-item>
</el-form>
<template #footer>
<div class="dialog-footer">
<el-button @click="visibleBatchOperation = false"> </el-button>
<el-button type="primary" @click="batchOperationCategoryConfirm" :loading="batchOperationLoading">
</el-button>
</div>
</template>
</el-dialog>
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import importData from "@/components/importData/index.vue"; import importData from "@/components/importData/index.vue";
import UserAPI from "@/api/product/index"; import UserAPI from "@/api/product/index";
import CategoryAPI from '@/api/product/productclassification'
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import type { IObject, IOperatData } from "@/components/CURD/types"; import type { IObject, IOperatData } from "@/components/CURD/types";
import usePage from "@/components/CURD/usePage"; import usePage from "@/components/CURD/usePage";
@@ -561,10 +588,22 @@ async function confirmhaocai() {
consList: haocaiData.value.consList, consList: haocaiData.value.consList,
id: haocaiData.value.id, id: haocaiData.value.id,
}; };
let res = await UserAPI.bind(obj);
ElMessage.success("成功"); let flag = true
handleResetClick(); obj.consList.forEach((el: any) => {
myDialogRefhaocai.value.close(); if (el.consInfoId == '') {
flag = false
}
});
if (flag) {
let res = await UserAPI.bind(obj);
ElMessage.success("成功");
handleResetClick();
myDialogRefhaocai.value.close();
} else {
ElMessage.error("请选择耗材");
}
} }
// 商品规格 // 商品规格
function typeFilter(item: any) { function typeFilter(item: any) {
@@ -603,7 +642,145 @@ async function gethaocaiList() {
let res = await UserAPI.productconsList({ id: route.query.id }); let res = await UserAPI.productconsList({ id: route.query.id });
options.value = res || []; options.value = res || [];
} }
const batchOperationList = ref([
{
id: 1,
value: '1',
type: 'isSale',
lable: '批量上架'
},
{
id: 2,
value: '0',
type: 'isSale',
lable: '批量下架'
},
{
id: 3,
type: 'category',
lable: '批量更改商品分类'
},
{
id: 4,
value: '1',
type: 'is_sold_stock',
lable: '批量售罄'
},
{
id: 5,
value: '0',
type: 'is_sold_stock',
lable: '批量取消售罄'
},
{
id: 6,
value: '1',
type: 'isAutoSoldStock',
lable: '批量自动售罄'
},
{
id: 7,
value: '0',
type: 'isAutoSoldStock',
lable: '批量取消自动售罄'
},
])
function handleSelectionChange(rows) {
// console.log('handleSelectionChange', rows);
batchOperationSelectRows.value = rows
}
// 选择批量操作项目
const batchOperationValue = ref('')
const batchOperationSelectItem = ref('')
const batchOperationSelectRows = ref([])
function batchOperationChange(e: any) {
if (batchOperationSelectRows.value.length == 0) {
ElMessage.error('请选择商品')
return
}
batchOperationSelectItem.value = batchOperationList.value.find(item => item.id == e)
if (batchOperationSelectItem.value.type == 'category') {
visibleBatchOperation.value = true
} else {
ElMessageBox.confirm(`是否确认对勾选商品执行「${batchOperationSelectItem.value.lable}」操作,操作不可撤销`, '提示').then(() => {
batchOperationConfirm()
}).catch(() => { })
}
}
// 确认最后的操作
async function batchOperationConfirm() {
try {
const ids = batchOperationSelectRows.value.map(item => item.id)
let value = ''
if (batchOperationSelectItem.value.type == 'category') {
value = bateOperationForm.value.categoryId
} else {
value = batchOperationSelectItem.value.value
}
await UserAPI.batchOperate({
ids: ids.join(','), // 商品id集合
type: batchOperationSelectItem.value.type, // 操作类型
value: value, // 操作之除分类外取value
})
newHandleQueryClick()
ElMessage.success('操作成功')
} catch (error) {
console.log(error);
}
}
const batchOperationCategorys = ref([])
const visibleBatchOperation = ref(false)
const batchOperationLoading = ref(false)
const bateOperationFormRef = ref(null)
const bateOperationForm = ref({
categoryId: ''
})
const bateOperationFormRules = ref({
categoryId: [
{
required: true,
message: '请选择分类',
blur: 'trigger'
}
]
})
// 批量操作更改分类
function batchOperationCategoryConfirm() {
bateOperationFormRef.value.validate(async vaild => {
if (vaild) {
batchOperationLoading.value = true
await batchOperationConfirm()
batchOperationLoading.value = false
visibleBatchOperation.value = false
}
})
}
// 获取商品分类
async function getCategorys() {
try {
batchOperationCategorys.value = await CategoryAPI.getList()
} catch (error) {
console.log(error);
}
}
onMounted(() => {
getCategorys()
})
</script> </script>
<style>
/* 关键:隐藏子行的选择框 */
.el-table__row--level-1 .el-checkbox {
display: none !important;
}
</style>
<style scoped lang="scss"> <style scoped lang="scss">
.table_btn_wrap { .table_btn_wrap {
display: flex; display: flex;

View File

@@ -1,194 +1,201 @@
<template> <template>
<div class="addgoods"> <div class="addgoods">
<div class="header-wrap"> <div class="form_wrap">
<el-radio-group v-model="addFormType" size="large"> <el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-width="150px" class="demo-ruleForm" status-icon>
<el-radio-button label="基础信息" :value="1"></el-radio-button> <el-steps :active="stepsActiveName" finish-status="success" simple>
<el-radio-button label="耗材设置" :value="2"></el-radio-button> <el-step title="基础信息" />
<el-radio-button label="关联推荐商品" :value="3"></el-radio-button> <el-step title="耗材设置/关联推荐商品" />
</el-radio-group> </el-steps>
</div> <div style="padding-top: 20px;">
<el-form ref="ruleFormRef" :model="ruleForm" :rules="rules" label-width="150px" class="demo-ruleForm" status-icon> <!-- 基础信息 -->
<div v-show="addFormType == 1"> <div v-show="stepsActiveName == 0">
<el-form-item label="商品名称" required> <el-form-item label="商品名称" required>
<el-col :span="12"> <el-col :span="12">
<el-form-item prop="name"> <el-form-item prop="name">
<el-input v-model="ruleForm.name" placeholder="请输入商品名称" :disabled="isSyncStatus()" /> <el-input v-model="ruleForm.name" placeholder="请输入商品名称" :disabled="isSyncStatus()" />
</el-form-item>
</el-col>
</el-form-item> </el-form-item>
</el-col> <el-form-item label="商品介绍">
</el-form-item> <el-col :span="12">
<el-form-item label="商品介绍"> <el-form-item>
<el-col :span="12"> <el-input v-model="ruleForm.shortTitle" type="textarea" placeholder="请输入商品介绍"
<el-form-item> :disabled="isSyncStatus()" />
<el-input v-model="ruleForm.shortTitle" type="textarea" placeholder="请输入商品介绍" </el-form-item>
:disabled="isSyncStatus()" /> </el-col>
</el-form-item> </el-form-item>
</el-col> <el-form-item label="单位" required prop="unitId">
</el-form-item> <el-select v-model="ruleForm.unitId" placeholder="请选择单位" :disabled="isSyncStatus()" style="width: 330px;">
<el-form-item label="单位" required>
<el-col :span="12">
<el-form-item prop="unitId">
<el-select v-model="ruleForm.unitId" placeholder="请选择单位" :disabled="isSyncStatus()">
<el-option :label="item.name" :value="item.id" v-for="item in datas.Company" :key="item.id" /> <el-option :label="item.name" :value="item.id" v-for="item in datas.Company" :key="item.id" />
</el-select> </el-select>
<el-button type="primary" icon="Plus" style="margin-left: 14px;"
@click="addUnitRef.open()">添加单位</el-button>
</el-form-item> </el-form-item>
</el-col> <el-form-item label="商品分类" required prop="categoryId">
</el-form-item> <el-select v-model="ruleForm.categoryId" placeholder="请选择商品分类" :disabled="isSyncStatus()"
<el-form-item label="商品分类" required> style="width: 330px;">
<el-col :span="12">
<el-form-item prop="region">
<el-select v-model="ruleForm.categoryId" placeholder="请选择商品分类" :disabled="isSyncStatus()">
<el-option :label="item.name" :value="item.id" v-for="item in datas.classification" :key="item.id" /> <el-option :label="item.name" :value="item.id" v-for="item in datas.classification" :key="item.id" />
</el-select> </el-select>
<el-button type="primary" icon="Plus" style="margin-left: 14px;"
@click="addCategoryRef.open()">添加分类</el-button>
</el-form-item> </el-form-item>
</el-col> <el-form-item label="商品分组">
</el-form-item> <el-select v-model="ruleForm.proGroupIds" multiple placeholder="请选择商品分组" style="width: 330px;">
<!-- <el-form-item label="商品图片" required prop="images"> <el-option :label="item.name" :value="item.id" v-for="item in goodsGroupList" :key="item.id" />
<MultiImageUpload v-model="ruleForm.images" /> </el-select>
</el-form-item> --> <el-button type="primary" icon="Plus" style="margin-left: 14px;"
<el-form-item label="商品图片" required prop="images"> @click="addGoodsGroupRef.open()">添加分组</el-button>
<div style="display: flex; flex-wrap: wrap"> </el-form-item>
<div v-for="(item, index) in ruleForm.images" :key="index" style="position: relative" class="showStyle"> <!-- <el-form-item label="商品图片" required prop="images">
<el-icon class="buttonstyle" @click="deleteEvent(item)"> <MultiImageUpload v-model="ruleForm.images" />
<DeleteFilled /> </el-form-item> -->
</el-icon> <el-form-item label="商品图片" required prop="images">
<img style="width: 148px; height: 148px; margin-right: 6px" class="imgStyle" :src="item" alt="" /> <div style="display: flex; flex-wrap: wrap">
</div> <div v-for="(item, index) in ruleForm.images" :key="index" style="position: relative" class="showStyle">
<div class="upImgStyle" @click="addimgEvent">+</div> <el-icon class="buttonstyle" @click="deleteEvent(item)">
</div> <DeleteFilled />
</el-form-item> </el-icon>
<el-form-item> <img style="width: 148px; height: 148px; margin-right: 6px" class="imgStyle" :src="item" alt="" />
<div class="tips">第一张图为商品封面图图片尺寸为750×750</div> </div>
</el-form-item> <div class="upImgStyle" @click="addimgEvent">+</div>
<!-- 选择图片 --> </div>
<AddImg ref="addImg" @successEvent="successEvent"></AddImg> </el-form-item>
<el-form-item>
<el-form-item label="商品类型"> <div class="tips">第一张图为商品封面图图片尺寸为750×750</div>
<el-radio-group v-model="ruleForm.type" @change="changeTypeEnum(ruleForm.type)" :disabled="isSyncStatus()"> </el-form-item>
<el-radio value="single">单规格商品</el-radio> <!-- 选择图片 -->
<el-radio value="sku">多规格商品</el-radio> <AddImg ref="addImg" @successEvent="successEvent"></AddImg>
<el-radio value="package">套餐商品</el-radio> <el-form-item label="商品类型">
<el-radio value="weight">称重商品</el-radio> <el-radio-group v-model="ruleForm.type" @change="changeTypeEnum(ruleForm.type)"
<!-- <el-radio label="coupon">团购券</el-radio> --> :disabled="isSyncStatus()">
</el-radio-group> <el-radio value="single">单规格商品</el-radio>
</el-form-item> <el-radio value="sku">多规格商品</el-radio>
<el-form-item label="套餐商品" v-if="ruleForm.type == 'package'"> <el-radio value="package">套餐商品</el-radio>
<div style="display: block; width: 100%"> <el-radio value="weight">称重商品</el-radio>
<div class="head-container"> <!-- <el-radio label="coupon">团购券</el-radio> -->
<el-radio-group v-model="ruleForm.groupType" @change="typeChange">
<el-radio-button :label="0">固定套餐</el-radio-button>
<el-radio-button :label="1">可选套餐</el-radio-button>
</el-radio-group> </el-radio-group>
</div> </el-form-item>
<div v-if="ruleForm.groupType == 0"> <el-form-item label="套餐商品" v-if="ruleForm.type == 'package'">
<el-table border :data="item.goods" v-for="(item, index) in ruleForm.proGroupVo" :key="index"> <div style="display: block; width: 100%">
<el-table-column label="名称" prop="proName"></el-table-column> <div class="head-container">
<el-table-column label="规格" prop="skuName"></el-table-column> <el-radio-group v-model="ruleForm.groupType" @change="typeChange">
<el-table-column label="价格" prop="price"></el-table-column> <el-radio-button :label="0">固定套餐</el-radio-button>
<el-table-column label="数量" prop="number"> <el-radio-button :label="1">可选套餐</el-radio-button>
<template v-slot="scope"> </el-radio-group>
<el-input-number v-model="scope.row.number" :min="0" /> </div>
</template> <div v-if="ruleForm.groupType == 0">
</el-table-column> <el-table border :data="item.goods" v-for="(item, index) in ruleForm.proGroupVo" :key="index">
<el-table-column width="150">
<template #header>
<el-button type="primary" @click="addgoods(-1)" :disabled="isSyncStatus()">
添加商品
</el-button>
</template>
<template v-slot="scope">
<el-button type="text" :disabled="scope.row.type != 'sku' && isSyncStatus()"
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
<el-button type="text"
@click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
<div v-if="ruleForm.groupType == 1">
<div class="group_wrap" v-for="(item, index) in ruleForm.proGroupVo" :key="index">
<el-form inline :model="item">
<el-form-item label="规格组名">
<el-input v-model="item.title" :disabled="isSyncStatus()" />
</el-form-item>
<el-form-item :label="`本组菜品${item.goods.length}选`">
<el-input v-model="item.number" :disabled="isSyncStatus()" />
</el-form-item>
<el-form-item>
<el-button @click="ruleForm.proGroupVo.splice(index, 1)" :disabled="isSyncStatus()">
删除
</el-button>
</el-form-item>
</el-form>
<div style="margin-top: 20px">
<el-table border :data="item.goods">
<el-table-column label="名称" prop="proName"></el-table-column> <el-table-column label="名称" prop="proName"></el-table-column>
<el-table-column label="规格" prop="skuName"></el-table-column> <el-table-column label="规格" prop="skuName"></el-table-column>
<el-table-column label="价格" prop="price"></el-table-column> <el-table-column label="价格" prop="price"></el-table-column>
<el-table-column label="数量" prop="number"> <el-table-column label="数量" prop="number">
<template v-slot="scope"> <template v-slot="scope">
<el-input-number v-model="scope.row.number" :min="0" :disabled="isSyncStatus()" /> <el-input-number v-model="scope.row.number" :min="0" />
</template> </template>
</el-table-column> </el-table-column>
<el-table-column width="150"> <el-table-column width="150">
<template #header> <template #header>
<el-button type="primary" @click="addgoods(index)" :disabled="isSyncStatus()"> <el-button type="primary" @click="addgoods(-1)" :disabled="isSyncStatus()">
添加商品 添加商品
</el-button> </el-button>
</template> </template>
<template v-slot="scope"> <template v-slot="scope">
<el-button type="text" :disabled="scope.row.type != 'sku' && isSyncStatus()" <el-button type="text" :disabled="scope.row.type != 'sku' && isSyncStatus()"
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button> @click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
<el-button type="text" @click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)" <el-button type="text"
:disabled="isSyncStatus()">删除</el-button> @click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)">删除</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<div v-if="ruleForm.groupType == 1">
<div class="group_wrap" v-for="(item, index) in ruleForm.proGroupVo" :key="index">
<el-form inline :model="item">
<el-form-item label="规格组名">
<el-input v-model="item.title" :disabled="isSyncStatus()" />
</el-form-item>
<el-form-item :label="`本组菜品${item.goods.length}选`">
<el-input v-model="item.number" :disabled="isSyncStatus()" />
</el-form-item>
<el-form-item>
<el-button @click="ruleForm.proGroupVo.splice(index, 1)" :disabled="isSyncStatus()">
删除
</el-button>
</el-form-item>
</el-form>
<div style="margin-top: 20px">
<el-table border :data="item.goods">
<el-table-column label="名称" prop="proName"></el-table-column>
<el-table-column label="规格" prop="skuName"></el-table-column>
<el-table-column label="价格" prop="price"></el-table-column>
<el-table-column label="数量" prop="number">
<template v-slot="scope">
<el-input-number v-model="scope.row.number" :min="0" :disabled="isSyncStatus()" />
</template>
</el-table-column>
<el-table-column width="150">
<template #header>
<el-button type="primary" @click="addgoods(index)" :disabled="isSyncStatus()">
添加商品
</el-button>
</template>
<template v-slot="scope">
<el-button type="text" :disabled="scope.row.type != 'sku' && isSyncStatus()"
@click="showSelectSkuHandle(scope.row, scope.$index, index)">设置规格</el-button>
<el-button type="text" @click="ruleForm.proGroupVo[index].goods.splice(scope.$index, 1)"
:disabled="isSyncStatus()">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
</div>
<el-button type="primary" @click="addtaocan" :disabled="isSyncStatus()">
添加套餐组
</el-button>
</div>
</div> </div>
<el-button type="primary" @click="addtaocan" :disabled="isSyncStatus()"> </el-form-item>
添加套餐组 <el-form-item label="选择规格" v-if="ruleForm.type == 'sku'">
</el-button> <div class="center">
</div> <el-select v-model="ruleForm.specId" placeholder="请选择规格" style="width: 500px" @change="selectSpecHandle"
</div> :disabled="isSyncStatus()">
</el-form-item> <el-option :label="item.name" :value="item.id" v-for="item in datas.specificationsconfig"
<el-form-item label="选择规格" v-if="ruleForm.type == 'sku'"> :key="item.id"></el-option>
<el-select v-model="ruleForm.specId" placeholder="请选择规格" style="width: 500px" @change="selectSpecHandle" </el-select>
:disabled="isSyncStatus()"> <el-button type="primary" icon="Plus" style="margin-left: 14px;"
<el-option :label="item.name" :value="item.id" v-for="item in datas.specificationsconfig" @click="addSkuModalRef?.open()">添加规格</el-button>
:key="item.id"></el-option> </div>
</el-select> </el-form-item>
</el-form-item> <el-form-item :label="ele.name" v-if="datas.selectSpeclist.length" v-for="ele in datas.selectSpeclist"
<el-form-item :label="ele.name" v-if="datas.selectSpeclist.length" v-for="ele in datas.selectSpeclist" :key="ele.name">
:key="ele.name"> <el-checkbox-group v-model="ele.selectSpecResult" @change="selectSpecResultChange">
<el-checkbox-group v-model="ele.selectSpecResult" @change="selectSpecResultChange"> <el-checkbox :value="element.name" :label="element.name" v-for="(element, index) in ele.children"
<el-checkbox :value="element.name" :label="element.name" v-for="(element, index) in ele.children" :key="index"></el-checkbox>
:key="index"></el-checkbox> </el-checkbox-group>
</el-checkbox-group> </el-form-item>
</el-form-item> <!-- 规格属性 -->
<!-- 规格属性 --> <!-- 规格称重 -->
<!-- 单规格称重 --> <SpecificationAttribute v-if="ruleForm.type != 'sku'" :info="ruleForm" :list="list"
<SpecificationAttribute v-if="ruleForm.type != 'sku'" :info="ruleForm" :list="list" ref="specificationAttributeRef">
ref="specificationAttributeRef"> </SpecificationAttribute>
</SpecificationAttribute> <SpecificationAttribute v-if="ruleForm.type == 'sku' && list.length"
<SpecificationAttribute v-if="ruleForm.type == 'sku' && list.length" :specTableHeaders="datas.specTableHeaders" :specTableHeaders="datas.specTableHeaders" :info="ruleForm" :list="list" ref="specificationAttributeRef">
:info="ruleForm" :list="list" ref="specificationAttributeRef"></SpecificationAttribute> </SpecificationAttribute>
<el-form-item label="重量"> <el-form-item label="重量" v-if="ruleForm.type == 'weight'">
<el-col :span="12"> <el-col :span="12">
<div style="display: block"> <div style="display: block">
<el-input v-model="ruleForm.weight" placeholder="" :disabled="isSyncStatus()"> <el-input v-model="ruleForm.weight" placeholder="纯文本描述"></el-input>
<template #append>千克</template> <!-- <div style="color: #999;">用于快递或配送运费计重</div> -->
</el-input> </div>
<!-- <div style="color: #999;">用于快递或配送运费计重</div> --> </el-col>
</div> </el-form-item>
</el-col> <el-form-item label="是否允许临时改价">
</el-form-item> <el-radio-group v-model="ruleForm.isAllowTempModifyPrice" :disabled="isSyncStatus()">
<el-form-item label="是否允许临时改价"> <el-radio :value="1">允许</el-radio>
<el-radio-group v-model="ruleForm.isAllowTempModifyPrice" :disabled="isSyncStatus()"> <el-radio :value="0">不允许</el-radio>
<el-radio :value="1">允许</el-radio> </el-radio-group>
<el-radio :value="0">不允许</el-radio> </el-form-item>
</el-radio-group> <!-- <el-form-item label="每日销量上限">
</el-form-item>
<!-- <el-form-item label="每日销量上限">
<el-input-number v-model="ruleForm.dayLimit" :min="0" /> <el-input-number v-model="ruleForm.dayLimit" :min="0" />
</el-form-item> </el-form-item>
<el-form-item label="每单限购"> <el-form-item label="每单限购">
@@ -197,169 +204,182 @@
<el-form-item label="每人限购"> <el-form-item label="每人限购">
<el-input-number v-model="ruleForm.dayLimit" :min="0" /> <el-input-number v-model="ruleForm.dayLimit" :min="0" />
</el-form-item> --> </el-form-item> -->
<el-form-item label="定时上下架"> <el-form-item label="售卖时间">
<el-checkbox-group v-model="ruleForm.days"> <el-checkbox-group v-model="ruleForm.days">
<el-checkbox v-for="(item, index) in datas.cycle" :key="item.value" :value="item.value"> <el-checkbox v-for="(item, index) in datas.cycle" :key="item.value" :value="item.value">
{{ item.label }} {{ item.label }}
</el-checkbox> </el-checkbox>
</el-checkbox-group> </el-checkbox-group>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-col :span="20"> <el-col :span="20">
<!-- <el-time-picker v-model="ruleForm.useTime" is-range range-separator="至" start-placeholder="开始时间" <!-- <el-time-picker v-model="ruleForm.useTime" is-range range-separator="至" start-placeholder="开始时间"
end-placeholder="结束时间" value-format="HH:mm:ss" format="HH:mm:ss" /> end-placeholder="结束时间" value-format="HH:mm:ss" format="HH:mm:ss" />
--> -->
<el-time-picker v-model="ruleForm.startTime" value-format="HH:mm:ss" format="HH:mm:ss"
<el-time-picker v-model="ruleForm.startTime" value-format="HH:mm:ss" format="HH:mm:ss" placeholder="选择开始时间"> placeholder="选择开始时间">
</el-time-picker>- </el-time-picker> <el-text type="info">-</el-text> <el-time-picker v-model="ruleForm.endTime"
<el-time-picker v-model="ruleForm.endTime" value-format="HH:mm:ss" format="HH:mm:ss" placeholder="选择结束时间"> value-format="HH:mm:ss" format="HH:mm:ss" placeholder="选择结束时间">
</el-time-picker> </el-time-picker>
</el-col> </el-col>
</el-form-item> </el-form-item>
<el-form-item label="上架"> <el-form-item label="上架">
<el-switch v-model="ruleForm.isSale" :active-value="1" :inactive-value="0" /> <el-switch v-model="ruleForm.isSale" :active-value="1" :inactive-value="0" />
</el-form-item> </el-form-item>
<!-- <el-form-item label="库存开关"> <!-- <el-form-item label="库存开关">
<div style="display: block;"> <div style="display: block;">
<el-switch v-model="ruleForm.isStock" :active-value="1" :inactive-value="0" :disabled="isSyncStatus()" /> <el-switch v-model="ruleForm.isStock" :active-value="1" :inactive-value="0" :disabled="isSyncStatus()" />
<div style="color: #999;">关闭则不计算出库数据</div> <div style="color: #999;">关闭则不计算出库数据</div>
</div> </div>
</el-form-item> --> </el-form-item> -->
<el-form-item label="设为推荐" prop="delivery"> <el-form-item label="设为推荐" prop="delivery">
<el-switch v-model="ruleForm.isHot" :active-value="1" :inactive-value="0" /> <div class="center">
</el-form-item> <el-switch v-model="ruleForm.isHot" :active-value="1" :inactive-value="0" />
<!-- <el-form-item label="库存数量"> <el-text>推荐后商品会展示在用户小程序端热销模块内</el-text>
</div>
</el-form-item>
<!-- <el-form-item label="库存数量">
<el-input-number v-model="ruleForm.stockNumber" :min="0" /> <el-input-number v-model="ruleForm.stockNumber" :min="0" />
</el-form-item> --> </el-form-item> -->
<el-form-item label="打包费" prop="delivery"> <el-form-item label="打包费" prop="delivery">
<div style="display: block;"> <div style="display: block;">
<el-input-number v-model="ruleForm.packFee" controls-position="right" <el-input-number v-model="ruleForm.packFee" controls-position="right"
:disabled="isSyncStatus()"></el-input-number> :disabled="isSyncStatus()"></el-input-number>
<div style="color: #999;">单份商品打包费店铺开启外卖模式下该数据才生效</div> <div style="color: #999;">单份商品打包费店铺开启外卖模式下该数据才生效</div>
</div>
</el-form-item>
</div> </div>
</el-form-item> <!-- 耗材设置 -->
</div> <div v-show="stepsActiveName == 1">
<div v-show="addFormType == 2" style="padding-bottom: 20px;"> <el-tabs v-model="tabsActiveName">
<!-- 耗材绑定 --> <el-tab-pane label="耗材设置" :name="1">
<el-form-item label="绑定耗材"></el-form-item> <el-form-item label="耗材列表">
<el-form-item label="商品名">{{ ruleForm.name }}</el-form-item> <el-table :data="ruleForm.consList" border>
<el-form-item> <el-table-column label="序号" type="index" width="60"></el-table-column>
<el-table :data="ruleForm.consList" border> <el-table-column label="耗材名称" prop="consInfoId">
<el-table-column label="序号" type="index" width="60"></el-table-column> <template v-slot="scope">
<el-table-column label="耗材名称" prop="consInfoId"> <el-select filterable v-model="scope.row.consInfoId" reserve-keyword placeholder="请输入关键词"
<template v-slot="scope"> @change="selectionChange($event, scope.row)">
<el-select filterable v-model="scope.row.consInfoId" reserve-keyword placeholder="请输入关键词" <el-option v-for="item in consOptions" :key="item.id" :label="item.conName"
@change="selectionChange($event, scope.row)"> :value="item.id"></el-option>
<el-option v-for="item in consOptions" :key="item.id" :label="item.conName" </el-select>
:value="item.id"></el-option> <!-- <div class="tips" v-if="scope.row.stockNumber">库存{{ scope.row.stockNumber }}</div> -->
</el-select> </template>
<!-- <div class="tips" v-if="scope.row.stockNumber">库存{{ scope.row.stockNumber }}</div> --> </el-table-column>
</template> <el-table-column label="单位" prop="conUnit">
</el-table-column> <template v-slot="scope">
<el-table-column label="单位" prop="conUnit"> <el-input v-model="scope.row.conUnit" readonly disabled placeholder="请选择耗材"></el-input>
<template v-slot="scope"> <!-- <el-select v-model="scope.row.conUnit" reserve-keyword placeholder="请输入关键词">
<el-input v-model="scope.row.conUnit" readonly disabled placeholder="请选择耗材"></el-input> <el-option
<!-- <el-select v-model="scope.row.conUnit" reserve-keyword placeholder="请输入关键词"> v-for="item in returnConUnits(scope.row.consInfoId)"
<el-option :key="item"
v-for="item in returnConUnits(scope.row.consInfoId)" :label="item"
:key="item" :value="item"
:label="item" ></el-option>
:value="item" </el-select> -->
></el-option> </template>
</el-select> --> </el-table-column>
</template> <el-table-column label="使用数量" prop="surplusStock" min-width="150px">
</el-table-column> <template v-slot="scope">
<el-table-column label="使用数量" prop="surplusStock" min-width="150px"> <el-input-number v-model="scope.row.surplusStock" :min="0" />
<template v-slot="scope"> </template>
<el-input-number v-model="scope.row.surplusStock" :min="0" /> </el-table-column>
</template> <el-table-column label="操作" width="100">
</el-table-column> <template #header>
<el-table-column label="操作" width="100"> <el-button type="primary" size="small" @click="createItem">添加</el-button>
<template #header> </template>
<el-button type="primary" size="small" @click="createItem">添加</el-button> <template v-slot="scope">
</template> <div class="table_btn_wrap">
<template v-slot="scope"> <div class="btn sub" @click="ruleForm.consList.splice(scope.$index, 1)">
<div class="table_btn_wrap"> <el-icon>
<div class="btn sub" @click="ruleForm.consList.splice(scope.$index, 1)"> <RemoveFilled />
<el-icon> </el-icon>
<RemoveFilled /> </div>
</el-icon> <!-- <div class="btn add" v-if="scope.$index == ruleForm.consList.length - 1"
</div>
<!-- <div class="btn add" v-if="scope.$index == ruleForm.consList.length - 1"
@click="createItem(scope.row)"> @click="createItem(scope.row)">
<el-icon> <el-icon>
<CirclePlusFilled /> <CirclePlusFilled />
</el-icon> </el-icon>
</div> --> </div> -->
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</el-form-item> </el-form-item>
<el-form-item label="自动售罄"> <el-form-item label="自动售罄">
<div class="center"> <div class="center">
<el-switch v-model="ruleForm.isAutoSoldStock" :active-value="1" :inactive-value="0"></el-switch> <el-switch v-model="ruleForm.isAutoSoldStock" :active-value="1" :inactive-value="0"></el-switch>
<el-text type="info">当绑定的任何一种耗材库存不足时商品自动售罄</el-text> <el-text type="info">当绑定的任何一种耗材库存不足时商品自动售罄</el-text>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="退菜是否退库存"> <el-form-item label="退菜是否退库存">
<div class="column"> <div class="column">
<div> <div>
<el-radio-group v-model="ruleForm.refundMode"> <el-radio-group v-model="ruleForm.refundMode">
<el-radio label="退菜退库存" :value="1"></el-radio> <el-radio label="退菜退库存" :value="1"></el-radio>
<el-radio label="仅退菜不退库存" :value="2"></el-radio> <el-radio label="仅退菜不退库存" :value="2"></el-radio>
<el-radio label="每次询问-退菜后弹窗提示,可手动选择" :value="3"></el-radio> <el-radio label="每次询问-退菜后弹窗提示,可手动选择" :value="3"></el-radio>
</el-radio-group> </el-radio-group>
</div> </div>
<div> <div>
<el-text type="danger">当前店铺退菜退库存规则{{ shopInfoTypeFilter(shopInfo.refundMode) }}</el-text> <el-text type="danger">当前店铺退菜退库存规则{{ shopInfoTypeFilter(shopInfo.refundMode) }}</el-text>
</div> </div>
</div> </div>
</el-form-item> </el-form-item>
</div> </el-tab-pane>
<el-form-item label="关联推荐商品" v-show="addFormType == 3"> <el-tab-pane label="关联商品设置" :name="2">
<div class="column"> <el-form-item label="关联商品设置">
<div class="row"> <div class="column">
<div class="center"> <div class="row">
<el-button type="primary" @click="selecProductDialogRef?.show()" <div class="center">
:disabled="ruleForm.relatedRecommendJson.length >= goodsListMax">添加商品</el-button> <el-button type="primary" @click="selecProductDialogRef?.show()"
<div class="tips">设置商品后用户可以在商品详情页中看到推荐商品可拖动调整顺序最多设置{{ goodsListMax }}商品</div> :disabled="ruleForm.relatedRecommendJson.length >= goodsListMax">添加商品</el-button>
</div> <div class="tips">设置商品后用户可以在商品详情页中看到推荐商品可拖动调整顺序最多设置{{ goodsListMax }}个商品</div>
</div> </div>
<div class="row"> </div>
<div id="goods_table_drag"> <div class="row">
<el-table :data="ruleForm.relatedRecommendJson" border stripe style="width: 500px;" row-key="id"> <div id="goods_table_drag">
<!-- 拖拽列 --> <el-table :data="ruleForm.relatedRecommendJson" border stripe row-key="id">
<el-table-column label="排序" width="60"> <!-- 拖拽列 -->
<template v-slot="scope"> <el-table-column label="排序" width="60">
<div class="drag-handle"></div> <template v-slot="scope">
</template> <div class="drag-handle"></div>
</el-table-column> </template>
<el-table-column label="商品图片" prop="coverImg" width="90"> </el-table-column>
<template v-slot="scope"> <el-table-column label="商品图片" prop="coverImg" width="90">
<el-image :src="scope.row.coverImg" style="width: 50px;height: 50px;border-radius: 4px;" <template v-slot="scope">
fit="cover"></el-image> <el-image :src="scope.row.coverImg" style="width: 50px;height: 50px;border-radius: 4px;"
</template> fit="cover"></el-image>
</el-table-column> </template>
<el-table-column label="商品名称" prop="name"></el-table-column> </el-table-column>
<el-table-column label="操作" width="100"> <el-table-column label="商品名称" prop="name"></el-table-column>
<template v-slot="scope"> <el-table-column label="操作" width="100">
<el-button link type="danger" <template v-slot="scope">
@click="ruleForm.relatedRecommendJson.splice(scope.$index, 1)">删除</el-button> <el-button link type="danger"
</template> @click="ruleForm.relatedRecommendJson.splice(scope.$index, 1)">删除</el-button>
</el-table-column> </template>
</el-table> </el-table-column>
</div> </el-table>
</div>
</div>
</div>
</el-form-item>
</el-tab-pane>
</el-tabs>
</div> </div>
</div> </div>
</el-form-item> <el-form-item>
<el-form-item> <el-button type="primary" @click="nextStep" v-if="stepsActiveName == 0">下一步</el-button>
<el-button type="primary" @click="submitForm(ruleFormRef)">确定</el-button> <el-button type="primary" @click="submitForm(ruleFormRef)" v-if="stepsActiveName == 1">保存</el-button>
<el-button @click="resetForm(ruleFormRef)">取消</el-button> <el-button @click="resetForm(ruleFormRef)" v-if="stepsActiveName == 0">取消</el-button>
</el-form-item> <el-button @click="stepsActiveName = 0" v-if="stepsActiveName != 0">上一步</el-button>
</el-form> </el-form-item>
</el-form>
</div>
<!-- 选择商品 --> <!-- 选择商品 -->
<shopList ref="shopListRef" @success="selectShopRes" /> <!-- <shopList ref="shopListRef" @success="selectShopRes" /> -->
<GoodsSelect ref="shopListRef" @success="selectShopRes" />
<el-dialog :title="datas.selectSkuItem.proName" v-model="datas.showSelectSku"> <el-dialog :title="datas.selectSkuItem.proName" v-model="datas.showSelectSku">
<div class="pro_sku"> <div class="pro_sku">
<div class="item"> <div class="item">
@@ -381,6 +401,14 @@
</el-dialog> </el-dialog>
<!-- 选择商品弹窗 --> <!-- 选择商品弹窗 -->
<selecProductDialog ref="selecProductDialogRef" @success="selecProductSuccess" /> <selecProductDialog ref="selecProductDialogRef" @success="selecProductSuccess" />
<!-- 添加单位 -->
<addUnit ref="addUnitRef" @success="getList" />
<!-- 添加商品分类 -->
<addCategory ref="addCategoryRef" @success="getList" />
<!-- 添加商品分组 -->
<addGoodsGroup ref="addGoodsGroupRef" @success="getGoodsGroupList" />
<!-- 添加规格 -->
<addSkuModal ref="addSkuModalRef" @success="tbProductSpecGet" />
</div> </div>
</template> </template>
@@ -394,20 +422,27 @@ import UserAPI from "@/api/product/productclassification";
import UserAPI2 from "@/api/product/commonUnits"; import UserAPI2 from "@/api/product/commonUnits";
import UserAPI3 from "@/api/product/index"; import UserAPI3 from "@/api/product/index";
import UserAPI4 from "@/api/product/specificationsconfig"; import UserAPI4 from "@/api/product/specificationsconfig";
import GoodsGroupAPI from "@/api/onlineShop/goodsGroupconfig";
import shopList from "@/components/mycomponents/shopList.vue"; import shopList from "@/components/mycomponents/shopList.vue";
import AddImg from "@/components/mycomponents/addImg.vue"; import AddImg from "@/components/mycomponents/addImg.vue";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import Sortable from "sortablejs"; import Sortable from "sortablejs";
import { useTagsViewStore } from "@/store"; import { useTagsViewStore } from "@/store";
import selecProductDialog from "@/views/marketing_center/group_booking/components/selecProductDialog.vue"; import selecProductDialog from "@/views/marketing_center/group_booking/components/selecProductDialog.vue";
import addUnit from "../components/addUnit.vue";
import addCategory from "../components/addCategory.vue";
import addGoodsGroup from "@/views/online-shop/components/addGoodsGroup.vue";
import GoodsSelect from '@/components/GoodsSelect/index.vue'
import addSkuModal from "../components/addSkuModal.vue";
const route = useRoute(); const route = useRoute();
const selecProductDialogRef = ref(null) const selecProductDialogRef = ref(null)
const goodsListMax = ref(9) const goodsListMax = ref(9)
const addUnitRef = ref(null)
const addFormType = ref(1)
const consOptions = ref([]) const consOptions = ref([])
const addCategoryRef = ref(null)
const addGoodsGroupRef = ref(null)
const addSkuModalRef = ref(null)
// let haocaiData = ref({ // let haocaiData = ref({
// consList: [ // consList: [
@@ -419,6 +454,38 @@ const consOptions = ref([])
// ] // ]
// }); // });
const stepsActiveName = ref(0);
const tabsActiveName = ref(1);
const stepRules = [
'name',
'unitId',
'categoryId',
'images',
]
const goodsGroupList = ref([])
async function getGoodsGroupList() {
try {
goodsGroupList.value = await GoodsGroupAPI.getList()
} catch (error) {
console.log(error);
}
}
onMounted(() => {
getGoodsGroupList()
})
// 校验基础信息的表单是否通过
async function nextStep() {
try {
await ruleFormRef.value.validateField(stepRules)
stepsActiveName.value++
} catch (error) {
console.log(error);
}
}
// 生成新商品绑定耗材关系项 // 生成新商品绑定耗材关系项
function createItem(val) { function createItem(val) {
let item = { let item = {
@@ -615,6 +682,7 @@ const ruleForm = reactive<RuleForm>({
unitId: "", unitId: "",
// 分类id // 分类id
categoryId: "", categoryId: "",
proGroupIds: [], // 商品分组集合
// 封面图url // 封面图url
coverImg: "", coverImg: "",
// 详情图urls // 详情图urls
@@ -637,16 +705,16 @@ const ruleForm = reactive<RuleForm>({
// sku集合 // sku集合
skuList: [], skuList: [],
// 重量 // 重量
weight: 0, weight: '',
// 是否允许改价 // 是否允许改价
isAllowTempModifyPrice: 1, isAllowTempModifyPrice: 1,
// 定时上下架周期 // 定时上下架周期
days: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"], days: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"],
useTime: ["00:00:00", "23:59:59"], useTime: ["00:00:00", "23:59:59"],
// 开始时间 // 开始时间
startTime: "", startTime: "00:00:00",
// 结束时间 // 结束时间
endTime: "", endTime: "23:59:59",
// 是否上架 // 是否上架
isSale: "1", isSale: "1",
// 是否开启库存 // 是否开启库存
@@ -794,11 +862,17 @@ function showSelectSkuHandle(row: any, index: any, tabIndex: any) {
datas.selectSkuItem = obj; datas.selectSkuItem = obj;
} }
// 添加商品
// 显示添加套餐商品弹窗
function addgoods(index: number = -1) { function addgoods(index: number = -1) {
datas.addGroupIndex = index; datas.addGroupIndex = index;
(shopListRef.value as any)?.opens(); if (ruleForm.groupType == 0) {
(shopListRef.value as any)?.show(ruleForm.proGroupVo[0].goods || []);
} else {
(shopListRef.value as any)?.show(ruleForm.proGroupVo[index].goods || []);
}
} }
function deleteEvent(d: any) { function deleteEvent(d: any) {
if (isSyncStatus()) { if (isSyncStatus()) {
ElMessage.error('当前同步启用状态下不可修改') ElMessage.error('当前同步启用状态下不可修改')
@@ -874,7 +948,7 @@ function createSkuHeader() {
// 可选套餐弹窗 // 可选套餐弹窗
function addtaocan() { function addtaocan() {
datas.addGroupIndex = -1; datas.addGroupIndex = -1;
(shopListRef.value as any)?.opens(); (shopListRef.value as any)?.show();
} }
// 生成多规格表体 // 生成多规格表体
function createSkuBody() { function createSkuBody() {
@@ -962,6 +1036,7 @@ function changeTypeEnum(item: string) {
list.value = [datas.defaultSku]; list.value = [datas.defaultSku];
} }
} }
// 笛卡尔积算法 // 笛卡尔积算法
function cartesian(arr) { function cartesian(arr) {
if (arr.length < 2) return arr[0] || []; if (arr.length < 2) return arr[0] || [];
@@ -977,6 +1052,7 @@ function cartesian(arr) {
return res; return res;
}); });
} }
// 套餐类型切换 // 套餐类型切换
function typeChange() { function typeChange() {
// ruleForm.typeEnum = 'normal' // ruleForm.typeEnum = 'normal'
@@ -1125,8 +1201,13 @@ const resetForm = (formEl: FormInstance | undefined) => {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
.addgoods { .addgoods {
padding: 20px; padding: 14px;
background-color: #fff;
.form_wrap {
background-color: #fff;
border-radius: 14px;
padding: 14px;
}
} }
.pro_sku { .pro_sku {

View File

@@ -13,7 +13,8 @@ const contentConfig: IContentConfig<UserPageQuery> = {
rowKey: 'id', rowKey: 'id',
treeProps: { treeProps: {
children: 'skuList' // 指定子节点存储的字段为 customChildren children: 'skuList' // 指定子节点存储的字段为 customChildren
} },
selectOnIndeterminate: false,
}, },
pagination: { pagination: {
background: true, background: true,
@@ -89,9 +90,12 @@ const contentConfig: IContentConfig<UserPageQuery> = {
} }
], ],
cols: [ cols: [
// { type: "selection", width: 50, align: "center" }, {
type: "selection", width: 50, align: "center", selectable: (row) => !row.barCode,
},
{ label: "封面图", align: "center", prop: "coverImg", templet: "image" }, { label: "封面图", align: "center", prop: "coverImg", templet: "image" },
{ label: "商品名称", align: "center", prop: "name", }, { label: "商品名称", align: "center", prop: "name", },
{ label: "分类", align: "center", prop: "categoryName", },
{ label: "售价", align: "center", prop: "lowPrice" }, { label: "售价", align: "center", prop: "lowPrice" },
{ {
label: "商品规格", align: "center", prop: "type", templet: "custom", label: "商品规格", align: "center", prop: "type", templet: "custom",
@@ -129,7 +133,7 @@ const contentConfig: IContentConfig<UserPageQuery> = {
slotName: "autoSellOut", slotName: "autoSellOut",
}, },
{ {
label: "退菜是否退库存", label: "退菜退库存",
align: "center", align: "center",
prop: "refundMode", prop: "refundMode",
templet: "custom", templet: "custom",

View File

@@ -86,7 +86,7 @@ const searchConfig: ISearchConfig = {
label: "排序", label: "排序",
prop: "orderBy", prop: "orderBy",
attrs: { attrs: {
placeholder: "请选择商品分类", placeholder: "请选择排序方式",
clearable: true, clearable: true,
style: { style: {
width: "200px", width: "200px",

View File

@@ -29,10 +29,12 @@
<copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" /> <copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" />
</template> </template>
<template #operates="scope"> <template #operates="scope">
<el-button type="text" size="small" v-if="scope.row.level < 3 && !isSyncStatus()" <!-- <el-button type="text" size="small" v-if="scope.row.level < 3 && !isSyncStatus()"
@click="addlowerLevel(scope.row)">添加下一级</el-button> @click="addlowerLevel(scope.row)">添加下一级</el-button> -->
<el-button type="text" size="small" v-if="!isSyncStatus()" @click="handleEditClick(scope.row)">编辑</el-button> <el-button type="primary" link size="small" v-if="!isSyncStatus() && scope.row.pid == 0"
<el-button type="text" size="small" v-if="!isSyncStatus()" @click="deleteClick(scope.row)">删除</el-button> @click="handleEditClick(scope.row)">编辑</el-button>
<el-button type="danger" link size="small" v-if="!isSyncStatus()"
@click="deleteClick(scope.row)">删除</el-button>
</template> </template>
</page-content> </page-content>
<!-- 添加下一级-编辑 --> <!-- 添加下一级-编辑 -->
@@ -110,6 +112,7 @@
</page-content> </page-content>
</template> </template>
</div> </div>
<addSkuModal ref="addSkuModalRef" @success="handleResetClick" />
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
@@ -124,6 +127,9 @@ import editModalConfig from "./specificationsconfig/edit";
import searchConfig from "./specificationsconfig/search"; import searchConfig from "./specificationsconfig/search";
import { pid } from "process"; import { pid } from "process";
import { isSyncStatus } from "@/utils/index"; import { isSyncStatus } from "@/utils/index";
import addSkuModal from "./components/addSkuModal.vue";
const addSkuModalRef = ref(null)
const validateSku1 = (rule, value, callback) => { const validateSku1 = (rule, value, callback) => {
if (!datas.skuForm.label) { if (!datas.skuForm.label) {
@@ -300,36 +306,38 @@ function deleteClick(item: any) {
} }
// 新增 // 新增
async function handleAddClick() { async function handleAddClick() {
myDialogRef.value?.open(); addSkuModalRef.value?.open()
addModalRef.value?.setModalVisible(); // myDialogRef.value?.open();
// addModalRef.value?.setModalVisible();
// 加载上级规格下拉数据源 // 加载上级规格下拉数据源
addModalConfig.formItems[2]!.attrs!.data = await UserAPI.getPage({ name: "" }); // addModalConfig.formItems[2]!.attrs!.data = await UserAPI.getPage({ name: "" });
// 加载角色下拉数据源 // 加载角色下拉数据源
// addModalConfig.formItems[4]!.options = await RoleAPI.getOptions(); // addModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
} }
// 编辑 // 编辑
async function handleEditClick(row: IObject) { async function handleEditClick(row: IObject) {
editModalRef.value?.handleDisabled(false); addSkuModalRef.value?.open(row)
// 加载部门下拉数据源 // editModalRef.value?.handleDisabled(false);
editModalConfig.formItems[2]!.attrs!.data = [{ // // 加载部门下拉数据源
createTime: "", // editModalConfig.formItems[2]!.attrs!.data = [{
fullName: "顶级", // createTime: "",
id: "0", level: 1, // fullName: "顶级",
name: "顶级", // id: "0", level: 1,
pid: "0", // name: "顶级",
pids: "0,", // pid: "0",
shopId: "1", // pids: "0,",
sort: 1, // shopId: "1",
status: 1, // sort: 1,
updateTime: "", // status: 1,
children: await UserAPI.getPage({ name: "" }) // updateTime: "",
}] // children: await UserAPI.getPage({ name: "" })
// }]
// 加载角色下拉数据源 // 加载角色下拉数据源
// editModalConfig.formItems[4]!.options = await RoleAPI.getOptions(); // editModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
// 根据id获取数据进行填充 // 根据id获取数据进行填充
const data = await UserAPI.getunitinfo(row.id); // const data = await UserAPI.getunitinfo(row.id);
editModalRef.value?.setFormData(data); // editModalRef.value?.setFormData(data);
editModalRef.value?.setModalVisible(); // editModalRef.value?.setModalVisible();
} }
// 其他工具栏 // 其他工具栏

View File

@@ -62,9 +62,10 @@ const contentConfig: IContentConfig<UserPageQuery> = {
// }, // },
{ {
label: "操作", label: "操作",
width: '150',
slotName: "operates", slotName: "operates",
templet: "custom", templet: "custom",
align: "center", align: "left",
}, },
], ],
}; };

View File

@@ -23,20 +23,8 @@
<copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" /> <copy-button v-if="scope.row[scope.prop]" :text="scope.row[scope.prop]" style="margin-left: 2px" />
</template> </template>
</page-content> </page-content>
<!-- 添加/编辑单位 -->
<!-- 新增 --> <addUnit ref="addUnitRef" @success="handleQueryClick" />
<page-modal ref="addModalRef" :modal-config="addModalConfig" @submit-click="handleSubmitClick">
<template #gender="scope">
<Dict v-model="scope.formData[scope.prop]" code="gender" />
</template>
</page-modal>
<!-- 编辑 -->
<page-modal ref="editModalRef" :modal-config="editModalConfig" @submit-click="handleSubmitClick">
<template #gender="scope">
<Dict v-model="scope.formData[scope.prop]" code="gender" v-bind="scope.attrs" />
</template>
</page-modal>
</template> </template>
<template v-else> <template v-else>
<page-content ref="contentRef" :content-config="contentConfig2" @operat-click="handleOperatClick"> <page-content ref="contentRef" :content-config="contentConfig2" @operat-click="handleOperatClick">
@@ -62,6 +50,9 @@ import contentConfig2 from "./unitconfig/content2";
import editModalConfig from "./unitconfig/edit"; import editModalConfig from "./unitconfig/edit";
import searchConfig from "./unitconfig/search"; import searchConfig from "./unitconfig/search";
import { isSyncStatus, downloadFile } from "@/utils/index"; import { isSyncStatus, downloadFile } from "@/utils/index";
import addUnit from "./components/addUnit.vue";
const addUnitRef = ref(null)
const { const {
searchRef, searchRef,
@@ -101,23 +92,25 @@ async function handleExportClick() {
// 新增 // 新增
async function handleAddClick() { async function handleAddClick() {
addModalRef.value?.setModalVisible(); addUnitRef.value.open()
// 加载部门下拉数据源 // addModalRef.value?.setModalVisible();
addModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions(); // // 加载部门下拉数据源
// 加载角色下拉数据源 // addModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
addModalConfig.formItems[4]!.options = await RoleAPI.getOptions(); // // 加载角色下拉数据源
// addModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
} }
// 编辑 // 编辑
async function handleEditClick(row: IObject) { async function handleEditClick(row: IObject) {
editModalRef.value?.handleDisabled(false); addUnitRef.value.open(row)
// 加载部门下拉数据源 // editModalRef.value?.handleDisabled(false);
// editModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions(); // // 加载部门下拉数据源
// 加载角色下拉数据源 // // editModalConfig.formItems[2]!.attrs!.data = await DeptAPI.getOptions();
// editModalConfig.formItems[4]!.options = await RoleAPI.getOptions(); // // 加载角色下拉数据源
// 根据id获取数据进行填充 // // editModalConfig.formItems[4]!.options = await RoleAPI.getOptions();
const data = await UserAPI.getunitinfo(row.id); // // 根据id获取数据进行填充
editModalRef.value?.setFormData(data); // const data = await UserAPI.getunitinfo(row.id);
editModalRef.value?.setModalVisible(); // editModalRef.value?.setFormData(data);
// editModalRef.value?.setModalVisible();
} }
// 其他工具栏 // 其他工具栏

View File

@@ -7,7 +7,7 @@
<el-input v-model="state.query.name" clearable placeholder="请输入分店名称" style="width: 100%" class="filter-item" <el-input v-model="state.query.name" clearable placeholder="请输入分店名称" style="width: 100%" class="filter-item"
@keyup.enter="getTableData" /> @keyup.enter="getTableData" />
</el-col> </el-col>
<el-col :span="16"> <el-col :span="16">
<el-button type="primary" @click="getTableData">查询</el-button> <el-button type="primary" @click="getTableData">查询</el-button>
@@ -22,35 +22,43 @@
</el-row> </el-row>
</el-card> </el-card>
</div> </div>
<div style="padding-bottom: 14px;">
<el-alert title="分店需由工作人员协助开通" type="warning" :closable="false" show-icon />
</div>
<div class="head-container"> <div class="head-container">
<el-card shadow="never"> <el-card shadow="never">
<el-table v-loading="state.tableData.loading" :data="state.tableData.list"> <el-table v-loading="state.tableData.loading" :data="state.tableData.list">
<el-table-column prop="id" label="ID" width="80" /> <el-table-column prop="id" label="ID" width="80" />
<el-table-column label="店铺信息"> <el-table-column label="店铺信息">
<template v-slot="scope"> <template v-slot="scope">
<div>{{ scope.row.shopName }}{{ scope.row.shopType == 'chain' ? '(连锁店)' : scope.row.shopType == 'join' ? '(加盟店)' : '' }}</div> <div>{{ scope.row.shopName }}{{ scope.row.shopType == 'chain' ? '(连锁店)' : scope.row.shopType == 'join' ?
'(加盟店)' : '' }}</div>
<div>账号{{ scope.row.account }}</div> <div>账号{{ scope.row.account }}</div>
<div>联系电话{{ scope.row.phone }}</div> <div>联系电话{{ scope.row.phone }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="isEnableProdSync" label="商品同步" width="120"> <el-table-column prop="isEnableProdSync" label="商品同步" width="120">
<template v-slot="scope"> <template v-slot="scope">
<el-tag :type="scope.row.isEnableProdSync == 1 ? 'success' : 'error'" effect="dark"> {{ scope.row.isEnableProdSync == 1 ? '启用' : '禁用' }} </el-tag> <el-tag :type="scope.row.isEnableProdSync == 1 ? 'success' : 'error'" effect="dark"> {{
scope.row.isEnableProdSync == 1 ? '启用' : '禁用' }} </el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="isEnableVipSync" label="会员同步" width="120"> <el-table-column prop="isEnableVipSync" label="会员同步" width="120">
<template v-slot="scope"> <template v-slot="scope">
<el-tag :type="scope.row.isEnableVipSync == 1 ? 'success' : 'error'" effect="dark"> {{ scope.row.isEnableVipSync == 1 ? '启用' : '禁用' }} </el-tag> <el-tag :type="scope.row.isEnableVipSync == 1 ? 'success' : 'error'" effect="dark"> {{
scope.row.isEnableVipSync == 1 ? '启用' : '禁用' }} </el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="isEnableConsSync" label="耗材同步" width="120"> <el-table-column prop="isEnableConsSync" label="耗材同步" width="120">
<template v-slot="scope"> <template v-slot="scope">
<el-tag :type="scope.row.isEnableConsSync == 1 ? 'success' : 'error'" effect="dark"> {{ scope.row.isEnableConsSync == 1 ? '启用' : '禁用' }} </el-tag> <el-tag :type="scope.row.isEnableConsSync == 1 ? 'success' : 'error'" effect="dark"> {{
scope.row.isEnableConsSync == 1 ? '启用' : '禁用' }} </el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="isAllowAccountLogin" label="账号状态" width="120"> <el-table-column prop="isAllowAccountLogin" label="账号状态" width="120">
<template v-slot="scope"> <template v-slot="scope">
<el-tag :type="scope.row.isAllowAccountLogin == 1 ? 'success' : 'error'" effect="dark"> {{ scope.row.isAllowAccountLogin == 1 ? '启用' : '禁用' }} </el-tag> <el-tag :type="scope.row.isAllowAccountLogin == 1 ? 'success' : 'error'" effect="dark"> {{
scope.row.isAllowAccountLogin == 1 ? '启用' : '禁用' }} </el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="createdAt" label="备注" /> <el-table-column prop="createdAt" label="备注" />
@@ -105,7 +113,7 @@ onMounted(() => {
getTableData(); getTableData();
getDataSync() getDataSync()
}); });
async function getDataSync () { async function getDataSync() {
let res = await ShopBranchApi.getDataSync() let res = await ShopBranchApi.getDataSync()
state.par.dataSyncMethod = res state.par.dataSyncMethod = res
} }

View File

@@ -21,10 +21,8 @@
<el-table-column label="头像"> <el-table-column label="头像">
<template v-slot="scope"> <template v-slot="scope">
<div class="shop_info"> <div class="shop_info">
<el-image <el-image :src="scope.row.avatar"
:src="scope.row.avatar" style="width: 50px; height: 50px; border-radius: 4px; background-color: #efefef">
style="width: 50px; height: 50px; border-radius: 4px; background-color: #efefef"
>
<template #error> <template #error>
<div class="img_error"> <div class="img_error">
<i class="icon el-icon-document-delete"></i> <i class="icon el-icon-document-delete"></i>
@@ -35,12 +33,10 @@
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="昵称" prop="nickname"></el-table-column> <el-table-column label="昵称" prop="nickname"></el-table-column>
<el-table-column label="描述提示" prop="content"></el-table-column>
<el-table-column label="订阅类型"> <el-table-column label="订阅类型">
<template v-slot="scope"> <template v-slot="scope">
<el-checkbox-group <el-checkbox-group :model-value="scope.row.typeInfo" @change="typeInfoChange($event, scope.row)">
:model-value="scope.row.typeInfo"
@change="typeInfoChange($event, scope.row)"
>
<el-checkbox label="耗材推送" value="con"></el-checkbox> <el-checkbox label="耗材推送" value="con"></el-checkbox>
<el-checkbox label="商品推送" value="pro"></el-checkbox> <el-checkbox label="商品推送" value="pro"></el-checkbox>
<el-checkbox label="操作预警" value="ope"></el-checkbox> <el-checkbox label="操作预警" value="ope"></el-checkbox>
@@ -59,14 +55,9 @@
</el-table> </el-table>
</div> </div>
<div class="head-container"> <div class="head-container">
<el-pagination <el-pagination :total="tableData.total" @size-change="handleSizeChange" :current-page="tableData.page"
:total="tableData.total" :page-size="tableData.size" @current-change="paginationChange"
@size-change="handleSizeChange" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
:current-page="tableData.page"
:page-size="tableData.size"
@current-change="paginationChange"
layout="total, sizes, prev, pager, next, jumper"
></el-pagination>
</div> </div>
</div> </div>
</template> </template>

View File

@@ -2,25 +2,15 @@
<div> <div>
<el-form ref="form" :model="form" label-width="120px" label-position="left"> <el-form ref="form" :model="form" label-width="120px" label-position="left">
<el-form-item label="操作密码"> <el-form-item label="操作密码">
<el-input <el-input v-model="form.password" type="number" @input="jiantingshuru" :disabled="disabled"
v-model="form.password" :placeholder="disabled ? '******' : '请输入操作密码'" style="width: 200px"></el-input>
type="number"
@input="jiantingshuru"
:disabled="disabled"
:placeholder="disabled ? '******' : '请输入操作密码'"
style="width: 200px"
></el-input>
<el-button type="primary" @click="resetting">重置</el-button> <el-button type="primary" @click="resetting">重置</el-button>
</el-form-item> </el-form-item>
<el-form-item label="安全手机号"> <el-form-item label="安全手机号">
{{ phoneFilter(form.phone) }} {{ phoneFilter(form.phone) }}
</el-form-item> </el-form-item>
<el-form-item label="验证码"> <el-form-item label="验证码">
<el-input <el-input v-model="form.prepareAmount" placeholder="点击发送" style="width: 200px"></el-input>
v-model="form.prepareAmount"
placeholder="点击发送"
style="width: 200px"
></el-input>
<el-button type="primary" @click="onSubmit">发送</el-button> <el-button type="primary" @click="onSubmit">发送</el-button>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
@@ -31,8 +21,8 @@
<el-form ref="form" :model="form" label-width="120px" label-position="left"> <el-form ref="form" :model="form" label-width="120px" label-position="left">
<el-form-item label="校验安全密码"> <el-form-item label="校验安全密码">
<el-checkbox v-model="form.isReturnPwd">退款</el-checkbox> <el-checkbox v-model="form.isReturnPwd">退款</el-checkbox>
<el-checkbox v-model="form.isMemberInPwd">会员充值</el-checkbox> <el-checkbox v-model="form.isMemberInPwd">余额充值</el-checkbox>
<el-checkbox v-model="form.isMemberReturnPwd">会员退款</el-checkbox> <el-checkbox v-model="form.isMemberReturnPwd">余额退款</el-checkbox>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" @click="submitHandles">保存</el-button> <el-button type="primary" @click="submitHandles">保存</el-button>

View File

@@ -1,7 +1,7 @@
<template> <template>
<div> <el-form ref="form" :model="form" :rules="rules" label-width="160px" label-position="left">
<div> <el-tabs v-model="activeName">
<el-form ref="form" :model="form" :rules="rules" label-width="160px" label-position="left"> <el-tab-pane label="基础设置" name="first">
<el-form-item label="门店名称" prop="shopName"> <el-form-item label="门店名称" prop="shopName">
<el-input v-model.trim="form.shopName" placeholder="请输入门店名称" style="width: 500px"></el-input> <el-input v-model.trim="form.shopName" placeholder="请输入门店名称" style="width: 500px"></el-input>
</el-form-item> </el-form-item>
@@ -46,6 +46,36 @@
</el-button> </el-button>
</div> </div>
</el-form-item> --> </el-form-item> -->
<el-form-item label="联系电话" prop="phone">
<el-input v-model.trim="form.phone" placeholder="请输入联系电话" style="width: 500px"></el-input>
</el-form-item>
<el-form-item label="店铺简介">
<el-input type="textarea" v-model.trim="form.detail" placeholder="请输入店铺简介" style="width: 500px"></el-input>
</el-form-item>
<el-form-item label="店铺经度" prop="provinces">
<el-row :gutter="6">
<el-col :span="9" v-if="form.provinces">
<el-input :value="`${form.provinces}-${form.cities}-${form.districts}`" disabled />
</el-col>
<el-col :span="4" v-if="form.lng">
<el-input v-model="form.lng" placeholder="经度" disabled></el-input>
</el-col>
<el-col :span="4" v-if="form.lng">
<el-input v-model="form.lat" placeholder="纬度" disabled></el-input>
</el-col>
<el-col :span="4">
<el-button type="primary" plain icon="place" @click="chooseAddressShow">
选择坐标
</el-button>
</el-col>
</el-row>
<div style="color: #999">准确的定位便于用户导航到店铺</div>
</el-form-item>
<el-form-item label="门店详细地址">
<el-input type="textarea" v-model.trim="form.address" placeholder="请输入门店详细地址" style="width: 500px"></el-input>
</el-form-item>
</el-tab-pane>
<el-tab-pane label="经营设置" name="third">
<el-form-item label="经营模式「单选」"> <el-form-item label="经营模式「单选」">
<el-radio-group v-model="form.registerType"> <el-radio-group v-model="form.registerType">
<el-radio value="before">快餐版先支付后下单</el-radio> <el-radio value="before">快餐版先支付后下单</el-radio>
@@ -75,41 +105,19 @@
<el-radio label="跟随单商品" :value="2"></el-radio> <el-radio label="跟随单商品" :value="2"></el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="后厨单菜二维码">
<el-switch v-model="form.isKitchenCode" :active-value="1" :inactive-value="0"></el-switch>
</el-form-item>
<!-- <el-form-item label="积分群体"> <!-- <el-form-item label="积分群体">
<el-radio-group v-model="form.consumeColony"> <el-radio-group v-model="form.consumeColony">
<el-radio label="all">所有</el-radio> <el-radio label="all">所有</el-radio>
<el-radio label="vip">仅针对会员</el-radio> <el-radio label="vip">仅针对会员</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> --> </el-form-item> -->
<el-form-item label="联系电话" prop="phone">
<el-input v-model.trim="form.phone" placeholder="请输入联系电话" style="width: 500px"></el-input>
</el-form-item>
<!-- <el-form-item label="外卖起送金额"> <!-- <el-form-item label="外卖起送金额">
<el-input-number v-model="form.takeaway_money" placeholder="0.00" controls-position="right" <el-input-number v-model="form.takeaway_money" placeholder="0.00" controls-position="right"
:min="0"></el-input-number> :min="0"></el-input-number>
</el-form-item> --> </el-form-item> -->
<el-form-item label="店铺经度" prop="provinces">
<el-row :gutter="6">
<el-col :span="9" v-if="form.provinces">
<el-input :value="`${form.provinces}-${form.cities}-${form.districts}`" disabled />
</el-col>
<el-col :span="4" v-if="form.lng">
<el-input v-model="form.lng" placeholder="经度" disabled></el-input>
</el-col>
<el-col :span="4" v-if="form.lng">
<el-input v-model="form.lat" placeholder="纬度" disabled></el-input>
</el-col>
<el-col :span="4">
<el-button type="primary" plain icon="place" @click="chooseAddressShow">
选择坐标
</el-button>
</el-col>
</el-row>
<div style="color: #999">准确的定位便于用户导航到店铺</div>
</el-form-item>
<el-form-item label="门店详细地址">
<el-input type="textarea" v-model.trim="form.address" placeholder="请输入门店详细地址" style="width: 500px"></el-input>
</el-form-item>
<el-form-item label="营业时间"> <el-form-item label="营业时间">
<div class="u-flex gap-2" style="width: 50%"> <div class="u-flex gap-2" style="width: 50%">
<el-select v-model="form.businessStartDay" placeholder="周几开始"> <el-select v-model="form.businessStartDay" placeholder="周几开始">
@@ -164,13 +172,10 @@
> >
</el-time-picker> </el-time-picker>
</el-form-item> --> </el-form-item> -->
<el-form-item label="店铺简介"> <!-- <el-form-item label="台桌预订短信">
<el-input type="textarea" v-model.trim="form.detail" placeholder="请输入店铺简介" style="width: 500px"></el-input>
</el-form-item>
<el-form-item label="台桌预订短信">
<el-input type="textarea" v-model.trim="form.bookingSms" placeholder="请输入台桌预订短信" <el-input type="textarea" v-model.trim="form.bookingSms" placeholder="请输入台桌预订短信"
style="width: 500px"></el-input> style="width: 500px"></el-input>
</el-form-item> </el-form-item> -->
<el-form-item label="电子围栏" prop="isOrderFence"> <el-form-item label="电子围栏" prop="isOrderFence">
<div class="column"> <div class="column">
<div class="center" style="display: flex; align-items: center; gap: 14px"> <div class="center" style="display: flex; align-items: center; gap: 14px">
@@ -217,32 +222,32 @@
<el-radio :value="2">休息中</el-radio> <el-radio :value="2">休息中</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item> </el-tab-pane>
<el-button type="primary" @click="submitHandle" :loading="formLoading"> <el-form-item>
<span v-if="!formLoading">保存</span> <el-button type="primary" @click="submitHandle" :loading="formLoading">
<span v-else>保存中...</span> <span v-if="!formLoading">保存</span>
</el-button> <span v-else>保存中...</span>
</el-form-item> </el-button>
</el-form> </el-form-item>
</div> </el-tabs>
<ChooseAddress ref="refChooseAddress" @choose="chooseAddressConfirm"></ChooseAddress> </el-form>
<el-dialog v-model="showUpload" :close-on-click-modal="false" append-to-body width="500px" <ChooseAddress ref="refChooseAddress" @choose="chooseAddressConfirm"></ChooseAddress>
@close="showUpload = false"> <el-dialog v-model="showUpload" :close-on-click-modal="false" append-to-body width="500px"
<el-upload :before-remove="handleBeforeRemove" :on-success="handleSuccess" :on-error="handleError" @close="showUpload = false">
:file-list="fileList" :headers="headers" :action="qiNiuUploadApi" :limit="1" list-type="picture" <el-upload :before-remove="handleBeforeRemove" :on-success="handleSuccess" :on-error="handleError"
class="upload-demo"> :file-list="fileList" :headers="headers" :action="qiNiuUploadApi" :limit="1" list-type="picture"
<el-button size="small" type="primary">点击上传</el-button> class="upload-demo">
<template #tip> <el-button size="small" type="primary">点击上传</el-button>
<div style="display: block" class="el-upload__tip">请勿上传违法文件且文件不超过15M</div> <template #tip>
</template> <div style="display: block" class="el-upload__tip">请勿上传违法文件且文件不超过15M</div>
</el-upload>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="doSubmit">确认</el-button>
</div>
</template> </template>
</el-dialog> </el-upload>
</div> <template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="doSubmit">确认</el-button>
</div>
</template>
</el-dialog>
</template> </template>
<script> <script>
@@ -256,6 +261,7 @@ import { filterNumberInput } from "@/utils/index";
export default { export default {
data() { data() {
return { return {
activeName: "first",
filterNumberInput, filterNumberInput,
img_download_error, img_download_error,
showUpload: false, showUpload: false,

View File

@@ -1,9 +1,10 @@
<template> <template>
<el-dialog title="激活" width="500px" v-model="show" @close="reset"> <el-dialog title="激活" width="550px" v-model="show" @close="reset">
<el-form :model="form" ref="refForm" :rules="rules"> <el-form :model="form" ref="refForm" :rules="rules">
<el-form-item label="激活" prop="activateCode"> <el-form-item label="激活时长" prop="activateDuration">
<el-input v-model="form.activateCode" placeholder="请输入激活码"></el-input> <activeDate v-model="form.activateDuration" v-model:activeCost="form.activateAmount" />
<div class="tips">输入有效激活码表示添加的同时直接激活该店铺</div> <!-- <el-input v-model="form.activateDuration" placeholder="请输入激活码"></el-input>
<div class="tips">输入有效激活码表示添加的同时直接激活该店铺</div> -->
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer> <template #footer>
@@ -15,18 +16,20 @@
<script setup> <script setup>
import ShopApi from "@/api/account/shop"; import ShopApi from "@/api/account/shop";
import activeDate from "./activeDate.vue";
const show = ref(false); const show = ref(false);
const form = reactive({ const form = reactive({
activateCode: "", activateDuration: "",
activateAmount: '',
id: "", id: "",
}); });
const rules = { const rules = {
activateCode: [{ required: true, message: "请输入激活码", trigger: "blur" }], activateDuration: [{ required: true, message: "请选择激活时长", trigger: "blur" }],
}; };
function reset() { function reset() {
form.activateCode = ""; form.activateDuration = "";
form.id = ""; form.id = "";
} }
const emit = defineEmits(["submit"]); const emit = defineEmits(["submit"]);

View File

@@ -0,0 +1,32 @@
<template>
<el-select v-model="modelValue" style="width: 200px;" placeholder="请选择激活时长">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
<el-input v-model="activeCost" placeholder="请输入激活费用(选填)" style="width: 200px; margin-left: 14px;" />
</template>
<script setup>
import { ref, onMounted } from "vue";
const modelValue = defineModel({
type: [String, Number],
default: "",
});
// 激活费用
const activeCost = defineModel('activeCost', {
type: String,
default: "",
})
const options = ref([])
onMounted(() => {
for (let i = 1; i <= 12; i++) {
options.value.push({
label: `${i}个月`,
value: i,
});
}
})
</script>

View File

@@ -0,0 +1,61 @@
<template>
<!-- 激活记录 -->
<el-dialog v-model="show" title="激活记录" width="500px">
<el-table :data="tableData.records" style="width: 100%">
<el-table-column prop="periodMonth" label="激活时长(月)"></el-table-column>
<el-table-column prop="amount" label="店铺签约金额">
<template v-slot="scope">
{{ formatMoney(scope.row.amount) }}
</template>
</el-table-column>
<el-table-column prop="createTime" label="操作时间"></el-table-column>
</el-table>
<el-pagination v-model:current-page="tableData.page" v-model:page-size="tableData.size"
:page-sizes="[10, 20, 50, 100]" :total="tableData.total" @current-change="getData" @size-change="getData"
style="margin-top: 16px; text-align: right;" />
</el-dialog>
</template>
<script setup>
import { ref, reactive } from "vue";
import ShopApi from "@/api/account/shop";
import { formatMoney } from "@/utils";
const shopInfo = ref({ id: '' })
const show = ref(false);
const tableData = reactive({
loading: false,
page: 1,
size: 10,
total: 0,
records: [],
});
async function getData() {
try {
tableData.loading = true;
const res = await ShopApi.registerRecord({
page: tableData.page,
size: tableData.size,
shopId: shopInfo.value.id
});
tableData.records = res.records;
tableData.total = res.totalRow;
} catch (error) {
console.log(error);
} finally {
tableData.loading = false;
}
}
function open(data) {
shopInfo.value = data;
show.value = true;
getData();
}
defineExpose({
open,
});
</script>

View File

@@ -1,72 +1,35 @@
<template> <template>
<div> <div>
<el-dialog <el-dialog :title="state.form.id ? '编辑店铺' : '添加店铺'" v-model="state.dialogVisible" @close="reset">
:title="state.form.id ? '编辑店铺' : '添加店铺'"
v-model="state.dialogVisible"
@close="reset"
>
<div style="height: 50vh; overflow-y: auto"> <div style="height: 50vh; overflow-y: auto">
<el-form <el-form ref="refForm" :model="state.form" :rules="state.rules" label-width="120px" label-position="left">
ref="refForm"
:model="state.form"
:rules="state.rules"
label-width="120px"
label-position="left"
>
<el-form-item label="店铺名称" prop="shopName"> <el-form-item label="店铺名称" prop="shopName">
<el-input v-model="state.form.shopName" placeholder="请输入门店名称"></el-input> <el-input v-model="state.form.shopName" placeholder="请输入门店名称"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="店铺类型"> <el-form-item label="店铺类型">
<el-radio-group <el-radio-group v-model="state.form.shopType" :disabled="state.isEdit || state.type == 'addBranch'">
v-model="state.form.shopType"
:disabled="state.isEdit || state.type == 'addBranch'"
>
<el-radio-button value="only">单店</el-radio-button> <el-radio-button value="only">单店</el-radio-button>
<el-radio-button value="chain">连锁店</el-radio-button> <el-radio-button value="chain">连锁店</el-radio-button>
<el-radio-button value="join">加盟店</el-radio-button> <el-radio-button value="join">加盟店</el-radio-button>
</el-radio-group> </el-radio-group>
<div class="tips"> <div class="tips">
<el-alert <el-alert title="请谨慎修改" type="warning" size="7" effect="dark" show-icon :closable="false" />
title="请谨慎修改"
type="warning"
size="7"
effect="dark"
show-icon
:closable="false"
/>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="是否为主店" prop="isHeadShop" v-if="state.form.shopType != 'only'"> <el-form-item label="是否为主店" prop="isHeadShop" v-if="state.form.shopType != 'only'">
<el-radio-group <el-radio-group v-model="state.form.isHeadShop" @change="state.form.mainId = ''"
v-model="state.form.isHeadShop" :disabled="state.isEdit || state.type == 'addBranch'">
@change="state.form.mainId = ''"
:disabled="state.isEdit || state.type == 'addBranch'"
>
<el-radio :value="1"></el-radio> <el-radio :value="1"></el-radio>
<el-radio :value="0"></el-radio> <el-radio :value="0"></el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item <el-form-item label="选择主店" prop="mainId" v-if="state.form.isHeadShop == '0' && state.form.shopType != 'only'">
label="选择主店"
prop="mainId"
v-if="state.form.isHeadShop == '0' && state.form.shopType != 'only'"
>
<!-- <el-form-item label="主店账号" prop="mainId" v-if="state.form.shopType != 'only'"> --> <!-- <el-form-item label="主店账号" prop="mainId" v-if="state.form.shopType != 'only'"> -->
<el-select <el-select v-model="state.form.mainId" placeholder="请选择主店铺" filterable reserve-keyword
v-model="state.form.mainId" :remote-method="getTableData" :loading="state.shopListLoading"
placeholder="请选择主店铺" :disabled="state.isEdit || state.type == 'addBranch'">
filterable <el-option v-for="item in state.shopList" :label="`${item.shopName}`" :value="item.id"
reserve-keyword :key="item.id"></el-option>
:remote-method="getTableData"
:loading="state.shopListLoading"
:disabled="state.isEdit || state.type == 'addBranch'"
>
<el-option
v-for="item in state.shopList"
:label="`${item.shopName}`"
:value="item.id"
:key="item.id"
></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="连锁店扩展店名"> <el-form-item label="连锁店扩展店名">
@@ -84,14 +47,7 @@
<el-radio-button value="after">后付费</el-radio-button> <el-radio-button value="after">后付费</el-radio-button>
</el-radio-group> </el-radio-group>
<div class="tips"> <div class="tips">
<el-alert <el-alert title="请谨慎修改" type="warning" size="7" effect="dark" show-icon :closable="false" />
title="请谨慎修改"
type="warning"
size="7"
effect="dark"
show-icon
:closable="false"
/>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="管理方式" v-if="state.form.shopType != 'only'"> <el-form-item label="管理方式" v-if="state.form.shopType != 'only'">
@@ -100,14 +56,7 @@
<el-radio-button :value="1">直接管理</el-radio-button> <el-radio-button :value="1">直接管理</el-radio-button>
</el-radio-group> </el-radio-group>
<div class="tips"> <div class="tips">
<el-alert <el-alert title="请谨慎修改" type="warning" size="7" effect="dark" show-icon :closable="false" />
title="请谨慎修改"
type="warning"
size="7"
effect="dark"
show-icon
:closable="false"
/>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="商户版本"> <el-form-item label="商户版本">
@@ -116,53 +65,34 @@
<el-radio-button value="release">正式</el-radio-button> <el-radio-button value="release">正式</el-radio-button>
</el-radio-group> </el-radio-group>
<div class="tips"> <div class="tips">
<el-alert <el-alert title="请谨慎修改" type="warning" size="7" effect="dark" show-icon :closable="false" />
title="请谨慎修改"
type="warning"
size="7"
effect="dark"
show-icon
:closable="false"
/>
</div> </div>
</el-form-item> </el-form-item>
<el-form-item label="激活"> <el-form-item label="激活时长" prop="activateDuration">
<el-input v-model="state.form.activateCode" placeholder="请输入激活码"></el-input> <activeDate v-model="state.form.activateDuration" v-model:activeCost="state.form.activateAmount" />
<div class="tips">输入有效激活码表示添加的同时直接激活该店铺</div> <!-- <el-input v-model="state.form.activateDuration" placeholder="请输入激活码"></el-input>
<div class="tips">输入有效激活码表示添加的同时直接激活该店铺</div> -->
</el-form-item> </el-form-item>
<el-form-item label="登录账号" prop="accountName"> <el-form-item label="登录账号" prop="accountName">
<el-input v-model="state.form.accountName" placeholder="请输入登录账号"></el-input> <el-input v-model="state.form.accountName" placeholder="请输入登录账号"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="登录密码" prop="password" v-if="!state.form.id"> <el-form-item label="登录密码" prop="accountPwd" v-if="!state.form.id">
<el-input <el-input type="password" show-password v-model="state.form.accountPwd" placeholder="请输入登录密码"></el-input>
type="password"
show-password
v-model="state.form.accountPwd"
placeholder="请输入登录密码"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="联系电话" prop="phone"> <el-form-item label="联系电话" prop="phone">
<el-input v-model="state.form.phone" placeholder="请输入联系电话"></el-input> <el-input v-model="state.form.phone" placeholder="请输入联系电话"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="设备数量"> <el-form-item label="设备数量">
<el-input-number <el-input-number v-model="state.form.supportDeviceNumber" controls-position="right" :min="1" :step="1"
v-model="state.form.supportDeviceNumber" step-strictly></el-input-number>
controls-position="right"
:min="1"
:step="1"
step-strictly
></el-input-number>
</el-form-item> </el-form-item>
<!-- <el-form-item label="外卖起送金额"> <!-- <el-form-item label="外卖起送金额">
<el-input-number v-model="form.takeaway_money" placeholder="0.00" controls-position="right" <el-input-number v-model="form.takeaway_money" placeholder="0.00" controls-position="right"
:min="0"></el-input-number> :min="0"></el-input-number>
</el-form-item> --> </el-form-item> -->
<el-form-item label="店铺地址" prop="districts"> <el-form-item label="店铺地址" prop="districts">
<AddressSelect <AddressSelect v-model:prov="state.form.provinces" v-model:city="state.form.cities"
v-model:prov="state.form.provinces" v-model:area="state.form.districts"></AddressSelect>
v-model:city="state.form.cities"
v-model:area="state.form.districts"
></AddressSelect>
</el-form-item> </el-form-item>
<div> <div>
@@ -204,18 +134,10 @@
</el-row> </el-row>
</el-form-item> --> </el-form-item> -->
<el-form-item label="店铺详细地址"> <el-form-item label="店铺详细地址">
<el-input <el-input type="textarea" v-model="state.form.address" placeholder="请输入门店详细地址"></el-input>
type="textarea"
v-model="state.form.address"
placeholder="请输入门店详细地址"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="店铺简介"> <el-form-item label="店铺简介">
<el-input <el-input type="textarea" v-model="state.form.detail" placeholder="请输入店铺简介"></el-input>
type="textarea"
v-model="state.form.detail"
placeholder="请输入店铺简介"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="状态"> <el-form-item label="状态">
<el-radio-group v-model="state.form.status"> <el-radio-group v-model="state.form.status">
@@ -225,12 +147,7 @@
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
<el-dialog <el-dialog title="选择地址" v-model="state.showLocation" :modal="false" :modal-append-to-body="false">
title="选择地址"
v-model="state.showLocation"
:modal="false"
:modal-append-to-body="false"
>
<div class="map_box"> <div class="map_box">
<div class="map"> <div class="map">
<el-amap ref="map" :center="state.amapOptions.center" @init="mapInit"> <el-amap ref="map" :center="state.amapOptions.center" @init="mapInit">
@@ -238,13 +155,8 @@
</el-amap> </el-amap>
</div> </div>
<div class="search_box"> <div class="search_box">
<el-input <el-input v-model="state.searchOption.keyword" placeholder="请输入关键字" @focus="state.searchOption.focus = true"
v-model="state.searchOption.keyword" @blur="autoCompleteSearchBlur" @input="autoCompleteSearch(state.searchOption.keyword)">
placeholder="请输入关键字"
@focus="state.searchOption.focus = true"
@blur="autoCompleteSearchBlur"
@input="autoCompleteSearch(state.searchOption.keyword)"
>
<template #append> <template #append>
<el-button type="primary" @click="placeSearchSearch(state.searchOption.keyword)"> <el-button type="primary" @click="placeSearchSearch(state.searchOption.keyword)">
搜索 搜索
@@ -252,12 +164,8 @@
</template> </template>
</el-input> </el-input>
<div class="list" v-if="state.searchOption.focus && state.searchOption.show"> <div class="list" v-if="state.searchOption.focus && state.searchOption.show">
<div <div class="item" @click="autoCompleteListClick(item)" v-for="item in state.autoCompleteList"
class="item" :key="item.id">
@click="autoCompleteListClick(item)"
v-for="item in state.autoCompleteList"
:key="item.id"
>
{{ item.name }} {{ item.name }}
</div> </div>
</div> </div>
@@ -288,11 +196,7 @@
</template> </template>
</el-dialog> </el-dialog>
<el-dialog title="坐标搜索" v-model="latShow" width="60vw"> <el-dialog title="坐标搜索" v-model="latShow" width="60vw">
<iframe <iframe style="width: 100%; height: 60vh" src="https://lbs.baidu.com/maptool/getpoint" frameborder="0"></iframe>
style="width: 100%; height: 60vh"
src="https://lbs.baidu.com/maptool/getpoint"
frameborder="0"
></iframe>
<template #footer> <template #footer>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button @click="latShow = false">取消</el-button> <el-button @click="latShow = false">取消</el-button>
@@ -311,6 +215,7 @@ import { initMapLoad } from "@/utils/mapLoadUtil";
import { ElNotification } from "element-plus"; import { ElNotification } from "element-plus";
// { geocode, ShopApi.getList } // { geocode, ShopApi.getList }
import ShopApi from "@/api/account/shop"; import ShopApi from "@/api/account/shop";
import activeDate from "./activeDate.vue";
const latShow = ref(false); const latShow = ref(false);
const validateLogo = (rule, value, callback) => { const validateLogo = (rule, value, callback) => {
@@ -333,7 +238,7 @@ async function latConfirm() {
state.form.lat = latLng[1]; state.form.lat = latLng[1];
state.form.lng = latLng[0]; state.form.lng = latLng[0];
latShow.value = false; latShow.value = false;
} else [ElMessage.error("请搜索地址后复制经纬度")]; } else[ElMessage.error("请搜索地址后复制经纬度")];
} catch (err) { } catch (err) {
// 捕获异常(用户拒绝权限、浏览器不支持、非交互上下文等) // 捕获异常(用户拒绝权限、浏览器不支持、非交互上下文等)
console.error("获取剪贴板失败:", err); console.error("获取剪贴板失败:", err);
@@ -360,7 +265,8 @@ const state = reactive({
tubeType: 0, tubeType: 0,
registerType: "before", registerType: "before",
profiles: "release", profiles: "release",
activateCode: "", activateDuration: "", // 激活时长
activateAmount: "", // 激活费用
accountName: "", accountName: "",
accountPwd: "", accountPwd: "",
phone: "", phone: "",
@@ -381,11 +287,11 @@ const state = reactive({
type: "", type: "",
resetForm: "", resetForm: "",
rules: { rules: {
activateCode: [ activateDuration: [
{ {
required: true, required: true,
message: "请输入激活码", message: "请选择激活时长",
trigger: "blur", trigger: "change",
}, },
], ],
shopName: [ shopName: [
@@ -458,6 +364,25 @@ const state = reactive({
trigger: "change", trigger: "change",
}, },
], ],
// 密码长度6-18位需包含字母、数字、特殊符号中至少两种
accountPwd: [
{
required: true,
message: "请输入登录密码",
trigger: "blur",
},
{
min: 6,
max: 18,
message: "密码长度应为6-18位",
trigger: "blur",
},
{
pattern: /^(?![0-9]+$)(?![a-zA-Z]+$)(?![^\da-zA-Z]+$).{6,}$/,
message: "密码需包含字母、数字、特殊符号中至少两种",
trigger: "blur",
},
]
}, },
fileList: [], fileList: [],
files: [], files: [],
@@ -561,6 +486,7 @@ function show(obj, type) {
if (obj && obj.id) { if (obj && obj.id) {
console.log(obj); console.log(obj);
state.form = { ...obj }; state.form = { ...obj };
state.form.accountName = obj.account ? obj.account : "";
} }
if (obj && obj.mainId) { if (obj && obj.mainId) {
Object.assign(state.form, obj); Object.assign(state.form, obj);
@@ -730,6 +656,7 @@ defineExpose({
.amap-sug-result { .amap-sug-result {
z-index: 2000; z-index: 2000;
} }
.tips { .tips {
margin-left: 10px; margin-left: 10px;
} }

View File

@@ -1,52 +1,26 @@
<template> <template>
<div class="app-container"> <div class="app-container">
<div class="head-container"> <div class="head-container">
<el-row :gutter="20"> <el-row :gutter="24">
<el-col :span="3"> <el-col :span="4">
<el-input <el-input v-model="state.query.name" clearable placeholder="请输入店铺名称" style="width: 100%" class="filter-item"
v-model="state.query.name" @keyup.enter="getTableData" />
clearable
placeholder="请输入店铺名称"
style="width: 100%"
class="filter-item"
@keyup.enter="getTableData"
/>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="4">
<el-input <el-input v-model="state.query.phone" clearable placeholder="请输入手机号" style="width: 100%" class="filter-item"
v-model="state.query.phone" @keyup.enter="getTableData" />
clearable
placeholder="请输入手机号"
style="width: 100%"
class="filter-item"
@keyup.enter="getTableData"
/>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="4">
<el-select v-model="state.query.status" placeholder="请选择店铺状态" style="width: 100%"> <el-select v-model="state.query.status" placeholder="请选择店铺状态" style="width: 100%">
<el-option <el-option v-for="item in state.status" :key="item.type" :label="item.label" :value="item.type" />
v-for="item in state.status"
:key="item.type"
:label="item.label"
:value="item.type"
/>
</el-select> </el-select>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="4">
<el-select <el-select v-model="state.query.profiles" placeholder="请选择商户版本" style="width: 100%">
v-model="state.query.profiles" <el-option v-for="item in state.profiles" :key="item.type" :label="item.label" :value="item.type" />
placeholder="请选择商户版本"
style="width: 100%"
>
<el-option
v-for="item in state.profiles"
:key="item.type"
:label="item.label"
:value="item.type"
/>
</el-select> </el-select>
</el-col> </el-col>
<el-col :span="3"> <el-col :span="4">
<el-button type="primary" @click="getTableData">查询</el-button> <el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button> <el-button @click="resetHandle">重置</el-button>
</el-col> </el-col>
@@ -60,10 +34,8 @@
<el-table-column label="店铺信息" width="200"> <el-table-column label="店铺信息" width="200">
<template v-slot="scope"> <template v-slot="scope">
<div class="shop_info"> <div class="shop_info">
<el-image <el-image :src="scope.row.logo"
:src="scope.row.logo" style="width: 50px; height: 50px; border-radius: 4px; background-color: #efefef">
style="width: 50px; height: 50px; border-radius: 4px; background-color: #efefef"
>
<template #error> <template #error>
<div class="img_error"> <div class="img_error">
<i class="icon el-icon-document-delete" /> <i class="icon el-icon-document-delete" />
@@ -73,16 +45,16 @@
<div class="info"> <div class="info">
<span>{{ scope.row.shopName }}</span> <span>{{ scope.row.shopName }}</span>
<div class="tag_wrap"> <div class="tag_wrap">
<el-tag v-if="scope.row.profiles == 'no'" type="info" effect="dark"> <el-tag v-if="scope.row.profiles == 'no'" type="info" disable-transitions effect="dark">
未激活 未激活
</el-tag> </el-tag>
<el-tag v-if="scope.row.profiles == 'probation'" type="warning" effect="dark"> <el-tag v-if="scope.row.profiles == 'probation'" type="warning" disable-transitions effect="dark">
试用 试用
</el-tag> </el-tag>
<el-tag v-if="scope.row.profiles == 'release'" type="success" effect="dark"> <el-tag v-if="scope.row.profiles == 'release'" type="success" disable-transitions effect="dark">
正式 正式
</el-tag> </el-tag>
<el-tag v-if="scope.row.isWxMaIndependent" type="primary" effect="dark"> <el-tag v-if="scope.row.isWxMaIndependent" type="primary" disable-transitions effect="dark">
独立小程序 独立小程序
</el-tag> </el-tag>
</div> </div>
@@ -154,7 +126,7 @@
支付配置 支付配置
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item :command="2">续费记录</el-dropdown-item> <el-dropdown-item :command="2">续费记录</el-dropdown-item>
<el-dropdown-item :command="3">前往店铺</el-dropdown-item> <!-- <el-dropdown-item :command="3">前往店铺</el-dropdown-item> -->
<el-dropdown-item :command="4">重置密码</el-dropdown-item> <el-dropdown-item :command="4">重置密码</el-dropdown-item>
<el-dropdown-item divided :command="5">删除</el-dropdown-item> <el-dropdown-item divided :command="5">删除</el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
@@ -165,19 +137,18 @@
</el-table> </el-table>
</div> </div>
<div class="head-container"> <div class="head-container">
<el-pagination <el-pagination v-model:current-page="state.tableData.page" v-model:page-size="state.tableData.size"
v-model:current-page="state.tableData.page" :total="state.tableData.total" :page-sizes="[10, 20, 30, 50, 100]"
v-model:page-size="state.tableData.size" layout="total, sizes , prev, pager ,next, jumper " @current-change="paginationChange" />
:total="state.tableData.total"
:page-sizes="[10, 20, 30, 50, 100]"
layout="total, sizes , prev, pager ,next, jumper "
@current-change="paginationChange"
/>
</div> </div>
<addShop ref="refAddShop" @success="getTableData" /> <addShop ref="refAddShop" @success="getTableData" />
<!-- <detailModal ref="refDetailModal" /> --> <!-- <detailModal ref="refDetailModal" /> -->
<!-- 激活码 --> <!-- 激活码 -->
<activateCode ref="refActivateCode" @success="getTableData" /> <activateCode ref="refActivateCode" @success="getTableData" />
<!-- 重置密码 -->
<resetPassword ref="refResetPasswordRef" @success="getTableData" />
<!-- 激活记录 -->
<activateRecord ref="refActivateRecordRef" />
</div> </div>
</template> </template>
@@ -189,6 +160,12 @@ import { ElNotification, ElMessageBox } from "element-plus";
import addShop from "./components/addShop.vue"; import addShop from "./components/addShop.vue";
import detailModal from "./components/detailModal.vue"; import detailModal from "./components/detailModal.vue";
import { useRouter } from "vue-router"; import { useRouter } from "vue-router";
import resetPassword from "@/components/resetPassword/index.vue";
import activateRecord from "./components/activeteRecord.vue";
const refActivateRecordRef = ref(null);
const refResetPasswordRef = ref(null);
const router = useRouter(); const router = useRouter();
@@ -242,7 +219,7 @@ onMounted(() => {
const refDetailModal = ref(null); const refDetailModal = ref(null);
function dropdownClick(e, row) { function dropdownClick(e, row) {
console.log(e); console.log(e);
console.log(row); // console.log(row);
if (e == 0) { if (e == 0) {
refAddShop.value.show({ mainId: row.id, shopType: row.shopType, isHeadShop: 0 }, "addBranch"); refAddShop.value.show({ mainId: row.id, shopType: row.shopType, isHeadShop: 0 }, "addBranch");
@@ -264,6 +241,15 @@ function dropdownClick(e, row) {
}); });
return; return;
} }
if (e == 2) {
// 续费记录
refActivateRecordRef.value.open(row);
}
if (e == 4) {
// 重置密码
// console.log('重置密码', row);
refResetPasswordRef.value.show(row);
}
if (e == 5) { if (e == 5) {
ElMessageBox.confirm("是否确认删除该店铺?", "提示", { ElMessageBox.confirm("是否确认删除该店铺?", "提示", {
confirmButtonText: "确认", confirmButtonText: "确认",
@@ -278,7 +264,7 @@ function dropdownClick(e, row) {
}); });
getTableData(); getTableData();
}) })
.catch(() => {}); .catch(() => { });
return; return;
} }
} }

View File

@@ -11,12 +11,12 @@
<div class="t">{{ route.query.shopName }} | 支付配置</div> <div class="t">{{ route.query.shopName }} | 支付配置</div>
<div class="intro">管理您的支付渠道和进件信息</div> <div class="intro">管理您的支付渠道和进件信息</div>
</div> </div>
<div class="center"> <!-- <div class="center">
<el-text size="large">当前模式</el-text> <el-text size="large">当前模式</el-text>
<el-radio-group size="large" :model-value="payModel" @change="handleRadioChange"> <el-radio-group size="large" :model-value="payModel" @change="handleRadioChange">
<el-radio :label="item.label" :value="item.value" v-for="item in tabList" :key="item.value"></el-radio> <el-radio :label="item.label" :value="item.value" v-for="item in tabList" :key="item.value"></el-radio>
</el-radio-group> </el-radio-group>
</div> </div> -->
</div> </div>
<div class="gyq_content row mt14"> <div class="gyq_content row mt14">
<tabHeader v-model="tabActiveIndex" :list="tabList" /> <tabHeader v-model="tabActiveIndex" :list="tabList" />
@@ -39,10 +39,10 @@ const router = useRouter()
const payModel = ref('') const payModel = ref('')
const tabActiveIndex = ref(0) const tabActiveIndex = ref(0)
const tabList = ref([ const tabList = ref([
{ // {
label: '支付进件', // label: '支付进件',
value: 'native' // value: 'native'
}, // },
{ {
label: '聚合支付', label: '聚合支付',
value: 'poly' value: 'poly'

View File

@@ -39,6 +39,11 @@ const contentConfig: IContentConfig = {
align: "center", align: "center",
prop: "code", prop: "code",
}, },
{
label: "员工角色",
align: "center",
prop: "roleName",
},
{ {
label: "最大优惠金额", label: "最大优惠金额",
align: "center", align: "center",
@@ -55,6 +60,7 @@ const contentConfig: IContentConfig = {
label: "操作", label: "操作",
align: "center", align: "center",
templet: "tool", templet: "tool",
width: 240,
operat: ["edit", "delete", operat: ["edit", "delete",
{ {
name: "change_pwd", name: "change_pwd",

View File

@@ -29,7 +29,7 @@
</template> </template>
</el-dialog> </el-dialog>
</template> </template>
<script> <script>
import { ElMessage } from "element-plus"; import { ElMessage } from "element-plus";
export default { export default {
data() { data() {
@@ -72,9 +72,9 @@ export default {
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
console.log(valid); console.log(valid);
if (this.form.discount_sale_amount * 1 <= 0 || this.form.discount_sale_amount * 1 <= 0) { // if (this.form.discount_sale_amount * 1 <= 0 || this.form.discount_sale_amount * 1 <= 0) {
return ElMessage.error("价格和数量必须大于0"); // return ElMessage.error("价格和数量必须大于0");
} // }
this.submit(); this.submit();
} else { } else {
console.log("error submit!!"); console.log("error submit!!");
@@ -83,27 +83,31 @@ export default {
}); });
}, },
}, },
mounted() {}, mounted() { },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
:deep(.el-dialog__body) { :deep(.el-dialog__body) {
margin-bottom: 14px; margin-bottom: 14px;
margin-top: 14px; margin-top: 14px;
} }
:deep(.el-form-item__label) { :deep(.el-form-item__label) {
text-align: left; text-align: left;
} }
input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button { input[type="number"]::-webkit-outer-spin-button {
-webkit-appearance: none; -webkit-appearance: none;
margin: 0; margin: 0;
} }
:deep(.el-input__inner::-webkit-inner-spin-button) { :deep(.el-input__inner::-webkit-inner-spin-button) {
-webkit-appearance: none; -webkit-appearance: none;
margin: 0; margin: 0;
} }
:deep(el-input__inner::-webkit-outer-spin-button) { :deep(el-input__inner::-webkit-outer-spin-button) {
-webkit-appearance: none; -webkit-appearance: none;
margin: 0; margin: 0;