elink-star
/
epmet-work-pc
13
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

服务事项分类(新增功能)-对应公共服务二级

V1.0
mk 3 years ago
parent
4fe0f810ed
commit
fc91630bd4
1 changed files with 284 additions and 243 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 527
      src/views/modules/workSys/serviceMattersComponents/addForm.vue

527
src/views/modules/workSys/serviceMattersComponents/addForm.vue
View File

@ -1,48 +1,70 @@
<template>
<el-dialog :visible.sync="dialogVisible" width="800px" :before-close="handleCancle">
<span slot="title">
<span v-if="pageType=='add'">新增</span>
<span v-if="pageType=='edit'">修改</span>
<span v-if="pageType=='view'">查看</span>
</span>
<div>
<el-form :model="formData" ref="form" :rules="dataRule" :label-width="'120px'">
<el-form-item label="分类名称" prop="categoryName">
<el-input v-model="formData.categoryName" class="u-item-width-normal" size="small" clearable placeholder="请输入"></el-input>
</el-form-item>
<el-dialog
:visible.sync="dialogVisible"
width="800px"
:before-close="handleCancle"
>
<span slot="title">
<span v-if="pageType == 'add'">新增</span>
<span v-if="pageType == 'edit'">修改</span>
<span v-if="pageType == 'view'">查看</span>
</span>
<div>
<el-form
:model="formData"
ref="form"
:rules="dataRule"
:label-width="'120px'"
>
<el-form-item label="分类名称" prop="categoryName">
<el-input
v-model="formData.categoryName"
class="u-item-width-normal"
size="small"
clearable
placeholder="请输入"
></el-input>
</el-form-item>
<!-- <el-form-item label="奖励积分" prop="awardPoint">
<!-- <el-form-item label="奖励积分" prop="awardPoint">
<el-input-number v-model="formData.awardPoint" class="u-item-width-normal" size="small" clearable placeholder="请输入"></el-input-number>
</el-form-item> -->
<el-form-item label="对应个性需求" prop="demandList">
<el-cascader ref="cascaderItem1" :options="demandOptions" :props="props1" v-model="formData.demandList1" @change="handleAreaChange1" clearable></el-cascader>
</el-form-item>
<el-form-item label="对应公共服务" prop="commonServiceTypeList">
<el-cascader
ref="cascaderItem2"
:options="commonServiceTypeOptions"
:props="props2"
v-model="formData.commonServiceTypeList1"
@change="handleAreaChange2"
clearable
></el-cascader>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleCancle">取 消</el-button>
<el-button type="primary" @click="handleComfirm">确 定</el-button>
</span>
</el-dialog>
<el-form-item label="对应个性需求" prop="demandList">
<el-cascader
ref="cascaderItem1"
:options="demandOptions"
:props="props1"
v-model="formData.demandList1"
@change="handleAreaChange1"
clearable
></el-cascader>
</el-form-item>
<el-form-item label="对应公共服务" prop="commonServiceTypeList">
<el-cascader
ref="cascaderItem2"
:options="commonServiceTypeOptions"
:props="props2"
v-model="formData.commonServiceTypeList1"
@change="handleAreaChange2"
clearable
></el-cascader>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleCancle">取 消</el-button>
<el-button type="primary" @click="handleComfirm">确 定</el-button>
</span>
</el-dialog>
</template>
<script>
import { isMobile } from '@/utils/validate';
import { mapGetters } from 'vuex';
import { Loading } from 'element-ui'; // 引入Loading服务
import { requestPost, requestGet } from '@/js/dai/request';
import daiMap from '@/utils/dai-map';
import nextTick from 'dai-js/tools/nextTick';
import { isMobile } from "@/utils/validate";
import { mapGetters } from "vuex";
import { Loading } from "element-ui"; // 引入Loading服务
import { requestPost, requestGet } from "@/js/dai/request";
import daiMap from "@/utils/dai-map";
import nextTick from "dai-js/tools/nextTick";
let loading; // 加载动画
let map;
@ -52,220 +74,239 @@ var infoWindowList;
var geocoder; // 新建一个正逆地址解析类
export default {
props: {
detailId: {
type: String,
default: ''
},
props: {
detailId: {
type: String,
default: "",
},
dialogVisible: {
type: Boolean,
default: ''
},
pageType: {
type: String,
default: ''
}
},
dialogVisible: {
type: Boolean,
default: "",
},
pageType: {
type: String,
default: "",
},
},
data() {
return {
props1: { multiple: true, value: 'value', label: 'label', children: 'children' },
props2: {
value: 'id',
label: 'name',
children: 'childList',
multiple: true
},
categoryCodeArr: {},
demandOptions: [],
commonServiceTypeOptions: [],
index: -1, //判断这个是arr中的第几个
arr: ['育龄妇女', '老年人', '空巢老人', '独居老人', '租户', '残疾', '大病', '慢病'],
btnDisable: false,
user: '',
agencyId: '',
marryList: [{ value: '-1', label: '不限制' }, { value: '0', label: '未婚' }, { value: '1', label: '已婚' }],
list: {},
formData: {
// awardPoint: '',
categoryId: '',
categoryName: '',
demandList1: [],
commonServiceTypeList1: [],
demandList: [],
commonServiceTypeList: []
},
dataRule: {
categoryName: [{ required: true, message: '分类名称不能为空', trigger: 'bulr' }],
// awardPoint: [{ required: true, message: '奖励积分不能为空', trigger: 'bulr' }],
// demandList: [{ required: true, message: '对应个性需求不能为空', trigger: 'blur' }],
// commonServiceTypeList: [{ required: true, message: '对应公共服务不能为空', trigger: 'bulr' }]
}
};
},
watch: {},
data() {
return {
props1: {
multiple: true,
value: "value",
label: "label",
children: "children",
},
props2: {
value: "id",
label: "name",
children: "childrenList",
multiple: true,
},
categoryCodeArr: {},
demandOptions: [],
commonServiceTypeOptions: [],
index: -1, //判断这个是arr中的第几个
arr: [
"育龄妇女",
"老年人",
"空巢老人",
"独居老人",
"租户",
"残疾",
"大病",
"慢病",
],
btnDisable: false,
user: "",
agencyId: "",
marryList: [
{ value: "-1", label: "不限制" },
{ value: "0", label: "未婚" },
{ value: "1", label: "已婚" },
],
list: {},
formData: {
// awardPoint: '',
categoryId: "",
categoryName: "",
demandList1: [],
commonServiceTypeList1: [],
demandList: [],
commonServiceTypeList: [],
},
dataRule: {
categoryName: [
{ required: true, message: "分类名称不能为空", trigger: "bulr" },
],
// awardPoint: [{ required: true, message: '奖励积分不能为空', trigger: 'bulr' }],
// demandList: [{ required: true, message: '对应个性需求不能为空', trigger: 'blur' }],
// commonServiceTypeList: [{ required: true, message: '对应公共服务不能为空', trigger: 'bulr' }]
},
};
},
watch: {},
created() {},
async mounted() {
this.user = this.$store.state.user;
this.agencyId = this.user.agencyId;
this.startLoading();
if (this.pageType == 'edit') {
this.getDetail();
}
this.getDemandOptions();
this.getCommonServiceTypeOptions();
await this.endLoading();
this.endLoading();
},
created() {},
async mounted() {
this.user = this.$store.state.user;
this.agencyId = this.user.agencyId;
this.startLoading();
if (this.pageType == "edit") {
this.getDetail();
}
this.getDemandOptions();
this.getCommonServiceTypeOptions();
await this.endLoading();
this.endLoading();
},
methods: {
handleAreaChange1(data) {
let that = this;
let demandList = [];
const obj = this.$refs['cascaderItem1'].getCheckedNodes();
//标签上定义的 ref值
obj.forEach(item => {
if (item.data.pvalue != '0') {
let obj2 = {
demandCategoryId: item.data.id,
demandCategoryCode: item.data.value,
demandParentCode: item.data.pvalue
};
demandList.push(obj2);
}
});
that.formData.demandList = [...demandList];
},
handleAreaChange2(data) {
let that = this;
let commonServiceTypeList = [];
const obj = this.$refs['cascaderItem2'].getCheckedNodes();
//标签上定义的 ref值
obj.forEach(item => {
let obj2 = {
commonServiceTypeId: item.data.id,
commonServiceTypePid: item.data.pid
};
commonServiceTypeList.push(obj2);
});
that.formData.commonServiceTypeList = [...commonServiceTypeList];
},
methods: {
handleAreaChange1(data) {
let that = this;
let demandList = [];
const obj = this.$refs["cascaderItem1"].getCheckedNodes();
//标签上定义的 ref值
obj.forEach((item) => {
if (item.data.pvalue != "0") {
let obj2 = {
demandCategoryId: item.data.id,
demandCategoryCode: item.data.value,
demandParentCode: item.data.pvalue,
};
demandList.push(obj2);
}
});
that.formData.demandList = [...demandList];
},
handleAreaChange2(data) {
let that = this;
let commonServiceTypeList = [];
const obj = this.$refs["cascaderItem2"].getCheckedNodes();
//标签上定义的 ref值
obj.forEach((item) => {
let obj2 = {
commonServiceTypeId: item.data.id,
commonServiceTypePid: item.data.pid,
};
commonServiceTypeList.push(obj2);
});
that.formData.commonServiceTypeList = [...commonServiceTypeList];
},
getTreeData(data) {
if (!Array.isArray(data)) return [];
let arr = data.map((item) => {
let _item = {};
if (item.children) {
if (item.children.length === 0)
_item = { ...item, children: undefined };
else _item = { ...item, children: this.getTreeData(item.children) };
} else {
_item = { ...item };
}
return _item;
});
return arr;
},
getTreeData(data) {
if (!Array.isArray(data)) return [];
let arr = data.map(item => {
let _item = {};
if (item.children) {
if (item.children.length === 0) _item = { ...item, children: undefined };
else _item = { ...item, children: this.getTreeData(item.children) };
} else {
_item = { ...item };
}
return _item;
});
return arr;
},
async getDemandOptions() {
const url = `/governance/icresidemanddict/demandoption`;
const { data, code, msg } = await requestPost(url);
if (code === 0) {
console.log("this.demandOptions", data);
this.demandOptions = this.getTreeData(data);
// console.log("this.demandOptions",this.demandOptions)
} else {
this.$message.error(msg);
}
},
async getDemandOptions() {
const url = `/governance/icresidemanddict/demandoption`;
const { data, code, msg } = await requestPost(url);
if (code === 0) {
console.log('this.demandOptions', data);
this.demandOptions = this.getTreeData(data);
// console.log("this.demandOptions",this.demandOptions)
} else {
this.$message.error(msg);
}
},
async getCommonServiceTypeOptions() {
const url = `/governance/commonServiceType/treeList`;
const { data, code, msg } = await requestGet(url);
if (code === 0) {
this.commonServiceTypeOptions = data;
} else {
this.$message.error(msg);
}
},
async getDetail() {
const url = `/actual/base/serviceitem/detail/${this.detailId}`;
const { data, code, msg } = await requestPost(url);
if (code === 0) {
console.log("详情数据", data);
this.formData = { ...data };
this.fenxiData();
this.index = this.arr.indexOf(this.formData.categoryName);
} else {
this.$message.error(msg);
}
},
fenxiData() {
let that = this;
let commonServiceTypeList1 = [];
let demandList1 = [];
this.formData.commonServiceTypeList.forEach((item) => {
let arr = [item.commonServiceTypePid, item.commonServiceTypeId];
commonServiceTypeList1.push(arr);
});
this.formData.demandList.forEach((item) => {
console.log(item);
let arr2 = [item.demandParentCode, item.demandCategoryCode];
demandList1.push(arr2);
});
this.formData.commonServiceTypeList1 = [...commonServiceTypeList1];
this.formData.demandList1 = [...demandList1];
},
handleComfirm() {
this.save();
},
async getCommonServiceTypeOptions() {
const url = `/governance/commonServiceType/selectList/0`;
const { data, code, msg } = await requestGet(url);
if (code === 0) {
this.commonServiceTypeOptions = data;
} else {
this.$message.error(msg);
}
},
async getDetail() {
const url = `/actual/base/serviceitem/detail/${this.detailId}`;
const { data, code, msg } = await requestPost(url);
if (code === 0) {
console.log('详情数据', data);
this.formData = { ...data };
this.fenxiData();
this.index = this.arr.indexOf(this.formData.categoryName);
} else {
this.$message.error(msg);
}
},
fenxiData() {
let that = this;
let commonServiceTypeList1 = [];
let demandList1 = [];
this.formData.commonServiceTypeList.forEach((item, index) => {
let arr = [item.commonServiceTypeId];
commonServiceTypeList1.push(arr);
});
this.formData.demandList.forEach(item => {
console.log(item);
let arr2 = [item.demandParentCode, item.demandCategoryCode];
demandList1.push(arr2);
});
this.formData.commonServiceTypeList1 = [...commonServiceTypeList1];
this.formData.demandList1 = [...demandList1];
},
handleComfirm() {
this.save();
},
async save() {
let form = this.formData;
this.handleAreaChange1();
this.handleAreaChange2();
console.log('this.formData', this.formData);
const url = '/actual/base/serviceitem/saveorupdate';
var params = {};
params = { ...this.formData };
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
this.$message.success('操作成功');
this.handleCancle();
} else if (code >= 8000) {
this.$message.error(msg);
}
},
handleCancle() {
// this.resetData();
this.$emit('handleClose');
},
resetData() {
this.$refs.form.resetFields();
},
// 开启加载动画
startLoading() {
loading = Loading.service({
lock: true, // 是否锁定
text: '正在加载……', // 加载中需要显示的文字
background: 'rgba(0,0,0,.7)' // 背景颜色
});
},
// 结束加载动画
endLoading() {
// clearTimeout(timer);
if (loading) {
loading.close();
}
} // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
}
async save() {
let form = this.formData;
this.handleAreaChange1();
this.handleAreaChange2();
console.log("this.formData", this.formData);
const url = "/actual/base/serviceitem/saveorupdate";
var params = {};
params = { ...this.formData };
const { data, code, msg } = await requestPost(url, params);
if (code === 0) {
this.$message.success("操作成功");
this.handleCancle();
} else if (code >= 8000) {
this.$message.error(msg);
}
},
handleCancle() {
// this.resetData();
this.$emit("handleClose");
},
resetData() {
this.$refs.form.resetFields();
},
// 开启加载动画
startLoading() {
loading = Loading.service({
lock: true, // 是否锁定
text: "正在加载……", // 加载中需要显示的文字
background: "rgba(0,0,0,.7)", // 背景颜色
});
},
// 结束加载动画
endLoading() {
// clearTimeout(timer);
if (loading) {
loading.close();
}
}, // 地图初始化函数，本例取名为init，开发者可根据实际情况定义
},
};
</script>
<style lang="scss" scoped>
@import '@/assets/scss/modules/management/form-main.scss';
@import '@/assets/scss/modules/management/form.scss';
@import '@/assets/scss/modules/visual/a_customize.scss';
@import "@/assets/scss/modules/management/form-main.scss";
@import "@/assets/scss/modules/management/form.scss";
@import "@/assets/scss/modules/visual/a_customize.scss";
</style>
Write Preview
Loading…
Cancel
Save