|
@@ -1,5 +1,5 @@
|
|
<template>
|
|
<template>
|
|
- <a-modal width="50%" v-model:visible="modelValue" @ok="handleOk" @cancel="handleCancel" title="套餐">
|
|
|
|
|
|
+ <a-modal width="55%" v-model:visible="modelValue" @ok="handleOk" @cancel="handleCancel" title="套餐">
|
|
<div class="add"><a-button type="primary" @click="addMeal">添加套餐</a-button></div>
|
|
<div class="add"><a-button type="primary" @click="addMeal">添加套餐</a-button></div>
|
|
<div class="item_warp">
|
|
<div class="item_warp">
|
|
<div v-for="(item, index) in wanberFloter">
|
|
<div v-for="(item, index) in wanberFloter">
|
|
@@ -9,14 +9,14 @@
|
|
</template>
|
|
</template>
|
|
<div class="Form">
|
|
<div class="Form">
|
|
<a-form :model="item" auto-label-width :rules="rules" ref="formRef">
|
|
<a-form :model="item" auto-label-width :rules="rules" ref="formRef">
|
|
- <a-form-item field="PackageTerm" label="套餐期限">
|
|
|
|
- <a-input v-model="item.PackageTerm" placeholder="请输入" />
|
|
|
|
|
|
+ <a-form-item field="period" label="套餐期限(月)" v-if="role.getRole == 1">
|
|
|
|
+ <a-input v-model="item.period" placeholder="请输入" />
|
|
</a-form-item>
|
|
</a-form-item>
|
|
- <a-form-item field="PackagePrice" label="套餐价格">
|
|
|
|
- <a-input v-model="item.PackagePrice" placeholder="请输入" />
|
|
|
|
|
|
+ <a-form-item field="price" label="套餐价格">
|
|
|
|
+ <a-input v-model="item.price" placeholder="请输入" />
|
|
</a-form-item>
|
|
</a-form-item>
|
|
- <a-form-item field="Pricing" label="币种">
|
|
|
|
- <a-select v-model="item.pricing" :style="{ width: '320px' }" placeholder="请选择币种">
|
|
|
|
|
|
+ <a-form-item field="currency" label="币种" v-if="role.getRole == 1">
|
|
|
|
+ <a-select v-model="item.currency" :style="{ width: '320px' }" placeholder="请选择币种">
|
|
<a-option v-for="res of Pricing" :value="res.value" :label="res.label" />
|
|
<a-option v-for="res of Pricing" :value="res.value" :label="res.label" />
|
|
</a-select>
|
|
</a-select>
|
|
</a-form-item>
|
|
</a-form-item>
|
|
@@ -31,36 +31,69 @@
|
|
<script setup>
|
|
<script setup>
|
|
import { ref, onMounted, toRefs, toRef, watch } from 'vue';
|
|
import { ref, onMounted, toRefs, toRef, watch } from 'vue';
|
|
import { Getdictionary } from '@/mixins/index.js'
|
|
import { Getdictionary } from '@/mixins/index.js'
|
|
|
|
+import { useSystemStore } from '@/store/modules/systemStore'
|
|
|
|
+import { Message } from '@arco-design/web-vue'
|
|
|
|
+import { addTariffPackage, CheckTariffPackages,UpdateTariffTtems } from '@/api/path/tariffManagement.api'
|
|
const props = defineProps({
|
|
const props = defineProps({
|
|
modelValue: {
|
|
modelValue: {
|
|
type: Boolean,
|
|
type: Boolean,
|
|
default: false
|
|
default: false
|
|
},
|
|
},
|
|
|
|
+ traffIds: {
|
|
|
|
+ type: [String, Number],
|
|
|
|
+ default: null
|
|
|
|
+ }
|
|
})
|
|
})
|
|
-
|
|
|
|
|
|
+const role = useSystemStore()
|
|
const modelValue = toRef(props, 'modelValue')
|
|
const modelValue = toRef(props, 'modelValue')
|
|
|
|
+const traffIds = toRef(props, 'traffIds')
|
|
|
|
+const indexSet = ref(0)
|
|
const emit = defineEmits(['update:modelValue', 'submit'])
|
|
const emit = defineEmits(['update:modelValue', 'submit'])
|
|
const rules = {
|
|
const rules = {
|
|
- PackageTerm: [{ required: true, trigger: 'change', }],
|
|
|
|
- PackagePrice: [{ required: true, trigger: 'change', }],
|
|
|
|
- pricing: [{ required: true, trigger: 'change', }],
|
|
|
|
|
|
+ period: [{ required: true, trigger: 'change', }],
|
|
|
|
+ price: [{ required: true, trigger: 'change', }],
|
|
|
|
+ currency: [{ required: true, trigger: 'change', }],
|
|
}
|
|
}
|
|
const state = ref({
|
|
const state = ref({
|
|
wanberFloter: [
|
|
wanberFloter: [
|
|
- { PackageTerm: '', PackagePrice: '', pricing: '' }
|
|
|
|
|
|
+ { id: '', period: '', price: '', currency: '' }
|
|
],
|
|
],
|
|
formRef: null,
|
|
formRef: null,
|
|
Pricing: []
|
|
Pricing: []
|
|
})
|
|
})
|
|
const { wanberFloter, formRef, Pricing } = toRefs(state.value)
|
|
const { wanberFloter, formRef, Pricing } = toRefs(state.value)
|
|
|
|
+// 添加套餐
|
|
const handleOk = () => {
|
|
const handleOk = () => {
|
|
- emit('update:modelValue', false)
|
|
|
|
|
|
+ if (indexSet.value === 0) {
|
|
|
|
+ // 添加
|
|
|
|
+ addTariffPackage({ tariffId: traffIds.value, list: wanberFloter.value }).then(res => {
|
|
|
|
+ if (res.code === 200) {
|
|
|
|
+ Message.success('添加成功')
|
|
|
|
+ emit('update:modelValue', false)
|
|
|
|
+ emit('submit', true)
|
|
|
|
+ handleCancel()
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ } else {
|
|
|
|
+ // 修改
|
|
|
|
+ UpdateTariffTtems(wanberFloter.value).then(res=>{
|
|
|
|
+ if(res.code === 200){
|
|
|
|
+ Message.success('修改成功')
|
|
|
|
+ emit('update:modelValue', false)
|
|
|
|
+ emit('submit', true)
|
|
|
|
+ handleCancel()
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ }
|
|
}
|
|
}
|
|
const handleCancel = () => {
|
|
const handleCancel = () => {
|
|
emit('update:modelValue', false)
|
|
emit('update:modelValue', false)
|
|
|
|
+ wanberFloter.value = [
|
|
|
|
+ { id: '', period: '', price: '', currency: '' }
|
|
|
|
+ ]
|
|
}
|
|
}
|
|
const addMeal = () => {
|
|
const addMeal = () => {
|
|
- wanberFloter.value.push({ PackageTerm: '', PackagePrice: '', SetSize: '' })
|
|
|
|
|
|
+ wanberFloter.value.push({ id: '', period: '', price: '', currency: '' })
|
|
}
|
|
}
|
|
const deletaMeal = (index) => {
|
|
const deletaMeal = (index) => {
|
|
if (wanberFloter.value.length !== 1) {
|
|
if (wanberFloter.value.length !== 1) {
|
|
@@ -72,6 +105,18 @@ const handeDict = async () => {
|
|
Pricing.value = await Getdictionary('currencyType')
|
|
Pricing.value = await Getdictionary('currencyType')
|
|
}
|
|
}
|
|
|
|
|
|
|
|
+watch(() => traffIds.value, val => {
|
|
|
|
+ if (!val) return
|
|
|
|
+ CheckTariffPackages({ tariffId: val }).then(res => {
|
|
|
|
+ if (res.code === 200) {
|
|
|
|
+ indexSet.value = res.data.length
|
|
|
|
+ if (res.data.length !== 0) {
|
|
|
|
+ wanberFloter.value = res.data
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+})
|
|
|
|
+
|
|
onMounted(() => {
|
|
onMounted(() => {
|
|
handeDict()
|
|
handeDict()
|
|
})
|
|
})
|
|
@@ -86,6 +131,7 @@ onMounted(() => {
|
|
margin-top: 20px;
|
|
margin-top: 20px;
|
|
display: flex;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
- gap: 15px;
|
|
|
|
|
|
+ gap: 10px;
|
|
|
|
+ justify-content: space-between;
|
|
}
|
|
}
|
|
</style>
|
|
</style>
|