新增团购券分类

This commit is contained in:
gyq 2024-05-11 09:04:31 +08:00
parent 2e2205badc
commit 8441022041
9 changed files with 535 additions and 76 deletions

View File

@ -2,7 +2,8 @@ ENV = 'production'
# 如果使用 Nginx 代理后端接口,那么此处需要改为 '/',文件查看 Docker 部署篇Nginx 配置 # 如果使用 Nginx 代理后端接口,那么此处需要改为 '/',文件查看 Docker 部署篇Nginx 配置
# 接口地址,注意协议,如果你没有配置 ssl需要将 https 改为 http # 接口地址,注意协议,如果你没有配置 ssl需要将 https 改为 http
VUE_APP_BASE_API = 'https://cashieradmin.sxczgkj.cn' # VUE_APP_BASE_API = 'https://cashieradmin.sxczgkj.cn'
VUE_APP_BASE_API = 'https://admintestpapi.sxczgkj.cn'
# VUE_APP_BASE_API = 'http://192.168.2.98:8000' # VUE_APP_BASE_API = 'http://192.168.2.98:8000'
# 如果接口是 http 形式, wss 需要改为 ws # 如果接口是 http 形式, wss 需要改为 ws
VUE_APP_WS_API = 'wss://123.56.110.252 VUE_APP_WS_API = 'wss://123.56.110.252

View File

@ -72,3 +72,27 @@ export function tbPlatformDictGet(params) {
params params
}); });
} }
/**
* 新增团购卷分类
* @returns
*/
export function tbCouponCategoryPostPut(data, method = "post") {
return request({
url: "/api/tbCouponCategory",
method: method,
data: data
});
}
/**
* 查询团购卷分类
* @returns
*/
export function tbCouponCategoryGet(params) {
return request({
url: "/api/tbCouponCategory",
method: "get",
params
});
}

View File

@ -0,0 +1,113 @@
<template>
<el-dialog title="选择商品" :visible.sync="dialogVisible" @open="resetHandle()">
<el-form :model="searhForm" inline>
<el-form-item>
<el-input v-model="searhForm.name" placeholder="商品名称"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</el-form-item>
</el-form>
<div class="head-container">
<el-table ref="table" :data="tableData.list" v-loading="tableData.loading">
<el-table-column label="名称" prop="name"></el-table-column>
<el-table-column label="状态" prop="status">
<template v-slot="scope">
<el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0"
disabled></el-switch>
</template>
</el-table-column>
<el-table-column label="操作">
<template v-slot="scope">
<el-button type="primary" size="mini" @click="confirmHandle(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>
</el-dialog>
</template>
<script>
import { tbCouponCategoryGet } from "@/api/setting";
export default {
data() {
return {
dialogVisible: false,
searhForm: {
name: ''
},
tableData: {
page: 0,
size: 10,
total: 0,
loading: false,
list: []
}
}
},
methods: {
//
confirmHandle(row) {
this.$emit('success', row)
this.close()
},
//
resetHandle() {
this.searhForm.name = ''
this.tableData.page = 0
this.tableData.size = 10
this.tableData.list = []
this.getTableData()
},
//
sizeChange(e) {
this.tableData.size = e
this.getTableData()
},
//
paginationChange(e) {
this.tableData.page = e - 1
this.getTableData()
},
//
async getTableData() {
this.tableData.loading = true
try {
const res = await tbCouponCategoryGet({
page: this.tableData.page,
size: this.tableData.size,
name: this.searhForm.name,
sort: 'id',
})
this.tableData.loading = false
this.tableData.list = res.content
this.tableData.total = res.totalElements
} catch (error) {
console.log(error)
}
},
show() {
this.dialogVisible = true
this.resetHandle()
},
close() {
this.dialogVisible = false
}
}
}
</script>
<style scoped lang="scss">
.shop_info {
display: flex;
align-items: center;
span {
margin-left: 10px;
}
}
</style>

View File

@ -78,7 +78,7 @@
<el-dialog title="选择地址" :visible.sync="showLocation" :modal="false" :modal-append-to-body="false"> <el-dialog title="选择地址" :visible.sync="showLocation" :modal="false" :modal-append-to-body="false">
<div class="map_box"> <div class="map_box">
<div class="map"> <div class="map">
<el-amap :center="amapOptions.center"> <el-amap ref="map" :center="amapOptions.center">
<el-amap-marker :position="amapOptions.center"></el-amap-marker> <el-amap-marker :position="amapOptions.center"></el-amap-marker>
</el-amap> </el-amap>
</div> </div>
@ -86,7 +86,6 @@
<el-amap-search-box :search-option="searchOption" <el-amap-search-box :search-option="searchOption"
:on-search-result="onSearchResult"></el-amap-search-box> :on-search-result="onSearchResult"></el-amap-search-box>
</div> </div>
<div class="search_wrap"> <div class="search_wrap">
<div class="item" v-for="item in locationSearchList" :key="item.id"> <div class="item" v-for="item in locationSearchList" :key="item.id">
<div class="left"> <div class="left">
@ -231,6 +230,16 @@ export default {
this.form.lng = item.lng this.form.lng = item.lng
this.form.lat = item.lat this.form.lat = item.lat
this.showLocation = false this.showLocation = false
console.log(this.$refs.map.$$getInstance());
const position = { lng: item.lng, lat: item.lat };
this.$refs.map.geocoder.getAddress(position, (status, result) => {
if (status === 'complete' && result.info === 'OK') {
//
console.log(result.regeocode.addressComponent);
}
})
}, },
// //
submitHandle() { submitHandle() {

View File

@ -0,0 +1,83 @@
<template>
<el-dialog :title="form.id ? '编辑' : '添加'" :visible.sync="dialogVisible" @close="reset">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
<el-form-item label="字典名称" prop="name">
<el-input v-model="form.name" placeholder="请输入分类名称"></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-item label="排序">
<el-input-number v-model="form.sort" controls-position="right" :min="0"></el-input-number>
</el-form-item> -->
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" :loading="loading" @click="onSubmitHandle"> </el-button>
</span>
</el-dialog>
</template>
<script>
import { tbCouponCategoryPostPut } from "@/api/setting";
export default {
data() {
return {
dialogVisible: false,
loading: false,
form: {
id: "",
name: "",
status: 1
},
rules: {
name: [
{
required: true,
message: " ",
trigger: "blur"
}
]
},
resetForm: "",
};
},
mounted() {
this.resetForm = { ...this.form };
},
methods: {
onSubmitHandle() {
this.$refs.form.validate(async valid => {
if (valid) {
try {
this.loading = true
let res = await tbCouponCategoryPostPut(this.form, this.form.id ? "put" : "post");
this.$emit("success", res);
this.close();
this.$notify({
title: "成功",
message: `${this.form.id ? "编辑" : "添加"}成功`,
type: "success"
});
this.loading = false
} catch (error) {
console.log(error);
}
}
});
},
show(obj) {
this.dialogVisible = true;
if (obj && obj.id) {
this.form = { ...obj };
}
},
close() {
this.dialogVisible = false;
},
reset() {
this.form = { ...this.resetForm };
}
}
};
</script>

View File

@ -0,0 +1,133 @@
<template>
<div class="app-container">
<div class="head-container">
<el-row :gutter="20">
<el-col :span="6">
<el-input v-model="query.name" size="small" clearable placeholder="请输入名称" style="width: 100%;"
class="filter-item" @keyup.enter.native="getTableData" />
</el-col>
<el-col :span="6">
<el-button type="primary" @click="getTableData">查询</el-button>
<el-button @click="resetHandle">重置</el-button>
</el-col>
</el-row>
</div>
<div class="head-container">
<el-button type="primary" icon="el-icon-plus" @click="$refs.addRef.show()">
添加团购券分类
</el-button>
<add ref="addRef" @success="getTableData" />
</div>
<div class="head-container">
<el-table :data="tableData.list" v-loading="tableData.loading">
<el-table-column label="名称" prop="name"></el-table-column>
<el-table-column label="状态" prop="status">
<template v-slot="scope">
<el-switch v-model="scope.row.status" :active-value="1" :inactive-value="0"
@change="changeHot($event, scope.row)"></el-switch>
</template>
</el-table-column>
<el-table-column label="操作" width="300">
<template v-slot="scope">
<el-button type="text" size="mini" round icon="el-icon-edit"
@click="$refs.addRef.show(scope.row)">编辑</el-button>
<el-popconfirm title="确定删除吗?" @confirm="delHandle([scope.row.id])">
<el-button type="text" size="mini" round icon="el-icon-delete" slot="reference">
删除
</el-button>
</el-popconfirm>
</template>
</el-table-column>
</el-table>
</div>
<div class="head-container">
<el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
@current-change="paginationChange" layout="total, sizes, prev, pager, next, jumper"></el-pagination>
</div>
</div>
</template>
<script>
import add from "./components/add";
import { tbCouponCategoryGet, tbCouponCategoryPostPut } from "@/api/setting";
export default {
components: {
add
},
data() {
return {
query: {
name: ''
},
tableData: {
page: 0,
size: 10,
total: 0,
loading: false,
list: []
}
};
},
mounted() {
this.getTableData();
},
methods: {
//
async changeHot(e, row) {
try {
this.tableData.loading = true
await tbCouponCategoryPostPut({ ...row })
this.getTableData()
} catch (error) {
console.log(error);
}
},
// table
toQuery() {
this.getTableData();
}, //
resetHandle() {
this.tableData.page = 0;
this.query.blurry = "";
this.getTableData();
},
//
paginationChange(e) {
this.tableData.page = e - 1;
this.getTableData();
},
//
async delHandle(ids) {
try {
await tbCouponCategoryPostPut(ids, "delete");
this.$notify({
title: "成功",
message: `删除成功`,
type: "success"
});
this.getTableData();
} catch (error) {
console.log(error);
}
},
async getTableData() {
this.tableData.loading = true;
try {
const res = await tbCouponCategoryGet(
{
page: this.tableData.page,
size: this.tableData.size,
blurry: this.query.name,
sort: ''
}
);
this.tableData.loading = false;
this.tableData.list = res.content;
this.tableData.total = res.totalElements;
} catch (error) {
console.log(error);
}
}
}
};
</script>

View File

@ -1,84 +1,104 @@
<template> <template>
<el-dialog :title="form.id ? '编辑' : '添加'" :visible.sync="dialogVisible" @close="reset"> <div>
<div class="div_h"> <el-dialog :title="form.id ? '编辑' : '添加'" :visible.sync="dialogVisible" @close="reset">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left"> <div class="div_h">
<el-form-item label="展示图"> <el-form ref="form" :model="form" :rules="rules" label-width="120px" label-position="left">
<uploadImg ref="uploadImg2" @success="res => form.coverImg = res[0]" @remove="form.coverImg = ''" /> <el-form-item label="资源类型" prop="type">
</el-form-item> <el-select v-model="form.type" placeholder="请选择资源类型" @change="typeChange">
<el-form-item label="描述" prop="name"> <el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value"></el-option>
<el-input v-model="form.name" placeholder="请输入描述"></el-input> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="值" prop="value"> <el-form-item label="团购卷" prop="group" v-if="form.type == 'group'">
<el-input v-model="form.value" placeholder="请输入值"></el-input> <div v-if="!productIds.length">
</el-form-item> <el-button type="primary" icon="el-icon-plus" @click="$refs.groupTypeList.show()">
<el-form-item label="字体色"> 添加团购券
<el-color-picker v-model="form.fontColor"></el-color-picker> </el-button>
</el-form-item> </div>
<el-form-item label="背景色"> <div class="shop_list" v-else>
<el-color-picker v-model="form.backColor"></el-color-picker> <el-tag closable type="primary" v-for="(item, index) in productIds" :key="item.id"
</el-form-item> @close="productIds.splice(index, 1)">
<el-form-item label="资源类型" prop="type"> {{ item.name }}
<el-select v-model="form.type" placeholder="请选择资源类型"> </el-tag>
<el-option v-for="item in typeList" :key="item.value" :label="item.label" :value="item.value"></el-option> </div>
</el-select> </el-form-item>
</el-form-item> <el-form-item label="描述" prop="name" v-if="form.type != 'group'">
<el-form-item label="跳转类型" prop="jumpType"> <el-input v-model="form.name" placeholder="请输入描述"></el-input>
<el-select v-model="form.jumpType" placeholder="请选择资源类型"> </el-form-item>
<el-option v-for="item in jumpTypeList" :key="item.value" :label="item.label" <el-form-item label="值" prop="value" v-if="form.type != 'group'">
:value="item.value"></el-option> <el-input v-model="form.value" placeholder="请输入值"></el-input>
</el-select> </el-form-item>
</el-form-item> <el-form-item label="跳转类型" prop="jumpType">
<el-form-item label="相对跳转地址" prop="value"> <el-select v-model="form.jumpType" placeholder="请选择资源类型">
<el-input v-model="form.relUrl" placeholder="请输入相对跳转地址"></el-input> <el-option v-for="item in jumpTypeList" :key="item.value" :label="item.label"
</el-form-item> :value="item.value"></el-option>
<el-form-item label="绝对跳转地址" prop="value"> </el-select>
<el-input v-model="form.absUrl" placeholder="请输入绝对跳转地址"></el-input> </el-form-item>
</el-form-item> <el-form-item label="展示图">
<el-form-item label="标签前小图标"> <uploadImg ref="uploadImg2" @success="res => form.coverImg = res[0]" @remove="form.coverImg = ''" />
<uploadImg ref="uploadImg1" @success="res => form.shareImg = res[0]" @remove="form.shareImg = ''" /> </el-form-item>
</el-form-item> <el-form-item label="字体色">
<el-form-item label="APP端展示"> <el-color-picker v-model="form.fontColor"></el-color-picker>
<el-radio-group v-model="form.isShowApp"> </el-form-item>
<el-radio :label="1">展示</el-radio> <el-form-item label="背景色">
<el-radio :label="0">不展示</el-radio> <el-color-picker v-model="form.backColor"></el-color-picker>
</el-radio-group> </el-form-item>
</el-form-item> <el-form-item label="相对跳转地址" prop="value">
<el-form-item label="收银端展示"> <el-input v-model="form.relUrl" placeholder="请输入相对跳转地址"></el-input>
<el-radio-group v-model="form.isShowCash"> </el-form-item>
<el-radio :label="1">展示</el-radio> <el-form-item label="绝对跳转地址" prop="value">
<el-radio :label="0">不展示</el-radio> <el-input v-model="form.absUrl" placeholder="请输入绝对跳转地址"></el-input>
</el-radio-group> </el-form-item>
</el-form-item> <el-form-item label="标签前小图标">
<el-form-item label="小程序端展示"> <uploadImg ref="uploadImg1" @success="res => form.shareImg = res[0]" @remove="form.shareImg = ''" />
<el-radio-group v-model="form.isShowMall"> </el-form-item>
<el-radio :label="1">展示</el-radio> <el-form-item label="APP端展示">
<el-radio :label="0">不展示</el-radio> <el-radio-group v-model="form.isShowApp">
</el-radio-group> <el-radio :label="1">展示</el-radio>
</el-form-item> <el-radio :label="0">不展示</el-radio>
<el-form-item label="排序"> </el-radio-group>
<el-input-number v-model="form.sort" controls-position="right" :min="0"></el-input-number> </el-form-item>
</el-form-item> <el-form-item label="收银端展示">
</el-form> <el-radio-group v-model="form.isShowCash">
</div> <el-radio :label="1">展示</el-radio>
<span slot="footer" class="dialog-footer"> <el-radio :label="0">不展示</el-radio>
<el-button @click="dialogVisible = false"> </el-button> </el-radio-group>
<el-button type="primary" :loading="loading" @click="onSubmitHandle"> </el-button> </el-form-item>
</span> <el-form-item label="小程序端展示">
</el-dialog> <el-radio-group v-model="form.isShowMall">
<el-radio :label="1">展示</el-radio>
<el-radio :label="0">不展示</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="排序">
<el-input-number v-model="form.sort" controls-position="right" :min="0"></el-input-number>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false"> </el-button>
<el-button type="primary" :loading="loading" @click="onSubmitHandle"> </el-button>
</span>
</el-dialog>
<groupTypeList ref="groupTypeList" @success="row => productIds = [row]" />
</div>
</template> </template>
<script> <script>
import { tbPlatformDictPostPut } from "@/api/setting"; import { tbPlatformDictPostPut } from "@/api/setting";
import uploadImg from '@/components/uploadImg' import uploadImg from '@/components/uploadImg'
import enumData from '../enumData.js' import enumData from '../enumData.js'
import groupTypeList from '@/components/groupTypeList'
export default { export default {
components: { components: {
uploadImg uploadImg,
groupTypeList
}, },
data() { data() {
return { return {
dialogVisible: false, dialogVisible: false,
loading: false, loading: false,
productIds: [],
form: { form: {
id: "", id: "",
shareImg: '', shareImg: '',
@ -128,6 +148,15 @@ export default {
this.resetForm = { ...this.form }; this.resetForm = { ...this.form };
}, },
methods: { methods: {
typeChange(e) {
if (e == 'group') {
} else if (e == 'custom') {
} else {
}
},
// //
onSubmitHandle() { onSubmitHandle() {
this.$refs.form.validate(async valid => { this.$refs.form.validate(async valid => {
@ -152,7 +181,6 @@ export default {
}); });
}, },
show(obj) { show(obj) {
console.log(obj);
this.dialogVisible = true; this.dialogVisible = true;
if (obj && obj.id) { if (obj && obj.id) {
this.form = { ...obj }; this.form = { ...obj };
@ -191,4 +219,71 @@ export default {
max-height: 50vh; max-height: 50vh;
overflow-y: auto; overflow-y: auto;
} }
.shop_list {
display: flex;
flex-wrap: wrap;
.item_wrap {
$size: 80px;
.item {
$radius: 4px;
width: $size;
height: $size;
border-radius: $radius;
overflow: hidden;
position: relative;
margin-right: 10px;
margin-top: 10px;
&:hover {
cursor: pointer;
}
&::after {
content: attr(data-index);
font-size: 12px;
height: 20px;
display: flex;
padding: 0 10px;
border-radius: 0 0 $radius 0;
align-items: center;
background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
color: #fff;
position: absolute;
top: 0;
left: 0;
z-index: 10;
}
&::before {
content: '删除';
font-size: 12px;
width: 100%;
height: 20px;
display: flex;
padding: 0 10px;
align-items: center;
justify-content: center;
background-color: rgba(0, 0, 0, 0.3);
backdrop-filter: blur(10px);
color: #fff;
position: absolute;
bottom: 0;
left: 0;
z-index: 10;
transition: all .1s ease-in-out;
}
}
.name {
width: $size;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
}
}
</style> </style>

View File

@ -46,9 +46,9 @@ export default {
value: "group", value: "group",
label: "团购卷" label: "团购卷"
}, },
{ // {
value: "custom", // value: "custom",
label: "自定义" // label: "自定义"
} // }
] ]
}; };

View File

@ -122,7 +122,8 @@ export default {
}, },
filters: { filters: {
typeFilter(t) { typeFilter(t) {
return enumData.typeList.find(item => item.value == t).label let e = enumData.typeList.find(item => item.value == t).label
return e ? e : t
}, },
jumpFilter(t) { jumpFilter(t) {
return t ? enumData.jumpTypeList.find(item => item.value == t).label : '' return t ? enumData.jumpTypeList.find(item => item.value == t).label : ''