chuangte/smart-switch-ui
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

提交

Browse Source
This commit is contained in:
磷叶 2025-01-17 18:16:23 +08:00
parent e42c00e2ef
commit 22385833f1
11 changed files with 411 additions and 320 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/api/ss/bonus.js
View File

@ -61,3 +61,14 @@ export function payBonus(id) {
method: 'put'
})
}
// 减余额
export function subtractBalanceBonus(id, amount) {
return request({
url: `/ss/bonus/${id}/subtract`,
method: 'put',
params: {
amount
}
})
}

30
src/components/FormCol/index.vue
View File

@ -1,20 +1,12 @@
<template>
<el-col :span="span">
<el-form-item :prop="prop" :label-width="labelWidth">
<template #label>
<el-tooltip v-if="!isEmpty(tip)" :content="tip" placement="top">
<i class="el-icon-question" style="margin-right: 5px;cursor: pointer"/>
</el-tooltip>
<span>{{label}}</span>
</template>
<el-form-item :label="label" :prop="prop" :label-width="labelWidth" :rules="rules" :class="table ? 'table-form-item' : ''">
<slot></slot>
</el-form-item>
</el-col>
</template>
<script>
import { isEmpty } from '@/utils/index'
export default {
name: 'FormCol',
props: {
@ -34,13 +26,23 @@ export default {
type: String,
default: null
},
tip: {
type: String,
rules: {
type: Array,
default: null
},
table: {
type: Boolean,
default: false
}
},
methods: {
isEmpty,
}
}
</script>
<style scoped lang="scss">
.table-form-item {
margin: 0;
}
.table-form-item.is-error {
margin-bottom: 18px;
}
</style>

14
src/utils/constants.js
View File

@ -291,12 +291,6 @@ export const TransactionBillType = {
WITHDRAW: "2", // 提现
}
// VIP有效期类型
export const VipExpireType = {
FOREVER: "1", // 永久有效
TIME: "2", // 有效期
}
// 设备获取在线状态类型
export const DeviceOnlineType = {
GET: "1", //OneNet获取
@ -326,9 +320,15 @@ export const AppType = {
}
// 会员等级状态
export const VipLevelStatus = {
export const VipLevelSkuStatus = {
ENABLED: "1", // 启用
DISABLED: "2", // 禁用
}
// 会员等级SKU限制类型
export const VipLevelSkuLimitType = {
NONE: "1", // 不限制
WEEK: "2", // 自然周
MONTH: "3", // 月（30天）
}

2
src/views/mch/vipLevel/index.vue
View File

@ -60,7 +60,7 @@
import { listVipLevel, getVipLevel, delVipLevel, addVipLevel, updateVipLevel } from "@/api/ss/vipLevel";
import { $showColumns } from '@/utils/mixins';
import UserLink from '@/components/Business/SmUser/UserLink.vue'
import VipLevelEditDialog from '@/views/ss/vipLevel/components/VipLevelEditDialog.vue'
import VipLevelEditDialog from '@/views/ss/vipLevel/edit/index.vue'
import VipLevelTable from '@/views/ss/vipLevel/components/VipLevelTable.vue'
import { isEmpty } from '@/utils'
import {

45
src/views/ss/bonus/index.vue
View File

@ -27,8 +27,8 @@
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="收款方类型" prop="arrivalType" label-width="6em">
<el-select v-model="queryParams.arrivalType" placeholder="请选择收款方类型" clearable @change="handleQuery">
<el-form-item label="收款方类型" prop="arrivalTypes" label-width="6em">
<el-select v-model="queryParams.arrivalTypes" placeholder="请选择收款方类型" clearable @change="handleQuery" multiple>
<el-option
v-for="dict in dict.type.bonus_arrival_type"
:key="dict.value"
@ -37,6 +37,12 @@
/>
</el-select>
</el-form-item>
<el-form-item label="是否有退款" prop="hasRefund">
<el-select v-model="queryParams.hasRefund" placeholder="请选择是否有退款" clearable @change="handleQuery">
<el-option label="是" :value="true" />
<el-option label="否" :value="false" />
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@ -99,6 +105,9 @@
<template v-else-if="column.key === 'toBalance'">
<boolean-tag :value="d.row.toBalance"/>
</template>
<template v-else-if="column.key === 'byHand'">
<boolean-tag :value="d.row.byHand"/>
</template>
<template v-else-if="column.key === 'arrivalName'">
<user-link v-if="BonusArrivalType.userList().includes(d.row.arrivalType)" :id="d.row.arrivalId" :name="d.row.arrivalName"/>
<template v-else> {{d.row.arrivalName | defaultValue}}</template>
@ -119,6 +128,14 @@
v-hasPermi="['ss:bonus:pay']"
v-show="BonusStatus.canPay().includes(scope.row.status) && scope.row.waitAmount > 0"
>立即分成</el-button>
<!-- <el-button
size="mini"
type="text"
icon="el-icon-wallet"
@click="handleSubtractBalance(scope.row)"
v-hasPermi="['ss:bonus:subtract']"
v-show="scope.row.refundAmount > 0"
>减余额</el-button> -->
</template>
</el-table-column>
</el-table>
@ -192,7 +209,7 @@
</template>
<script>
import { listBonus, getBonus, delBonus, addBonus, updateBonus, payBonus } from '@/api/ss/bonus'
import { listBonus, getBonus, delBonus, addBonus, updateBonus, payBonus, subtractBalanceBonus } from '@/api/ss/bonus'
import { $showColumns, $view } from '@/utils/mixins'
import { BonusArrivalType, BonusStatus, SmUserType, views } from '@/utils/constants'
import UserLink from '@/components/Business/SmUser/UserLink.vue'
@ -231,6 +248,7 @@ export default {
{key: 'payedAmount', visible: true, label: '已分金额', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'refundAmount', visible: true, label: '退款金额', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'toBalance', visible: true, label: '变动余额', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'byHand', visible: true, label: '手动处理', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'prePayTime', visible: true, label: '预计分成', minWidth: null, sortable: true, overflow: false, align: 'center', width: "100"},
{key: 'payTime', visible: true, label: '实际分成', minWidth: null, sortable: true, overflow: false, align: 'center', width: "100"},
{key: 'createTime', visible: true, label: '创建时间', minWidth: null, sortable: true, overflow: false, align: 'center', width: "100"},
@ -262,6 +280,8 @@ export default {
pageSize: 20,
orderByColumn: defaultSort.prop,
isAsc: defaultSort.order,
arrivalTypes: [],
hasRefund: null,
id: null,
billId: null,
billNo: null,
@ -337,6 +357,25 @@ export default {
this.getList();
},
methods: {
handleSubtractBalance(row) {
this.$prompt(`请输入减余额金额`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
inputValue: row.refundAmount,
type: 'warning'
}).then(({ value }) => {
this.$confirm(`是否确认减余额【订单编号】${row.billNo}【收款方】${row.arrivalName}的分成？`, {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
subtractBalanceBonus(row.id, value).then(res => {
this.$message.success("减余额成功");
this.getList();
})
})
});
},
handlePay(row) {
this.$confirm(`是否确认支付【订单编号】${row.billNo}【收款方】${row.arrivalName}的分成？`, {
confirmButtonText: '确定',

71
src/views/ss/vip/components/VipEditDialog.vue
View File

@ -4,29 +4,19 @@
<el-form-item label="用户" prop="userId">
<user-input v-model="form.userId"/>
</el-form-item>
<el-form-item label="店铺" prop="storeId">
<store-input v-model="form.storeId" @change="onChangeStore"/>
</el-form-item>
<el-form-item label="会员等级" prop="levelId">
<vip-level-input v-model="form.levelId" :before-open="beforeOpenVipLevel" :query="vipLevelQuery"/>
<vip-level-input v-model="form.levelId" />
</el-form-item>
<el-form-item label="时效类型" prop="expireType">
<el-radio-group v-model="form.expireType" style="width: 100%">
<el-radio
v-for="dict in dict.type.vip_expire_type"
:key="dict.value"
:label="dict.value"
>{{dict.label}}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="有效期" prop="expireTime" v-if="form.expireType === VipExpireType.TIME">
<el-form-item label="有效期" prop="time">
<el-date-picker
clearable
v-model="form.expireTime"
type="datetime"
v-model="expireTime"
type="datetimerange"
value-format="yyyy-MM-dd HH:mm:ss"
placeholder="请选择有效期"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
style="width: 100%"
:default-time="['00:00:00', '23:59:59']"
/>
</el-form-item>
</el-form>
@ -43,12 +33,10 @@ import StoreInput from '@/components/Business/Store/StoreInput.vue'
import VipLevelInput from '@/components/Business/VipLevel/VipLevelInput.vue'
import { addVip, getVip, updateVip } from '@/api/ss/vip'
import { $editDialog } from '@/utils/mixins'
import { VipExpireType } from '@/utils/constants'
export default {
name: "VipEditDialog",
dicts: ['vip_expire_type'],
mixins: [$editDialog],
mixins: [$editDialog],
components: { VipLevelInput, StoreInput, UserInput },
props: {
rules: {
@ -60,28 +48,30 @@ export default {
levelId: [
{ required: true, message: "会员等级不能为空", trigger: "change" }
],
expireTime: [
{ required: true, message: '有效期不允许为空', trigger: 'change'}
],
expireType: [
{ required: true, message: '有效期类型不允许为空', trigger: 'change'}
]
})
}
},
data() {
return {
VipExpireType
}
},
computed: {
vipLevelQuery() {
return {
mchId: this.form.storeMchId
// 有效期
expireTime: {
get() {
if (this.form.startTime && this.form.endTime) {
return [this.form.startTime, this.form.endTime];
}
return [];
},
set(value) {
this.form.startTime = value[0];
this.form.endTime = value[1];
}
}
},
},
methods: {
// 获取详情
getDetail() {
getVip(this.id).then(response => {
this.form = response.data;
@ -95,12 +85,9 @@ export default {
this.form = {
id: null,
userId: null,
storeId: null,
levelId: null,
expireTime: null,
createTime: null,
storeMchId: null,
expireType: VipExpireType.FOREVER
startTime: null,
endTime: null,
};
this.resetForm("form");
},
@ -124,16 +111,6 @@ export default {
}
});
},
onChangeStore(store) {
this.form.storeMchId = store.userId;
},
beforeOpenVipLevel() {
if (this.form.storeMchId == null) {
this.$message.warning("请先选择店铺")
return false;
}
return true;
},
}
}
</script>

24
src/views/ss/vip/components/VipTable.vue
View File

@ -46,6 +46,21 @@
<template v-if="column.key === 'id'">
{{d.row[column.key]}}
</template>
<template v-else-if="column.key === 'limitType'">
{{d.row[column.key] | defaultValue}} 次 / <dict-tag :options="dict.type.vip_level_sku_limit_type" :value="d.row[column.key]"/>
</template>
<template v-else-if="column.key === 'roundCount'">
{{d.row[column.key] | defaultValue}} 次
</template>
<template v-else-if="column.key === 'totalCount'">
{{d.row[column.key] | defaultValue}} 次
</template>
<template v-else-if="column.key === 'startTime'">
{{d.row.startTime | defaultValue}} 至 {{d.row.endTime | defaultValue}}
</template>
<template v-else-if="column.key === 'storeList'">
<el-tag v-for="store in d.row[column.key]" :key="store.storeId" size="small" type="success">{{store.name | defaultValue}}</el-tag>
</template>
<template v-else>
{{d.row[column.key]}}
</template>
@ -80,15 +95,20 @@ const defaultSort = {
export default {
name: 'VipTable',
mixins: [$showColumns],
dicts: ['vip_level_sku_limit_type'],
data() {
return {
// 字段列表
columns: [
{key: 'id', visible: true, label: 'ID', minWidth: null, sortable: true, overflow: false, align: 'center', width: "80"},
{key: 'userName', visible: true, label: '用户', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'storeName', visible: true, label: '店铺', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'vipLevelName', visible: true, label: '会员等级', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'expireTime', visible: true, label: '有效期', minWidth: null, sortable: false, overflow: false, align: 'center', width: null},
{key: 'storeList', visible: true, label: '可用店铺', minWidth: null, sortable: false, overflow: false, align: 'center', width: null},
{key: 'startTime', visible: true, label: '有效期', minWidth: null, sortable: false, overflow: false, align: 'center', width: null},
{key: 'nextResetTime', visible: true, label: '下次重置', minWidth: null, sortable: false, overflow: false, align: 'center', width: null},
{key: 'totalCount', visible: true, label: '总计使用', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'roundCount', visible: true, label: '当前周期使用', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'limitType', visible: true, label: '使用限制', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'createTime', visible: true, label: '创建时间', minWidth: null, sortable: false, overflow: false, align: 'center', width: null},
],
// 排序方式

240
src/views/ss/vipLevel/components/VipLevelEditDialog.vue
View File

@ -1,240 +0,0 @@
<template>
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body @open="onOpen">
<el-form ref="form" :model="form" :rules="rules" label-width="80px" v-loading="loading">
<el-row :gutter="8">
<form-col :span="span" label="商户" prop="mchId" v-if="visibleColumn('mchId')">
<user-input v-model="form.mchId" placeholder="请选择商户"/>
</form-col>
<form-col :span="span" label="等级名称" prop="name">
<el-input v-model="form.name" placeholder="请输入等级名称" maxlength="30" show-word-limit/>
</form-col>
<form-col :span="span" label="状态" prop="status">
<el-radio-group v-model="form.status">
<el-radio v-for="item in dict.type.vip_level_status" :key="item.value" :label="item.value">
{{item.label}}
</el-radio>
</el-radio-group>
</form-col>
<form-col :span="span" label="折扣" prop="discount">
<el-input-number v-model="form.discount" placeholder="请输入折扣" :min="0" :max="10" style="width: calc(100% - 2em)" controls-position="right"/> 折
</form-col>
<form-col :span="24" label="描述" prop="description">
<el-input v-model="form.description" type="textarea" placeholder="请输入内容" maxlength="1000" show-word-limit/>
</form-col>
<form-col :span="24" label="可用店铺" prop="storeIds">
<store-input v-model="form.storeIds" placeholder="请选择店铺" multiple :query="storeQuery"/>
</form-col>
<!--TODO 定价-->
<form-col :span="24" label="定价" prop="skuList">
<div class="sku-list">
<el-table :data="form.skuList" style="width: 100%" border>
<table-form-col
label="单价"
prop="price"
prop-prefix="skuList"
required
:rules="[
{ required: true, message: '请输入单价' },
]">
<template #default="{row}">
<el-input-number
v-model="row.price"
:min="0"
:precision="2"
:controls-position="'right'"
placeholder="请输入单价"
style="width: 100%"/>
</template>
</table-form-col>
<table-form-col
label="时长(天)"
prop="time"
prop-prefix="skuList"
required
:rules="[
{ required: true, message: '请输入时长' },
]">
<template #default="{row}">
<el-input-number
v-model="row.time"
:min="1"
:precision="0"
:controls-position="'right'"
placeholder="请输入时长"
style="width: 100%"/>
</template>
</table-form-col>
<el-table-column label="操作" align="center" width="100">
<template #header>
<el-button type="text" size="mini" icon="el-icon-plus" @click="handleAddSku">新增定价</el-button>
</template>
<template slot-scope="scope">
<el-button
type="text"
size="mini"
icon="el-icon-delete"
@click="handleDeleteSku(scope.$index)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
</form-col>
</el-row>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
import UserInput from '@/components/Business/SmUser/UserInput.vue'
import StoreInput from '@/components/Business/Store/StoreInput.vue'
import VipLevelInput from '@/components/Business/VipLevel/VipLevelInput.vue'
import TableFormCol from '@/components/TableFormCol/index.vue'
import { $editDialog, $showColumns } from '@/utils/mixins'
import { addVipLevel, getVipLevel, updateVipLevel } from '@/api/ss/vipLevel'
import { VipLevelStatus } from '@/utils/constants'
import FormCol from '@/components/FormCol/index.vue'
export default {
name: "VipLevelEditDialog",
mixins: [$editDialog, $showColumns],
dicts: ['vip_level_status'],
components: { VipLevelInput, StoreInput, UserInput, FormCol, TableFormCol },
props: {
rules: {
type: Object,
default: () => ({
mchId: [
{ required: true, message: "商户不能为空", trigger: "change" }
],
name: [
{ required: true, message: "等级名称不能为空", trigger: "blur" }
],
status: [
{ required: true, message: "状态不能为空", trigger: "change" }
],
discount: [
{ required: true, message: "折扣不能为空", trigger: "blur" }
],
storeIds: [
{ required: true, type: 'array', message: "可用店铺不能为空", trigger: "blur" }
],
skuList: [
{ required: true, type: 'array', message: "定价不能为空", trigger: "blur" },
]
})
},
getApi: {
type: Function,
default: getVipLevel
},
addApi: {
type: Function,
default: addVipLevel
},
updateApi: {
type: Function,
default: updateVipLevel
}
},
data() {
return {
form: {},
title: null,
loading: false,
span: 12,
submitLoading: false
}
},
computed: {
storeQuery() {
return {
userId: this.form.mchId
}
}
},
methods: {
getDetail() {
this.loading = true;
this.getApi(this.id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改会员等级";
}).finally(() => {
this.loading = false;
});
},
// 表单重置
reset() {
this.title = "新增会员等级";
this.form = {
id: null,
mchId: null,
name: null,
discount: null,
createTime: null,
description: null,
price: null,
time: null,
status: VipLevelStatus.ENABLED,
storeIds: [],
skuList: []
};
this.resetForm("form");
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
this.submitLoading = true;
this.updateApi(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.$emit('success')
}).finally(() => {
this.submitLoading = false;
});
} else {
this.submitLoading = true;
this.addApi(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.$emit('success')
}).finally(() => {
this.submitLoading = false;
});
}
}
});
},
/** 新增定价 */
handleAddSku() {
this.form.skuList.push({
price: undefined,
time: undefined
});
},
/** 删除定价 */
handleDeleteSku(index) {
this.form.skuList.splice(index, 1);
},
}
}
</script>
<style lang="scss" scoped>
.sku-list {
&__header {
margin-bottom: 10px;
}
}
</style>

5
src/views/ss/vipLevel/components/VipLevelTable.vue
View File

@ -52,9 +52,6 @@
<template v-else-if="column.key === 'discount'">
{{d.row.discount | dv}} 折
</template>
<template v-else-if="column.key === 'status'">
<dict-tag :options="dict.type.vip_level_status" :value="d.row.status"/>
</template>
<template v-else-if="column.key === 'storeIds'">
<el-tag v-for="store in d.row.storeList" :key="store.storeId" type="primary">{{store.name}}</el-tag>
</template>
@ -94,7 +91,6 @@ const defaultSort = {
export default {
name: 'VipLevelTable',
mixins: [$showColumns],
dicts: ['vip_level_status'],
components: { UserLink },
props: {
listApi: {
@ -109,7 +105,6 @@ export default {
{key: 'id', visible: true, label: 'ID', minWidth: null, sortable: true, overflow: false, align: 'center', width: "80"},
{key: 'mchName', visible: true, label: '商户', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'name', visible: true, label: '等级名称', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'status', visible: true, label: '状态', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'discount', visible: true, label: '折扣', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},
{key: 'description', visible: true, label: '描述文本', minWidth: null, sortable: true, overflow: true, align: 'center', width: null},
{key: 'storeIds', visible: true, label: '可用店铺', minWidth: null, sortable: true, overflow: false, align: 'center', width: null},

287
src/views/ss/vipLevel/edit/index.vue Normal file
View File

@ -0,0 +1,287 @@
<template>
<el-dialog :title="title" :visible.sync="open" width="1400px" append-to-body @open="onOpen">
<el-form ref="form" :model="form" :rules="rules" label-width="80px" v-loading="loading">
<el-row :gutter="8">
<form-col :span="span" label="商户" prop="mchId" v-if="visibleColumn('mchId')">
<user-input v-model="form.mchId" placeholder="请选择商户" :query="mchQuery"/>
</form-col>
<form-col :span="span" label="等级名称" prop="name">
<el-input v-model="form.name" placeholder="请输入等级名称" maxlength="30" show-word-limit/>
</form-col>
<form-col :span="span" label="折扣" prop="discount">
<el-input-number v-model="form.discount" placeholder="请输入折扣" :min="0" :max="10" style="width: calc(100% - 2em)" controls-position="right"/> 折
</form-col>
<form-col :span="24" label="描述" prop="description">
<el-input v-model="form.description" type="textarea" placeholder="请输入内容" maxlength="1000" show-word-limit/>
</form-col>
<form-col :span="24" label="可用店铺" prop="storeIds">
<store-input v-model="form.storeIds" placeholder="请选择店铺" multiple :query="storeQuery" :before-open="beforeOpenStore"/>
</form-col>
</el-row>
<el-tabs>
<el-tab-pane label="会员定价">
<form-col :span="24" label-width="0" prop="skuList">
<div class="sku-list">
<el-table :data="form.skuList" style="width: 100%" border size="mini">
<table-form-col label="名称" prop="name"prop-prefix="skuList" required :rules="[{ required: true, message: '请输入名称' },]">
<template #default="{row}">
<el-input
v-model="row.name"
placeholder="请输入名称"
style="width: 100%"/>
</template>
</table-form-col>
<table-form-col label="单价" prop="price"prop-prefix="skuList" required :rules="[{ required: true, message: '请输入单价' },]">
<template #default="{row}">
<el-input-number
v-model="row.price"
:min="0"
:precision="2"
:controls-position="'right'"
placeholder="请输入单价"
style="width: 100%"/>
</template>
</table-form-col>
<table-form-col label="原价" prop="originalPrice" prop-prefix="skuList" >
<template #default="{row}">
<el-input-number
v-model="row.originalPrice"
:min="0"
:precision="2"
:controls-position="'right'"
placeholder="请输入原价"
style="width: 100%"/>
</template>
</table-form-col>
<table-form-col label="时长(天)" prop="time" prop-prefix="skuList" required :rules="[{ required: true, message: '请输入时长' },]">
<template #default="{row}">
<el-input-number
v-model="row.time"
:min="1"
:precision="0"
:controls-position="'right'"
placeholder="请输入时长"
style="width: 100%"/>
</template>
</table-form-col>
<table-form-col label="状态" prop="status" prop-prefix="skuList" required :rules="[{ required: true, message: '请选择状态' },]">
<template #default="{row}">
<el-select v-model="row.status" placeholder="请选择状态" style="width: 100%">
<el-option v-for="item in dict.type.vip_level_sku_status" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</template>
</table-form-col>
<table-form-col label="使用限制" prop="limitType" prop-prefix="skuList" required :rules="[{ required: true, message: '请选择限制类型' },]"
tips="限制使用周期：自然周为每周一重置；30天为从使用开始的时候算起，30天后重置。"
>
<template #default="{row}">
<el-select v-model="row.limitType" placeholder="请选择限制类型" style="width: 100%">
<el-option v-for="item in dict.type.vip_level_sku_limit_type" :key="item.value" :label="item.label" :value="item.value"/>
</el-select>
</template>
</table-form-col>
</table-form-col>
<table-form-col label="限制次数" prop="limitCount" prop-prefix="skuList" tips="在限制周期内允许使用会员的次数">
<template #default="{row}">
<el-input-number v-model="row.limitCount" placeholder="请输入限制次数" style="width: 100%" :step="1" :min="0" step-sticky controls-position="right"/>
</template>
</table-form-col>
<table-form-col label="描述" prop="description" prop-prefix="skuList">
<template #default="{row}">
<el-input
v-model="row.description"
placeholder="请输入描述"
style="width: 100%"/>
</template>
</table-form-col>
<el-table-column label="操作" align="center" width="100">
<template #header>
<el-button type="text" size="mini" icon="el-icon-plus" @click="handleAddSku">新增定价</el-button>
</template>
<template slot-scope="scope">
<el-button
type="text"
size="mini"
icon="el-icon-delete"
@click="handleDeleteSku(scope.$index)">删除</el-button>
</template>
</el-table-column>
</el-table>
</div>
</form-col>
</el-tab-pane>
</el-tabs>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</template>
<script>
import UserInput from '@/components/Business/SmUser/UserInput.vue'
import StoreInput from '@/components/Business/Store/StoreInput.vue'
import VipLevelInput from '@/components/Business/VipLevel/VipLevelInput.vue'
import TableFormCol from '@/components/TableFormCol/index.vue'
import { $editDialog, $showColumns } from '@/utils/mixins'
import { addVipLevel, getVipLevel, updateVipLevel } from '@/api/ss/vipLevel'
import { SmUserType, VipLevelSkuStatus, VipLevelSkuLimitType } from '@/utils/constants'
import FormCol from '@/components/FormCol/index.vue'
export default {
name: "VipLevelEditDialog",
mixins: [$editDialog, $showColumns],
dicts: ['vip_level_sku_status', 'vip_level_sku_limit_type'],
components: { VipLevelInput, StoreInput, UserInput, FormCol, TableFormCol },
props: {
rules: {
type: Object,
default: () => ({
mchId: [
{ required: true, message: "商户不能为空", trigger: "change" }
],
name: [
{ required: true, message: "等级名称不能为空", trigger: "blur" }
],
status: [
{ required: true, message: "状态不能为空", trigger: "change" }
],
discount: [
{ required: true, message: "折扣不能为空", trigger: "blur" }
],
storeIds: [
{ required: true, type: 'array', message: "可用店铺不能为空", trigger: "blur" }
],
skuList: [
{ required: true, type: 'array', message: "定价不能为空", trigger: "blur" },
]
})
},
getApi: {
type: Function,
default: getVipLevel
},
addApi: {
type: Function,
default: addVipLevel
},
updateApi: {
type: Function,
default: updateVipLevel
}
},
data() {
return {
form: {},
title: null,
loading: false,
span: 8,
submitLoading: false
}
},
computed: {
storeQuery() {
return {
userId: this.form.mchId
}
},
mchQuery() {
return {
types: [SmUserType.MCH, SmUserType.AGENT]
}
}
},
methods: {
beforeOpenStore() {
if (this.form.mchId == null) {
this.$modal.msgError("请先选择商户");
return false;
}
return true;
},
getDetail() {
this.loading = true;
this.getApi(this.id).then(response => {
this.form = response.data;
this.open = true;
this.title = "修改会员等级";
}).finally(() => {
this.loading = false;
});
},
// 表单重置
reset() {
this.title = "新增会员等级";
this.form = {
id: null,
mchId: null,
name: null,
discount: null,
createTime: null,
description: null,
price: null,
time: null,
storeIds: [],
skuList: []
};
this.resetForm("form");
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
if (this.form.id != null) {
this.submitLoading = true;
this.updateApi(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.$emit('success')
}).finally(() => {
this.submitLoading = false;
});
} else {
this.submitLoading = true;
this.addApi(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.$emit('success')
}).finally(() => {
this.submitLoading = false;
});
}
}
});
},
/** 新增定价 */
handleAddSku() {
this.form.skuList.push({
name: null,
price: null,
originalPrice: null,
time: null,
description: null,
status: VipLevelSkuStatus.ENABLED,
limitType: VipLevelSkuLimitType.NONE,
limitCount: null
});
},
/** 删除定价 */
handleDeleteSku(index) {
this.form.skuList.splice(index, 1);
},
}
}
</script>
<style lang="scss" scoped>
.sku-list {
&__header {
margin-bottom: 10px;
}
}
</style>

2
src/views/ss/vipLevel/index.vue
View File

@ -61,7 +61,7 @@
import { delVipLevel } from "@/api/ss/vipLevel";
import { $showColumns } from '@/utils/mixins';
import UserLink from '@/components/Business/SmUser/UserLink.vue'
import VipLevelEditDialog from '@/views/ss/vipLevel/components/VipLevelEditDialog.vue'
import VipLevelEditDialog from '@/views/ss/vipLevel/edit/index.vue'
import VipLevelTable from '@/views/ss/vipLevel/components/VipLevelTable.vue'
import { isEmpty } from '@/utils'