积分规则需求变更的开发

This commit is contained in:
yanran200730
2023-04-18 10:04:43 +08:00
parent 5b4443f41f
commit 9dd6790b2d
2 changed files with 136 additions and 21 deletions

View File

@@ -64,15 +64,32 @@
<el-input placeholder="请输入" v-model="form.integral" clearable/>
</el-form-item>
<el-form-item label="有效地区" prop="areaId" required>
<ai-area-select
<el-form-item label="有效地区" prop="girdName" required>
<!-- <ai-area-select
clearable
@fullname="v => form.areaName = v"
:disabled-level="$store.state.user.info.areaList.length"
always-show
:instance="instance"
v-model="form.areaId">
</ai-area-select>
</ai-area-select> -->
<ai-picker
:instance="instance"
dialogTitle="选择网格"
:ops="{label: 'girdName', id: 'girdCode'}"
pageTitle="网格"
:action="'/app/appgirdinfo/girdList?idType=1'"
v-model="girdList"
@pick="onPick">
<div class="AppAnnounceDetail-select">
<el-input size="small" class="AppAnnounceDetail-select__input" placeholder="请选择..." disabled v-model="form.girdName"></el-input>
<div class="select-left" v-if="girdList.length">
<span v-for="(item, index) in girdList" :key="index">{{ item.girdName }}</span>
</div>
<i v-if="!girdList.length">请选择</i>
<div class="select-right">{{ girdList.length ? '重新选择' : '选择' }}</div>
</div>
</ai-picker>
</el-form-item>
</el-form>
</div>
@@ -112,6 +129,7 @@
systemRuleId: "",
ruleName: ""
},
girdList: [],
systemRuleIdList: [],
page: {current: 1, size: 10, total: 0},
colConfigs: [
@@ -144,7 +162,7 @@
prop: "validRangeData",
label: "有效地区",
align: "center",
format: v => JSON.parse(v).areaName
format: v => JSON.parse(v).girdName
},
{
prop: "status",
@@ -163,10 +181,9 @@
scoringCycle: "",
numberLimit: "",
integral: "",
validRangeType: "2",
validRangeType: "1",
validRangeData: "",
areaName: '',
areaId: ''
girdName: ''
},
formRules: {
systemRuleId: [
@@ -179,8 +196,8 @@
{required: true, message: "请选择周期范围", trigger: "change"},
],
integral: [{required: true, validator: validcode, trigger: "blur"},],
areaId: [
{required: true, message: "请选择地区", trigger: "change"},
girdName: [
{required: true, message: "请选择网格", trigger: "change"},
],
},
rulesOps: [],
@@ -216,6 +233,16 @@
});
},
methods: {
onPick (e) {
if (e.length) {
this.form.girdName = e[0].girdName
} else {
this.form.girdName = ''
}
this.girdList = e
},
getList() {
this.instance
.post(`/app/appintegralrule/listByAppletFD`, null, {
@@ -233,7 +260,6 @@
},
change (e) {
console.log(this.dict.getDict('appIntegralApplyEventType'))
},
closed () {
this.form.ruleType = '0'
@@ -242,16 +268,16 @@
this.form.scoringCycle = ''
this.form.numberLimit = ''
this.form.integral = ''
this.form.validRangeType = '2'
this.form.validRangeType = '1'
this.form.validRangeData = ''
this.form.areaName = this.$store.state.user.info.areaName
this.form.areaId = this.$store.state.user.info.areaId
this.form.girdName = ''
this.girdList = []
},
toEdit(row) {
this.form = {...row}
if (this.form?.validRangeData) {
this.form.areaName = JSON.parse(this.form.validRangeData).areaName
this.form.areaId = JSON.parse(this.form.validRangeData).areaId
this.form.girdName = JSON.parse(this.form.validRangeData).girdName
this.girdList = JSON.parse(this.form.validRangeData)
}
this.$nextTick(() => {
this.dialog = true;
@@ -295,8 +321,9 @@
...formData,
appCodeType: '2',
validRangeData: JSON.stringify({
areaName: this.form.areaName,
areaId: this.form.areaId
girdId: this.girdList[0].girdId,
girdName: this.girdList[0].girdName,
girdCode: this.girdList[0].girdCode
})
})
.then((res) => {
@@ -412,6 +439,87 @@
// display: flex;
// }
.AppAnnounceDetail-select {
display: flex;
align-items: center;
min-height: 32px;
line-height: 1;
background: #F5F5F5;
border-radius: 4px;
border: 1px solid #D0D4DC;
cursor: pointer;
overflow: hidden;
transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
&:hover {
border-color: #26f;
}
& > i {
flex: 1;
height: 100%;
line-height: 32px;
padding: 0 12px;
color: #888888;
font-size: 14px;
font-style: normal;
border-right: 1px solid #D0D4DC;
background: #fff;
}
.AppAnnounceDetail-select__input {
position: absolute;
left: 0;
top: 0;
z-index: -1;
opacity: 0;
height: 100%;
}
.select-right {
height: 100%;
padding: 0 12px;
color: #222222;
font-size: 12px;
cursor: pointer;
transition: all ease 0.3s;
&:hover {
opacity: 0.5;
}
}
.select-left {
display: flex;
flex-wrap: wrap;
flex: 1;
padding: 5px 0 0px 12px;
border-right: 1px solid #D0D4DC;
border-radius: 4px 0 0 4px;
background: #fff;
em {
height: 22px;
line-height: 22px;
margin: 0 4px 5px 0;
color: #222222;
font-size: 12px;
font-style: normal;
}
span {
height: 22px;
line-height: 22px;
margin: 0 4px 5px 0;
padding: 0 8px;
font-size: 12px;
color: #222222;
background: #F3F4F7;
border-radius: 2px;
border: 1px solid #D0D4DC;
}
}
}
:deep( .ai-dialog ){
.el-cascader {
width: 100%;

View File

@@ -1,6 +1,15 @@
<template>
<section class="AiPicker">
<ai-dialog-btn v-bind="$attrs" @onConfirm="handleSave" :customFooter="false" @close="selected=[]" @open="selected=$copy(picked)">
<ai-dialog-btn
custom-class=""
v-bind="$attrs"
append-to-body
@onConfirm="handleSave"
:customFooter="false"
:modal-append-to-body="false"
:close-on-click-modal="false"
@close="selected=[]"
@open="selected=$copy(picked)">
<template #btn v-if="$scopedSlots.default">
<slot :selected="picked"/>
</template>
@@ -148,7 +157,6 @@ export default {
</script>
<style lang="scss" scoped>
.AiPicker {
.color-primary {
color: $primaryColor;
}
@@ -167,7 +175,7 @@ export default {
display: flex;
height: 480px;
:deep( .el-tree ){
.el-tree {
background: transparent;
.el-tree-node__content {
@@ -279,5 +287,4 @@ export default {
:deep(.overHide) {
overflow: hidden;
}
}
</style>