Merge branch 'test' of https://e.coding.net/g-cphe0354/yinshoukeguanliduan/management into test
This commit is contained in:
duan
commit
7acc762d59
|
|
@ -0,0 +1,33 @@
|
|||
|
||||
import request from '@/utils/request'
|
||||
export function get(params) {
|
||||
return request({
|
||||
url: '/freeDine',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
export function add(data) {
|
||||
return request({
|
||||
url: 'api/botUser',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
|
||||
export function del(ids) {
|
||||
return request({
|
||||
url: 'api/botUser/',
|
||||
method: 'delete',
|
||||
data: ids
|
||||
})
|
||||
}
|
||||
|
||||
export function edit(data) {
|
||||
return request({
|
||||
url: '/freeDine',
|
||||
method: 'put',
|
||||
data
|
||||
})
|
||||
}
|
||||
export default { add, edit, del, get }
|
||||
|
|
@ -0,0 +1,71 @@
|
|||
import request from "@/utils/request";
|
||||
|
||||
/**
|
||||
* Pad商品版式布局列表
|
||||
* @returns
|
||||
*/
|
||||
export function layoutlist(params) {
|
||||
return request({
|
||||
url: "/api/pad/layout/list",
|
||||
method: "get",
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 新建
|
||||
* @returns
|
||||
*/
|
||||
export function productGroup(data) {
|
||||
return request({
|
||||
url: "/api/pad/productCategory",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Pad点餐列表
|
||||
* @returns
|
||||
*/
|
||||
export function productGrouppage(params) {
|
||||
return request({
|
||||
url: "/api/pad/productCategory/page",
|
||||
method: "get",
|
||||
params
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取详情
|
||||
* @returns
|
||||
*/
|
||||
export function productCategoryDetail(id) {
|
||||
return request({
|
||||
url: `/api/pad/productCategory/${id}`,
|
||||
method: "get"
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除
|
||||
* @returns
|
||||
*/
|
||||
export function productCategoryDelete(id) {
|
||||
return request({
|
||||
url: `/api/pad/productCategory/${id}`,
|
||||
method: "DELETE"
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 修改
|
||||
* @returns
|
||||
*/
|
||||
export function productGroupPut(data) {
|
||||
return request({
|
||||
url: "/api/pad/productCategory",
|
||||
method: "put",
|
||||
data
|
||||
});
|
||||
}
|
||||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<el-dialog title="选择商品" :visible.sync="dialogVisible" @open="resetHandle()">
|
||||
<el-dialog title="选择商品" top="5vh" :visible.sync="dialogVisible">
|
||||
<el-form :model="searhForm" inline>
|
||||
<el-form-item>
|
||||
<el-input v-model="searhForm.name" placeholder="商品名称"></el-input>
|
||||
|
|
@ -16,8 +16,8 @@
|
|||
</el-form-item>
|
||||
</el-form>
|
||||
<div class="head-container">
|
||||
<el-table ref="table" :data="tableData.list" v-loading="tableData.loading">
|
||||
<el-table-column type="selection" width="55" align="center"></el-table-column>
|
||||
<el-table ref="table" :data="tableData.list" height="500" v-loading="tableData.loading">
|
||||
<el-table-column type="selection" width="55" align="center" v-if="!radio"></el-table-column>
|
||||
<el-table-column label="商品信息">
|
||||
<template v-slot="scope">
|
||||
<div class="shop_info">
|
||||
|
|
@ -36,11 +36,11 @@
|
|||
</template>
|
||||
</el-table-column> <el-table-column label="是否售罄">
|
||||
<template v-slot="scope">
|
||||
{{ scope.row.isPauseSale == 1?'是':'否' }}
|
||||
{{ scope.row.isPauseSale == 1 ? '是' : '否' }}
|
||||
</template>
|
||||
</el-table-column> <el-table-column label="是否分销">
|
||||
<template v-slot="scope">
|
||||
{{ scope.row.isDistribute == 1?'是':'否' }}
|
||||
{{ scope.row.isDistribute == 1 ? '是' : '否' }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="售价">
|
||||
|
|
@ -54,12 +54,17 @@
|
|||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="分类名称" prop="categoryName"></el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template v-slot="scope">
|
||||
<el-button type="primary" @click="selectHandle(scope.row)">选择</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
|
||||
@current-change="paginationChange" @size-change="sizeChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<span slot="footer" class="dialog-footer" v-if="!radio">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" @click="confirmHandle">确 定</el-button>
|
||||
</span>
|
||||
|
|
@ -69,6 +74,13 @@
|
|||
<script>
|
||||
import { tbShopCategoryGet, tbProduct } from "@/api/shop";
|
||||
export default {
|
||||
props: {
|
||||
// 是否为单选
|
||||
radio: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
|
|
@ -88,6 +100,11 @@ export default {
|
|||
}
|
||||
},
|
||||
methods: {
|
||||
// 单选商品
|
||||
selectHandle(row) {
|
||||
this.$emit('success', [{ ...row }])
|
||||
this.close()
|
||||
},
|
||||
// 确定选商品
|
||||
confirmHandle() {
|
||||
let res = this.$refs.table.selection
|
||||
|
|
@ -154,7 +171,7 @@ export default {
|
|||
console.log(error)
|
||||
}
|
||||
},
|
||||
show(goods) {
|
||||
async show(goods, categoryId) {
|
||||
this.dialogVisible = true
|
||||
if (goods && goods.length) {
|
||||
this.goods = goods
|
||||
|
|
@ -162,8 +179,18 @@ export default {
|
|||
this.goods = []
|
||||
}
|
||||
this.resetHandle()
|
||||
this.tbShopCategoryGet()
|
||||
this.getTableData()
|
||||
|
||||
console.log(categoryId);
|
||||
|
||||
if (categoryId) {
|
||||
this.searhForm.category = categoryId
|
||||
}
|
||||
|
||||
console.log(this.searhForm);
|
||||
|
||||
|
||||
await this.tbShopCategoryGet()
|
||||
await this.getTableData()
|
||||
},
|
||||
close() {
|
||||
this.dialogVisible = false
|
||||
|
|
|
|||
|
|
@ -45,6 +45,13 @@ export default {
|
|||
opacity: 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
width: 100px;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.sidebar-logo-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
|
@ -82,6 +89,11 @@ export default {
|
|||
.sidebar-logo {
|
||||
margin-right: 0px;
|
||||
}
|
||||
|
||||
.sidebar-logo {
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -49,6 +49,11 @@
|
|||
退出登录
|
||||
</el-dropdown-item>
|
||||
</span>
|
||||
<!-- <span style="display:block;" @click="goFullScreen">
|
||||
<el-dropdown-item divided>
|
||||
全屏
|
||||
</el-dropdown-item>
|
||||
</span> -->
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</div>
|
||||
|
|
@ -248,6 +253,17 @@ export default {
|
|||
}
|
||||
})
|
||||
},
|
||||
goFullScreen() {
|
||||
if (document.documentElement.requestFullscreen) {
|
||||
document.documentElement.requestFullscreen();
|
||||
} else if (document.documentElement.mozRequestFullScreen) { /* Firefox */
|
||||
document.documentElement.mozRequestFullScreen();
|
||||
} else if (document.documentElement.webkitRequestFullscreen) { /* Chrome, Safari & Opera */
|
||||
document.documentElement.webkitRequestFullscreen();
|
||||
} else if (document.documentElement.msRequestFullscreen) { /* IE/Edge */
|
||||
document.documentElement.msRequestFullscreen();
|
||||
}
|
||||
},
|
||||
open() {
|
||||
this.$confirm('确定注销并退出系统吗？', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
|
|
|
|||
|
|
@ -0,0 +1,128 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="container">
|
||||
<el-form ref="form" :model="form" label-width="140px" label-position="left">
|
||||
<el-form-item label="功能启用">
|
||||
<el-switch v-model="form.enable"></el-switch>
|
||||
</el-form-item>
|
||||
<el-form-item label="充值设置">
|
||||
<template>
|
||||
<div class="labelbox">
|
||||
用户消费结账时，成功充值消费
|
||||
<el-input style="width: 80px;margin: 0 15px;" v-model="form.rechargeTimes"></el-input>
|
||||
倍的金额，本单即可享受免单
|
||||
</div>
|
||||
</template>
|
||||
</el-form-item>
|
||||
<el-form-item label="充值门槛">
|
||||
<template>
|
||||
<div class="labelbox">
|
||||
订单支付金额需满
|
||||
<el-input style="width: 80px;margin: 0 15px;" v-model="form.rechargeThreshold"></el-input>
|
||||
元才能使用
|
||||
</div>
|
||||
</template>
|
||||
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="适用门店">
|
||||
<el-radio-group v-model="form.resource">
|
||||
<el-radio label="全部门店"></el-radio>
|
||||
<el-radio label="指定门店"></el-radio>
|
||||
<el-radio label="仅本店使用"></el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="使用方式">
|
||||
<el-checkbox-group v-model="form.useTypeList">
|
||||
<el-checkbox label="堂食" name="dine-in" value="dine-in"></el-checkbox>
|
||||
<el-checkbox label="自取" name="takeout" value="takeout"></el-checkbox>
|
||||
<el-checkbox label="配送" name="takeaway" value="takeaway"></el-checkbox>
|
||||
<el-checkbox label="快递" name="post" value="post"></el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否与优惠券共享">
|
||||
<el-switch v-model="form.withCoupon"></el-switch>
|
||||
</el-form-item>
|
||||
<el-form-item label="是否与积分共享">
|
||||
<el-switch v-model="form.withPoints"></el-switch>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="不参与集章">
|
||||
<el-switch v-model="form.childShopIdList"></el-switch>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="充值说明">
|
||||
<el-input type="textarea" v-model="form.rechargeDesc"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="editlist">保存</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { get, edit } from "@/api/bwc";
|
||||
export default {
|
||||
name: 'bwc',
|
||||
data() {
|
||||
return {
|
||||
form: {
|
||||
id: '',
|
||||
enable: '',
|
||||
rechargeTimes: '',
|
||||
rechargeThreshold: '',
|
||||
withCoupon: '',
|
||||
withPoints: '',
|
||||
rechargeDesc: '',
|
||||
useTypeList: [],
|
||||
childShopIdList: '',
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getlist()
|
||||
},
|
||||
methods: {
|
||||
async getlist() {
|
||||
let res = await get({
|
||||
shopId: localStorage.getItem("shopId")
|
||||
})
|
||||
this.form = res
|
||||
},
|
||||
async editlist() {
|
||||
this.form.shopId = localStorage.getItem("shopId")
|
||||
let res = await edit(this.form)
|
||||
this.$message({
|
||||
message: '保存成功',
|
||||
type: 'success'
|
||||
});
|
||||
this.form = res
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.app-container {
|
||||
padding: 12px 20px;
|
||||
height: auto;
|
||||
background-color: #f4f9ff;
|
||||
|
||||
.container {
|
||||
padding: 30px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background: #FFFFFF;
|
||||
|
||||
.labelbox {
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 16px;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -114,17 +114,17 @@
|
|||
<el-table-column label="单价" prop="price"></el-table-column> -->
|
||||
<el-table-column label="商品名称" prop="name"></el-table-column>
|
||||
<el-table-column label="销量" prop="salesNum"></el-table-column>
|
||||
<el-table-column label="销售金额" prop="salesAmount">
|
||||
<template v-slot="scope">
|
||||
￥{{ scope.row.salesAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="退单量" prop="refNum"></el-table-column>
|
||||
<el-table-column label="退款金额" prop="refAmount">
|
||||
<template v-slot="scope">
|
||||
￥{{ scope.row.refAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="销售金额" prop="salesAmount">
|
||||
<template v-slot="scope">
|
||||
￥{{ scope.row.salesAmount }}
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
|
|
|
|||
|
|
@ -194,9 +194,9 @@
|
|||
<el-radio-button label="30">30天</el-radio-button>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div class="chart" ref="saleChart" v-loading="saleLoading" style="height: 400px;" v-show="lineChartType == 0">
|
||||
<div class="chart" ref="saleChart" v-loading="saleLoading" style="height: 500px;" v-show="lineChartType == 0">
|
||||
</div>
|
||||
<div class="chart" ref="payChart" v-loading="payChartLoading" style="height: 400px;"
|
||||
<div class="chart" ref="payChart" v-loading="payChartLoading" style="height: 500px;"
|
||||
v-show="lineChartType == 1">
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -220,13 +220,13 @@
|
|||
<div class="number">{{ productCount }}</div>
|
||||
<div class="product_chart_wrap" ref="productCountChart"></div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<!-- <div class="card">
|
||||
<div class="sale_data_header">
|
||||
<div class="card_title">销售金额</div>
|
||||
</div>
|
||||
<div class="number">￥{{ productSum }}</div>
|
||||
<div class="product_chart_wrap" ref="productSumChart"></div>
|
||||
</div>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="table">
|
||||
<el-table :data="saleTable" v-loading="saleTableLoading">
|
||||
|
|
@ -336,9 +336,9 @@ export default {
|
|||
if (this.productCountChart) {
|
||||
this.productCountChart.resize();
|
||||
}
|
||||
if (this.productSumChart) {
|
||||
this.productSumChart.resize();
|
||||
}
|
||||
// if (this.productSumChart) {
|
||||
// this.productSumChart.resize();
|
||||
// }
|
||||
}, 100);
|
||||
window.addEventListener("resize", this.__resizeHandler);
|
||||
// this.initCardUserChart();
|
||||
|
|
@ -679,21 +679,21 @@ export default {
|
|||
{
|
||||
name: '订单金额',
|
||||
type: "bar",
|
||||
barWidth: time.length <= 7 ? "30%" : "20%",
|
||||
barWidth: time.length <= 7 ? "50%" : "30%",
|
||||
data: data.map(item => item.orderAmount),
|
||||
},
|
||||
{
|
||||
name: '实收金额',
|
||||
type: "bar",
|
||||
barWidth: time.length <= 7 ? "30%" : "20%",
|
||||
data: data.map(item => item.actualAmount),
|
||||
},
|
||||
{
|
||||
name: '优惠金额',
|
||||
type: "bar",
|
||||
barWidth: time.length <= 7 ? "30%" : "20%",
|
||||
data: data.map(item => item.discountAmount),
|
||||
}
|
||||
// {
|
||||
// name: '实收金额',
|
||||
// type: "bar",
|
||||
// barWidth: time.length <= 7 ? "30%" : "20%",
|
||||
// data: data.map(item => item.actualAmount),
|
||||
// },
|
||||
// {
|
||||
// name: '优惠金额',
|
||||
// type: "bar",
|
||||
// barWidth: time.length <= 7 ? "30%" : "20%",
|
||||
// data: data.map(item => item.discountAmount),
|
||||
// }
|
||||
]
|
||||
});
|
||||
},
|
||||
|
|
@ -753,8 +753,8 @@ export default {
|
|||
const data = res.total.map(item => {
|
||||
return {
|
||||
orderAmount: item.orderAmount,
|
||||
actualAmount: item.actualAmount,
|
||||
discountAmount: item.discountAmount
|
||||
// actualAmount: item.actualAmount,
|
||||
// discountAmount: item.discountAmount
|
||||
}
|
||||
});
|
||||
const time = res.total.map(item => item.tradeDay);
|
||||
|
|
@ -840,7 +840,7 @@ export default {
|
|||
// 初始化销售图标
|
||||
initProduceChart(p1, p2) {
|
||||
this.productCountChart = echarts.init(this.$refs.productCountChart);
|
||||
this.productSumChart = echarts.init(this.$refs.productSumChart);
|
||||
// this.productSumChart = echarts.init(this.$refs.productSumChart);
|
||||
|
||||
this.productCountChart.setOption({
|
||||
tooltip: {
|
||||
|
|
@ -913,76 +913,76 @@ export default {
|
|||
]
|
||||
});
|
||||
|
||||
this.productSumChart.setOption({
|
||||
tooltip: {
|
||||
trigger: "axis"
|
||||
},
|
||||
grid: {
|
||||
x: 0,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 0
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
boundaryGap: false,
|
||||
type: "category",
|
||||
data: p2[0],
|
||||
show: false, // 不显示坐标轴线、坐标轴刻度线和坐标轴上的文字
|
||||
axisTick: {
|
||||
show: false // 不显示坐标轴刻度线
|
||||
},
|
||||
axisLine: {
|
||||
show: false // 不显示坐标轴线
|
||||
},
|
||||
axisLabel: {
|
||||
show: false // 不显示坐标轴上的文字
|
||||
},
|
||||
splitLine: {
|
||||
show: false // 不显示网格线
|
||||
}
|
||||
}
|
||||
],
|
||||
color: "#409eff",
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
show: false, // 不显示坐标轴线、坐标轴刻度线和坐标轴上的文字
|
||||
axisTick: {
|
||||
show: false // 不显示坐标轴刻度线
|
||||
},
|
||||
axisLine: {
|
||||
show: false // 不显示坐标轴线
|
||||
},
|
||||
axisLabel: {
|
||||
show: false // 不显示坐标轴上的文字
|
||||
},
|
||||
splitLine: {
|
||||
show: false // 不显示网格线
|
||||
}
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
data: p2[1],
|
||||
type: "line",
|
||||
symbol: "none",
|
||||
smooth: true,
|
||||
areaStyle: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#409eff" // 渐变颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#409eff" // 渐变颜色
|
||||
}
|
||||
])
|
||||
}
|
||||
}
|
||||
]
|
||||
});
|
||||
// this.productSumChart.setOption({
|
||||
// tooltip: {
|
||||
// trigger: "axis"
|
||||
// },
|
||||
// grid: {
|
||||
// x: 0,
|
||||
// y: 0,
|
||||
// x2: 0,
|
||||
// y2: 0
|
||||
// },
|
||||
// xAxis: [
|
||||
// {
|
||||
// boundaryGap: false,
|
||||
// type: "category",
|
||||
// data: p2[0],
|
||||
// show: false, // 不显示坐标轴线、坐标轴刻度线和坐标轴上的文字
|
||||
// axisTick: {
|
||||
// show: false // 不显示坐标轴刻度线
|
||||
// },
|
||||
// axisLine: {
|
||||
// show: false // 不显示坐标轴线
|
||||
// },
|
||||
// axisLabel: {
|
||||
// show: false // 不显示坐标轴上的文字
|
||||
// },
|
||||
// splitLine: {
|
||||
// show: false // 不显示网格线
|
||||
// }
|
||||
// }
|
||||
// ],
|
||||
// color: "#409eff",
|
||||
// yAxis: [
|
||||
// {
|
||||
// type: "value",
|
||||
// show: false, // 不显示坐标轴线、坐标轴刻度线和坐标轴上的文字
|
||||
// axisTick: {
|
||||
// show: false // 不显示坐标轴刻度线
|
||||
// },
|
||||
// axisLine: {
|
||||
// show: false // 不显示坐标轴线
|
||||
// },
|
||||
// axisLabel: {
|
||||
// show: false // 不显示坐标轴上的文字
|
||||
// },
|
||||
// splitLine: {
|
||||
// show: false // 不显示网格线
|
||||
// }
|
||||
// }
|
||||
// ],
|
||||
// series: [
|
||||
// {
|
||||
// data: p2[1],
|
||||
// type: "line",
|
||||
// symbol: "none",
|
||||
// smooth: true,
|
||||
// areaStyle: {
|
||||
// color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
// {
|
||||
// offset: 0,
|
||||
// color: "#409eff" // 渐变颜色
|
||||
// },
|
||||
// {
|
||||
// offset: 1,
|
||||
// color: "#409eff" // 渐变颜色
|
||||
// }
|
||||
// ])
|
||||
// }
|
||||
// }
|
||||
// ]
|
||||
// });
|
||||
},
|
||||
// 日期汇总数据
|
||||
async summaryDateGet(res) {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<el-dialog width="80%" :visible.sync="dialogVisible" :show-close="false" @close="reset">
|
||||
<el-dialog top="5vh" :visible.sync="dialogVisible" :show-close="false" @close="reset">
|
||||
<div class="header_wrap">
|
||||
<div class="title">耗材信息</div>
|
||||
<div class="btn_wrap">
|
||||
|
|
@ -23,8 +23,7 @@
|
|||
<template v-slot="scope">
|
||||
<el-select v-model="scope.row.conInfoId" filterable remote reserve-keyword placeholder="请输入关键词"
|
||||
:remote-method="remoteMethod" :loading="loading" @change="selectionChange($event, scope.row)">
|
||||
<el-option v-for="item in options" :key="item.id" :label="item.conName"
|
||||
:value="item.id">
|
||||
<el-option v-for="item in options" :key="item.id" :label="item.conName" :value="item.id">
|
||||
</el-option>
|
||||
</el-select>
|
||||
<div class="tips" v-if="scope.row.stockNumber">库存：{{ scope.row.stockNumber }}</div>
|
||||
|
|
@ -41,13 +40,15 @@
|
|||
<el-input-number v-model="scope.row.surplusStock" :min="0" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<el-table-column label="操作" width="100">
|
||||
<template v-slot="scope">
|
||||
<div class="table_btn_wrap">
|
||||
<div class="btn sub" v-if="scope.$index > 0" @click="tableData.cons.splice(scope.$index, 1)">
|
||||
<div class="btn sub" v-if="tableData.cons.length > 1"
|
||||
@click="tableData.cons.splice(scope.$index, 1)">
|
||||
<i class="el-icon-remove-outline"></i>
|
||||
</div>
|
||||
<div class="btn add" @click="createItem(scope.row)">
|
||||
<div class="btn add" v-if="scope.$index == tableData.cons.length - 1"
|
||||
@click="createItem(scope.row)">
|
||||
<i class="el-icon-circle-plus-outline"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -86,18 +87,20 @@
|
|||
<el-table-column label="消耗量">
|
||||
<template v-slot="scope">
|
||||
<div class="sku_table_item" v-for="(item, index) in scope.row.consList" :key="index">
|
||||
<el-input-number v-model="item.surplusStock" :min="0" />
|
||||
<el-input-number v-model="item.surplusStock" :min="1" />
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<el-table-column label="操作" width="100">
|
||||
<template v-slot="scope">
|
||||
<div class="sku_table_item" v-for="(item, index) in scope.row.consList" :key="index">
|
||||
<div class="table_btn_wrap t">
|
||||
<div class="btn sub" v-if="index > 0" @click="scope.row.consList.splice(index, 1)">
|
||||
<div class="btn sub" v-if="scope.row.consList.length > 1"
|
||||
@click="scope.row.consList.splice(index, 1)">
|
||||
<i class="el-icon-remove-outline"></i>
|
||||
</div>
|
||||
<div class="btn add" @click="skuCreateItem(scope.$index)">
|
||||
<div class="btn add" v-if="index == scope.row.consList.length - 1"
|
||||
@click="skuCreateItem(scope.$index)">
|
||||
<i class="el-icon-circle-plus-outline"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -247,7 +250,7 @@ export default {
|
|||
item.conInfoId = ''
|
||||
item.name = ''
|
||||
item.conUnit = ''
|
||||
item.surplusStock = 0
|
||||
item.surplusStock = 1
|
||||
item.status = 1
|
||||
this.tableData.cons.push(item)
|
||||
} else {
|
||||
|
|
@ -278,7 +281,7 @@ export default {
|
|||
item.conInfoId = ''
|
||||
item.name = ''
|
||||
item.conUnit = ''
|
||||
item.surplusStock = 0
|
||||
item.surplusStock = 1
|
||||
item.status = 1
|
||||
this.tableData.cons.push(item)
|
||||
}
|
||||
|
|
@ -295,7 +298,7 @@ export default {
|
|||
item.conInfoId = ''
|
||||
item.name = ''
|
||||
item.conUnit = ''
|
||||
item.surplusStock = 0
|
||||
item.surplusStock = 1
|
||||
item.status = 1
|
||||
item.specSnap = val.name
|
||||
|
||||
|
|
@ -315,13 +318,24 @@ export default {
|
|||
this.tableData.cons.map(val => {
|
||||
this.goodsDetail.conInfos.map(item => {
|
||||
if (item.productSkuId == val.productSkuId) {
|
||||
val.consList.unshift({
|
||||
id: item.id,
|
||||
surplusStock: item.surplusStock,
|
||||
conInfoId: item.conInfoId,
|
||||
name: item.conName,
|
||||
conUnit: item.conUnit
|
||||
})
|
||||
if (val.consList.length == 1 && val.consList[0].conInfoId == '') {
|
||||
val.consList = []
|
||||
val.consList.push({
|
||||
id: item.id,
|
||||
surplusStock: item.surplusStock,
|
||||
conInfoId: item.conInfoId,
|
||||
name: item.conName,
|
||||
conUnit: item.conUnit
|
||||
})
|
||||
} else {
|
||||
val.consList.push({
|
||||
id: item.id,
|
||||
surplusStock: item.surplusStock,
|
||||
conInfoId: item.conInfoId,
|
||||
name: item.conName,
|
||||
conUnit: item.conUnit
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
})
|
||||
|
|
@ -339,7 +353,7 @@ export default {
|
|||
item.conInfoId = ''
|
||||
item.name = ''
|
||||
item.conUnit = ''
|
||||
item.surplusStock = 0
|
||||
item.surplusStock = 1
|
||||
item.status = 1
|
||||
|
||||
this.tableData.cons.push(item)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,316 @@
|
|||
<!-- 新增pad选菜页 -->
|
||||
<template>
|
||||
<div>
|
||||
<el-dialog :title="`${preview ? '预览' : form.id ? '编辑' : '添加'}平板菜谱`" top="5vh" width="1000px"
|
||||
:visible.sync="dialogVisible" :show-close="preview">
|
||||
<div class="content" v-loading="pageLoading">
|
||||
<div class="editor_wrap" :class="[`type${typeListActive}`]">
|
||||
<template v-if="typeListActive != 6">
|
||||
<div class="btn_wrap" :class="[`div${index + 1}`]" v-for="(item, index) in form.list"
|
||||
:key="index" @click="showSelectGoods(index)">
|
||||
<div class="btn" v-if="!item.id">
|
||||
<i class="icon el-icon-plus"></i>
|
||||
</div>
|
||||
<div class="cover" v-else>
|
||||
<img class="img" :src="item.coverImg">
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div class="btn_wrap">
|
||||
<div class="btn">
|
||||
<el-button>一键生成菜单</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
<div class="tab" v-if="!preview">
|
||||
<el-radio-group v-model="typeListActive" @change="tabChange">
|
||||
<el-radio-button :label="item.id" v-for="item in typeList" :key="item.id">
|
||||
{{ item.name }}
|
||||
</el-radio-button>
|
||||
</el-radio-group>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dialog_footer" v-if="!preview">
|
||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
||||
<el-button type="primary" :loading="loading" @click="submitHandle">保 存</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<shopList ref="shopList" radio @success="selectConfirmGoods" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import shopList from '@/components/shopList/index.vue'
|
||||
import { layoutlist, productGroup, productCategoryDetail, productGroupPut } from '@/api/pad.js'
|
||||
export default {
|
||||
components: { shopList },
|
||||
props: {
|
||||
category: {
|
||||
type: [String, Number],
|
||||
default: ''
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
dialogVisible: false,
|
||||
pageLoading: false,
|
||||
loading: false,
|
||||
activeItem: 0,
|
||||
form: {
|
||||
id: '',
|
||||
list: []
|
||||
},
|
||||
typeListActive: 1,
|
||||
typeList: [],
|
||||
preview: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.layoutlist()
|
||||
},
|
||||
methods: {
|
||||
// 提交
|
||||
async submitHandle() {
|
||||
try {
|
||||
this.loading = true
|
||||
let res = null
|
||||
if (this.form.id) {
|
||||
await productGroupPut({
|
||||
id: this.form.id,
|
||||
padLayoutId: this.typeListActive,
|
||||
customName: '',
|
||||
productCategoryId: this.category || this.form.list[0].categoryId,
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
sort: 1,
|
||||
remark: '',
|
||||
productIdList: this.form.list.map(item => item.id)
|
||||
})
|
||||
} else {
|
||||
res = await productGroup({
|
||||
padLayoutId: this.typeListActive,
|
||||
customName: '',
|
||||
productCategoryId: this.category,
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
sort: 1,
|
||||
remark: '',
|
||||
productIdList: this.form.list.map(item => item.id)
|
||||
})
|
||||
}
|
||||
this.loading = false
|
||||
this.$message.success(this.form.id ? '编辑成功' : '添加成功')
|
||||
this.dialogVisible = false
|
||||
this.$emit('success')
|
||||
} catch (error) {
|
||||
this.loading = false
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
// 获取
|
||||
async layoutlist() {
|
||||
try {
|
||||
const res = await layoutlist()
|
||||
this.typeList = res
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
// 显示选择商品
|
||||
showSelectGoods(index) {
|
||||
this.activeItem = index
|
||||
this.$refs.shopList.show([], this.category)
|
||||
},
|
||||
// 确认选择商品
|
||||
selectConfirmGoods(res) {
|
||||
this.$set(this.form.list, this.activeItem, { ...res[0] })
|
||||
},
|
||||
// 切换tab
|
||||
tabChange() {
|
||||
this.form.list = []
|
||||
if (this.typeListActive != 6) {
|
||||
this.init()
|
||||
}
|
||||
},
|
||||
// 初始化
|
||||
init() {
|
||||
let num = this.typeList.find(item => item.id == this.typeListActive).maximum
|
||||
for (let i = 0; i < num; i++) {
|
||||
this.form.list.push({})
|
||||
}
|
||||
},
|
||||
// 获取详情
|
||||
async productCategoryDetail(id) {
|
||||
try {
|
||||
this.pageLoading = true
|
||||
const res = await productCategoryDetail(id)
|
||||
this.pageLoading = false
|
||||
this.typeListActive = res.padLayoutId
|
||||
this.form.id = res.id
|
||||
|
||||
this.form.list = []
|
||||
this.form.list = res.productList
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
reset() {
|
||||
this.form.id = ''
|
||||
this.form.list = []
|
||||
},
|
||||
// 显示 type=1 编辑 type=2预览
|
||||
async show(id = '', type = 1) {
|
||||
this.reset()
|
||||
this.typeListActive = 1
|
||||
this.dialogVisible = true
|
||||
this.tabChange()
|
||||
if (id) {
|
||||
await this.productCategoryDetail(id)
|
||||
}
|
||||
if (type == 2) {
|
||||
this.preview = true
|
||||
} else {
|
||||
this.preview = false
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.content {
|
||||
.editor_wrap {
|
||||
width: 100%;
|
||||
height: 560px;
|
||||
|
||||
&.type2 {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
&.type3 {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-template-rows: repeat(2, 1fr);
|
||||
grid-column-gap: 10px;
|
||||
grid-row-gap: 10px;
|
||||
|
||||
.div1 {
|
||||
grid-area: 1 / 1 / 3 / 2;
|
||||
}
|
||||
|
||||
.div2 {
|
||||
grid-area: 1 / 2 / 2 / 3;
|
||||
}
|
||||
|
||||
.div3 {
|
||||
grid-area: 2 / 2 / 3 / 3;
|
||||
}
|
||||
}
|
||||
|
||||
&.type4 {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
grid-template-rows: repeat(2, 1fr);
|
||||
grid-column-gap: 10px;
|
||||
grid-row-gap: 10px;
|
||||
|
||||
.div1 {
|
||||
grid-area: 1 / 1 / 2 / 2;
|
||||
}
|
||||
|
||||
.div2 {
|
||||
grid-area: 1 / 2 / 2 / 3;
|
||||
}
|
||||
|
||||
.div3 {
|
||||
grid-area: 2 / 1 / 3 / 2;
|
||||
}
|
||||
|
||||
.div4 {
|
||||
grid-area: 2 / 2 / 3 / 3;
|
||||
}
|
||||
}
|
||||
|
||||
&.type5 {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: repeat(2, 1fr);
|
||||
grid-column-gap: 10px;
|
||||
grid-row-gap: 10px;
|
||||
|
||||
.div1 {
|
||||
grid-area: 1 / 1 / 2 / 2;
|
||||
}
|
||||
|
||||
.div2 {
|
||||
grid-area: 1 / 2 / 2 / 3;
|
||||
}
|
||||
|
||||
.div3 {
|
||||
grid-area: 1 / 3 / 2 / 4;
|
||||
}
|
||||
|
||||
.div4 {
|
||||
grid-area: 2 / 1 / 3 / 2;
|
||||
}
|
||||
|
||||
.div5 {
|
||||
grid-area: 2 / 2 / 3 / 3;
|
||||
}
|
||||
|
||||
.div6 {
|
||||
grid-area: 2 / 3 / 3 / 4;
|
||||
}
|
||||
}
|
||||
|
||||
.btn_wrap {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
|
||||
.btn {
|
||||
height: 100%;
|
||||
border: 1px solid #DDDFE6;
|
||||
background: #F7F7FA;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
.icon {
|
||||
font-size: 40px;
|
||||
color: #DDDFE6;
|
||||
}
|
||||
}
|
||||
|
||||
.cover {
|
||||
height: 100%;
|
||||
background: #F7F7FA;
|
||||
position: relative;
|
||||
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
object-fit: cover;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.tab {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.dialog_footer {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
padding-top: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -9,29 +9,62 @@
|
|||
<el-input v-model.trim="form.chainName" placeholder="请输入连锁店扩展店名" style="width: 500px;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="门店logo">
|
||||
<el-image :src="form.logo || require('@/assets/images/upload.png')" fit="contain"
|
||||
style="width: 80px;height: 80px;" @click="
|
||||
showUpload = true;
|
||||
uploadIndex = 1;
|
||||
"></el-image>
|
||||
<div class="img_box">
|
||||
<el-image :src="form.logo || require('@/assets/images/upload.png')" fit="contain"
|
||||
style="width: 80px;height: 80px;" @click="
|
||||
showUpload = true;
|
||||
uploadIndex = 1;
|
||||
"></el-image>
|
||||
<!-- <el-button type="primary" plain v-if="form.logo" @click="downloadImgHandle(form.logo)">下载</el-button> -->
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="门店照片">
|
||||
<el-image :src="form.coverImg || require('@/assets/images/upload.png')" fit="contain"
|
||||
style="width: 80px;height: 80px;" @click="
|
||||
showUpload = true;
|
||||
uploadIndex = 2;
|
||||
"></el-image>
|
||||
<!-- <el-form-item label="门店照片">
|
||||
<div class="img_box">
|
||||
<el-image :src="form.coverImg || require('@/assets/images/upload.png')" fit="contain"
|
||||
style="width: 80px;height: 80px;" @click="
|
||||
showUpload = true;
|
||||
uploadIndex = 2;
|
||||
"></el-image>
|
||||
<el-button type="primary" plain v-if="form.coverImg"
|
||||
@click="downloadImgHandle(form.coverImg)">下载</el-button>
|
||||
</div>
|
||||
</el-form-item> -->
|
||||
<el-form-item label="门店收款码">
|
||||
<div class="img_box">
|
||||
<canvas ref="canvas" id="QRCode_header" style="width: 80px;height: 80px;"></canvas>
|
||||
<el-button size="mini" plain v-if="form.paymentQrcode"
|
||||
@click="downloadCanvas(form.paymentQrcode)">下载</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="微信二维码">
|
||||
<el-image :src="form.shopQrcode || require('@/assets/images/upload.png')" fit="contain"
|
||||
style="width: 80px;height: 80px;" @click="
|
||||
showUpload = true;
|
||||
uploadIndex = 3;
|
||||
"></el-image>
|
||||
<div class="img_box">
|
||||
<el-image :src="form.shopQrcode || require('@/assets/images/upload.png')" fit="contain"
|
||||
style="width: 80px;height: 80px;" @click="
|
||||
showUpload = true;
|
||||
uploadIndex = 3;
|
||||
"></el-image>
|
||||
<!-- <el-button plain v-if="form.shopQrcode" @click="downloadImgHandle(form.shopQrcode)">下载</el-button> -->
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="店铺小程序码">
|
||||
<el-image :src="form.smallQrcode || require('@/assets/images/img_download_error.png')" fit="contain"
|
||||
style="width: 80px;height: 80px;" @click="downloadImgHandle(form.smallQrcode)"></el-image>
|
||||
<div class="img_box">
|
||||
<el-image :src="form.smallQrcode || require('@/assets/images/img_download_error.png')" fit="contain"
|
||||
style="width: 80px;height: 80px;"></el-image>
|
||||
<el-button size="mini" plain v-if="form.shopQrcode"
|
||||
@click="downloadImgHandle(form.smallQrcode)">下载</el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-form-item label="经营模式「单选」">
|
||||
<el-radio-group v-model="form.registerType">
|
||||
<el-radio label="munchies">快餐版（先支付后下单）</el-radio>
|
||||
<el-radio label="restaurant">餐饮版（先下单后支付）</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="就餐模式「多选」">
|
||||
<el-checkbox-group v-model="form.eatModel">
|
||||
<el-checkbox label="dine-in">堂食自取</el-checkbox>
|
||||
<el-checkbox label="take-out">允许打包</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
<el-form-item label="联系电话" prop="phone">
|
||||
<el-input v-model.trim="form.phone" placeholder="请输入联系电话" style="width: 500px;"></el-input>
|
||||
|
|
@ -58,7 +91,8 @@
|
|||
<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-input type="textarea" v-model.trim="form.address" placeholder="请输入门店详细地址"
|
||||
style="width: 500px;"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="营业时间">
|
||||
<el-select v-model="form.businessStartDay" placeholder="周几开始">
|
||||
|
|
@ -78,7 +112,7 @@
|
|||
</el-time-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="桌位费/位/元">
|
||||
<el-input-number v-model="form.tableFee" :min="0" />
|
||||
<el-input-number :disabled="!!form.isTableFee" v-model="form.tableFee" :min="0" />
|
||||
<!-- <el-checkbox v-model="form.isTableFee" :label="1">免餐位费</el-checkbox> -->
|
||||
<el-switch v-model.trim="form.isTableFee" :active-value="1" :inactive-value="0" active-text="免餐位费">
|
||||
</el-switch>
|
||||
|
|
@ -171,6 +205,7 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import QRCode from 'qrcode'
|
||||
import { getToken } from "@/utils/auth";
|
||||
import { mapGetters } from "vuex";
|
||||
import crudQiNiu from "@/api/tools/qiniu";
|
||||
|
|
@ -188,7 +223,10 @@ export default {
|
|||
startTime: "",
|
||||
endTime: "",
|
||||
formLoading: false,
|
||||
form: {},
|
||||
form: {
|
||||
eatModel: [],
|
||||
paymentQrcode: ''
|
||||
},
|
||||
rules: {
|
||||
shopName: [
|
||||
{
|
||||
|
|
@ -262,10 +300,32 @@ export default {
|
|||
this.tbShopInfo();
|
||||
},
|
||||
methods: {
|
||||
// 下载图片
|
||||
// 下载url图片
|
||||
downloadImgHandle(url) {
|
||||
if (url) window.open(url, '_blank')
|
||||
},
|
||||
// 下载图片
|
||||
downloadCanvas(url) {
|
||||
if (url) {
|
||||
this.saveCanvasAsImage(this.$refs.canvas, 'pay_code')
|
||||
}
|
||||
},
|
||||
saveCanvasAsImage(canvas, filename) {
|
||||
// 获取canvas的数据URL
|
||||
const dataURL = canvas.toDataURL('image/png');
|
||||
|
||||
// 创建一个a标签用于下载
|
||||
const downloadLink = document.createElement('a');
|
||||
downloadLink.href = dataURL;
|
||||
downloadLink.download = filename;
|
||||
document.body.appendChild(downloadLink);
|
||||
|
||||
// 触发下载
|
||||
downloadLink.click();
|
||||
|
||||
// 清理临时元素
|
||||
document.body.removeChild(downloadLink);
|
||||
},
|
||||
onSearchResult(res) {
|
||||
this.locationSearchList = res;
|
||||
this.amapOptions.center = [res[0].lng, res[0].lat];
|
||||
|
|
@ -296,7 +356,12 @@ export default {
|
|||
this.startTime = businessTime[0];
|
||||
this.endTime = businessTime[1];
|
||||
}
|
||||
} catch (error) { }
|
||||
QRCode.toCanvas(this.$refs.canvas, this.form.paymentQrcode, { margin: 0 }, function (error) {
|
||||
console.log(error);
|
||||
})
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
// 保存
|
||||
submitHandle() {
|
||||
|
|
@ -372,6 +437,13 @@ export default {
|
|||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.img_box {
|
||||
display: flex;
|
||||
align-items: flex-end;
|
||||
gap: 20px;
|
||||
padding-bottom: 20px;
|
||||
}
|
||||
|
||||
.map_box {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,211 @@
|
|||
<template>
|
||||
<div class="app-container">
|
||||
<div class="left_menu">
|
||||
<div class="search_wrap">
|
||||
<el-input placeholder="名称/代码" v-model="query.name">
|
||||
<el-button slot="append" icon="el-icon-search"></el-button>
|
||||
</el-input>
|
||||
</div>
|
||||
<div class="tree_wrap">
|
||||
<el-tree :data="treeData" node-key="id" highlight-current :props="{ label: 'name' }" default-expand-all
|
||||
@node-click="treeItemClick"></el-tree>
|
||||
</div>
|
||||
</div>
|
||||
<div class="table_wrap">
|
||||
<div class="header_wrap">
|
||||
<el-button type="primary" @click="addHandle">新建</el-button>
|
||||
</div>
|
||||
<div class="table">
|
||||
<el-table :data="tableData.list" border height="100%" v-loading="tableData.loading">
|
||||
<el-table-column label="序号" type="index"></el-table-column>
|
||||
<el-table-column label="菜品名称" prop="productNames"></el-table-column>
|
||||
<el-table-column label="类型" prop="padLayoutName"></el-table-column>
|
||||
<el-table-column label="所属小类" prop="productCategoryName"></el-table-column>
|
||||
<el-table-column label="自定义分类" prop="customName"></el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template v-slot="scope">
|
||||
<el-button type="text">拖动排序</el-button>
|
||||
<el-button type="text" @click="editorHandle(scope.row, 1)">编辑</el-button>
|
||||
<el-popconfirm title="确定删除吗？" @confirm="delTableHandle(scope.row.id)">
|
||||
<el-button type="text" slot="reference">删除</el-button>
|
||||
</el-popconfirm>
|
||||
<el-button type="text" @click="editorHandle(scope.row, 2)">预览</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<div class="head-container">
|
||||
<el-pagination @size-change="paginationSizeChange" :total="tableData.total"
|
||||
:current-page="tableData.page" :page-size="tableData.size" @current-change="paginationChange"
|
||||
layout="total, sizes, prev, pager, next, jumper"></el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
<AddPadPage ref="AddPadPage" :category="selectCatory.id" @success="addSuccess" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AddPadPage from './components/addPadPage.vue'
|
||||
import { tbShopCategoryGet } from '@/api/shop'
|
||||
import { productGrouppage, productCategoryDelete } from '@/api/pad.js'
|
||||
import editor from 'mavon-editor';
|
||||
export default {
|
||||
components: {
|
||||
AddPadPage
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
query: {
|
||||
name: ''
|
||||
},
|
||||
selectCatory: '',
|
||||
treeData: [],
|
||||
tableData: {
|
||||
loading: false,
|
||||
page: 1,
|
||||
size: 10,
|
||||
total: 0,
|
||||
list: []
|
||||
}
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.tbShopCategoryGet()
|
||||
},
|
||||
methods: {
|
||||
// 删除
|
||||
async delTableHandle(id) {
|
||||
try {
|
||||
await productCategoryDelete(id)
|
||||
this.$message.success('已删除')
|
||||
this.getTableData()
|
||||
} catch (error) {
|
||||
console.log(error);
|
||||
}
|
||||
},
|
||||
// 编辑 预览
|
||||
editorHandle(row, type) {
|
||||
this.$refs.AddPadPage.show(row.id, type)
|
||||
},
|
||||
// 新建成功
|
||||
addSuccess() {
|
||||
this.tableData.page = 1
|
||||
this.getTableData()
|
||||
},
|
||||
// 新建
|
||||
addHandle() {
|
||||
if (this.selectCatory.id) {
|
||||
this.$refs.AddPadPage.show()
|
||||
} else {
|
||||
this.$message.warning('请选择分类')
|
||||
}
|
||||
},
|
||||
// 分类被点击
|
||||
treeItemClick(data) {
|
||||
this.selectCatory = data
|
||||
this.tableData.page = 1
|
||||
this.getTableData()
|
||||
},
|
||||
// 获取商品分类
|
||||
async tbShopCategoryGet() {
|
||||
this.tableData.loading = true
|
||||
try {
|
||||
const res = await tbShopCategoryGet({
|
||||
page: 0,
|
||||
size: 100,
|
||||
sort: 'id,desc',
|
||||
shopId: localStorage.getItem('shopId')
|
||||
})
|
||||
this.treeData = res.content
|
||||
this.getTableData()
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
},
|
||||
// 重置查询
|
||||
resetHandle() {
|
||||
this.tableData.page = 1
|
||||
this.tableData.size = 10
|
||||
this.tableData.list = []
|
||||
this.getTableData()
|
||||
},
|
||||
// 每页条数改变是回调
|
||||
paginationSizeChange(e) {
|
||||
this.tableData.size = e
|
||||
this.tableData.page = 1
|
||||
this.getTableData()
|
||||
},
|
||||
// 分页回调
|
||||
paginationChange(e) {
|
||||
this.tableData.page = e
|
||||
this.tableData.list = []
|
||||
this.getTableData()
|
||||
},
|
||||
// Pad点餐列表
|
||||
async getTableData() {
|
||||
try {
|
||||
this.tableData.loading = true
|
||||
const res = await productGrouppage({
|
||||
shopId: localStorage.getItem("shopId"),
|
||||
page: this.tableData.page,
|
||||
size: this.tableData.size,
|
||||
customName: '',
|
||||
productCategoryId: this.selectCatory.id,
|
||||
padLayoutId: '',
|
||||
id: ''
|
||||
})
|
||||
this.tableData.loading = false
|
||||
this.tableData.list = res.content
|
||||
this.tableData.total = res.totalElements
|
||||
} catch (error) {
|
||||
console.log(error)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
:deep(.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content) {
|
||||
background-color: #1890ff;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.app-container {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.left_menu {
|
||||
width: 164px;
|
||||
height: calc(100vh - 210px);
|
||||
border: 1px solid #ddd;
|
||||
|
||||
.search_wrap {
|
||||
padding: 14px;
|
||||
}
|
||||
|
||||
.tree_wrap {
|
||||
width: 100%;
|
||||
height: calc(100% - 70px);
|
||||
overflow-y: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.table_wrap {
|
||||
flex: 1;
|
||||
padding-left: 14px;
|
||||
|
||||
.header_wrap {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.table {
|
||||
padding-top: 15px;
|
||||
height: calc(100vh - 310px);
|
||||
}
|
||||
}
|
||||
|
||||
.head-container {
|
||||
padding-top: 20px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -2,14 +2,14 @@
|
|||
<div class="app-container">
|
||||
<el-tabs v-model="activeName" type="card">
|
||||
<el-tab-pane label="店铺信息" name="1"></el-tab-pane>
|
||||
<el-tab-pane label="经营模式" name="8"></el-tab-pane>
|
||||
<el-tab-pane label="基础配置" name="2"></el-tab-pane>
|
||||
<!-- <el-tab-pane label="经营模式" name="8"></el-tab-pane> -->
|
||||
<!-- <el-tab-pane label="基础配置" name="2"></el-tab-pane> -->
|
||||
<!-- <el-tab-pane label="通知配置" name="3"></el-tab-pane> -->
|
||||
<el-tab-pane label="安全设置" name="4"></el-tab-pane>
|
||||
<!-- <el-tab-pane label="店铺装修" name="5"></el-tab-pane> -->
|
||||
<el-tab-pane label="跳转小程序" name="6" v-if="shopId == 1"></el-tab-pane>
|
||||
<el-tab-pane label="通知中心" name="7"></el-tab-pane>
|
||||
<el-tab-pane label="店铺收款码" name="9"></el-tab-pane>
|
||||
<!-- <el-tab-pane label="店铺收款码" name="9"></el-tab-pane> -->
|
||||
</el-tabs>
|
||||
<shopInfo v-if="activeName == 1" />
|
||||
<shopSetting v-if="activeName == 2" />
|
||||
|
|
|
|||
Loading…
Reference in New Issue