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

新增兴趣爱好分类功能

V1.0
duanliangtao 2 years ago
parent
36415533d4
commit
9cc856e70c
2 changed files with 514 additions and 0 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. 202
      src/views/modules/workSys/hobbyItem.vue
  2. 312
      src/views/modules/workSys/hobbyItemsComponents/addForm.vue

202
src/views/modules/workSys/hobbyItem.vue
View File

@ -0,0 +1,202 @@
<template>
<div class="g-main">
<div>
<div class="m-table">
<div class="div_btn"><el-button size="small" type="primary " @click="handleAdd({}, 'add')">新增</el-button></div>
<el-table :data="tableData" border class="m-table-item" style="width: 100%" :height="maxTableHeight">
<!-- <el-table-column label="" fixed="left" type="selection" align="center" width="50" /> -->
<el-table-column label="序号" fixed="left" type="index" align="center" width="50" />
<el-table-column prop="categoryName" align="center" label="分类名称" :show-overflow-tooltip="true"></el-table-column>
<!-- <el-table-column prop="awardPoint" align="center" label="积分" :show-overflow-tooltip="true"></el-table-column> -->
<el-table-column prop="usableFlag" label="状态" min-width="140" align="center" :show-overflow-tooltip="true">
<template slot-scope="scope">
<span v-if="scope.row.usableFlag == '0'">禁用</span>
<span v-if="scope.row.usableFlag == '1'">启用</span>
</template>
</el-table-column>
<el-table-column fixed="right" label="操作" align="center" width="200">
<template slot-scope="scope">
<el-button @click="handleHid(scope.row)" type="text" size="small" v-if="scope.row.usableFlag == '1'" class="">禁用</el-button>
<el-button @click="handleHid(scope.row)" type="text" size="small" v-if="scope.row.usableFlag == '0'" class="">启用</el-button>
<el-button style="margin-right: 10px" @click="handleAdd(scope.row, 'edit')" size="small" type="text">修改</el-button>
<el-button style="margin-right: 10px" @click="handleDel(scope.row)" size="small" type="text">删除</el-button>
</template>
</el-table-column>
</el-table>
<div>
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page.sync="pageNo"
:page-sizes="[20, 50, 100, 200]"
:page-size="parseInt(pageSize)"
layout="sizes, prev, pager, next, total"
:total="total"
></el-pagination>
</div>
</div>
</div>
<addForm :detailId="detailId" :pageType="pageType" v-if="dialogVisible" :dialogVisible="dialogVisible" @handleClose="handleClose" />
</div>
</template>
<script>
import { requestPost } from '@/js/dai/request';
import nextTick from 'dai-js/tools/nextTick';
import { mapGetters } from 'vuex';
import addForm from './hobbyItemsComponents/addForm.vue';
import axios from 'axios';
export default {
data() {
return {
dialogVisible: false,
warnFlagList: [{ value: '0', label: '否' }, { value: '1', label: '是' }],
intelligentFlagList: [{ value: '0', label: '不开启' }, { value: '1', label: '开启' }],
disabled: false,
user: '',
agencyId: '',
formData: {},
customerId: '',
pageType: 'list', // 列表list 新增add 处理dispose 详情info
gridList: [], //所属网格list--场所区域
placeTypeList: [], //场所类型
tableData: [],
pageNo: 1,
pageSize: window.localStorage.getItem('pageSize') || 20,
total: 1,
detailId: '',
detailData: {},
multipleSelection: [],
rowObj: {},
importLoading: false
};
},
components: { addForm },
created() {},
computed: {
maxTableHeight() {
return this.$store.state.inIframe ? this.clientHeight - 410 + this.iframeHeigh : this.clientHeight - 410;
},
...mapGetters(['clientHeight', 'iframeHeight'])
},
watch: {},
mounted() {
this.user = this.$store.state.user;
this.agencyId = this.user.agencyId;
this.customerId = this.user.customerId;
console.log('this.customerId ', this.customerId);
this.getTableData();
},
methods: {
async handleDel(rowData) {
let message = '确认删除?';
this.$confirm(message, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
})
.then(() => {
this.del(rowData.categoryId);
})
.catch(err => {});
},
async del(id) {
const url = `/actual/base/hobbyitem/delete/${id}`;
const { data, code, msg } = await requestPost(url);
if (code === 0) {
this.$message.success('删除成功！');
this.getTableData();
} else {
this.$message.error('操作失败！');
}
},
handleAdd(row, type) {
if (row.categoryId) {
this.detailId = row.categoryId;
}
this.pageType = type;
this.dialogVisible = true;
},
async handleHid(row) {
let usableFlag = '';
if (row.usableFlag == '1') {
usableFlag = false;
} else {
usableFlag = true;
}
const url = '/actual/base/hobbyitem/updatestatus';
const param = {
categoryId: row.categoryId,
usableFlag: usableFlag
};
// const url = 'http://yapi.elinkservice.cn/mock/330/actual/base/enterprise/list';
const { pageSize, pageNo, formData } = this;
const { data, code, msg } = await requestPost(url, param);
if (code === 0) {
this.$message.success('操作成功');
this.getTableData();
} else {
this.$message.error(msg);
}
},
handleSearch(val) {
console.log(this.formData);
this.pageNo = 1;
this.getTableData();
},
handleClose() {
this.dialogVisible = false;
this.detailId = '';
this.getTableData();
},
async getTableData() {
const url = '/actual/base/hobbyitem/list';
// const url = 'http://yapi.elinkservice.cn/mock/330/actual/base/enterprise/list';
const { pageSize, pageNo, customerId } = this;
const { data, code, msg } = await requestPost(url, {
pageSize,
pageNo,
customerId
});
if (code === 0) {
this.total = data.total || 0;
this.tableData = data.list
? data.list.map(item => {
return item;
})
: [];
} else {
this.$message.error(msg);
}
},
handleSizeChange(val) {
this.pageSize = val;
window.localStorage.setItem('pageSize', val);
this.getTableData();
},
handleCurrentChange(val) {
this.pageNo = val;
this.getTableData();
},
resetSearch() {
this.formData = {
customerId
};
this.pageNo = 1;
this.getTableData();
}
}
};
</script>
<style lang="scss" scoped>
@import '@/assets/scss/modules/management/list-main.scss';
.m-search {
.u-item-width-normal {
width: 200px;
}
}
</style>

312
src/views/modules/workSys/hobbyItemsComponents/addForm.vue
View File

@ -0,0 +1,312 @@
<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-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>
</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";
let loading; // 加载动画
let map;
var search;
var markers;
var infoWindowList;
var geocoder; // 新建一个正逆地址解析类
export default {
props: {
detailId: {
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: "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();
},
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;
},
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/hobbyitem/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 save() {
let form = this.formData;
this.handleAreaChange1();
this.handleAreaChange2();
console.log("this.formData", this.formData);
const url = "/actual/base/hobbyitem/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";
</style>
Write Preview
Loading…
Cancel
Save