Skip to content

X
xzxt-qyxzpt-vue-report
Commit c0ebe0f1 by xue_wengang
Options

协作单位字典修改

parent fa636826
Showing with 555 additions and 54 deletions
src/components/lazy_treeCode_components_unit.vue 0 → 100644
<template>
<div>
<!--字典框 @emitValue="getLbValue"-->
<el-select :placeholder="curItem.placeholder"
v-model="curFormData[curItem.id]"
:class="curItem.code"
popper-class="zdyCodeDialog"
style="width: 100%"
@clear="clearSeleted"
@remove-tag="removeTag"
:popper-append-to-body="false"
:multiple="curItem.multiple"
:disabled="curItem.disabled"
empty-text="请从弹框中选择数据"
@focus="
(val, $event) =>
showCodeTreeDialog(val, curItem, curFormData, curItem.id)
"
clearable>
<el-option v-for="item2 in codeTreeConfig.fieldItem"
:key="item2.id"
:label="item2.label"
:value="item2.id">
</el-option>
</el-select>
<!--多级或多数据下拉框弹框样式-->
<el-dialog v-if="dialogCodeVisible"
custom-class="treeDialog"
:visible.sync="dialogCodeVisible"
style="z-index: 2020 !important"
:close-on-click-modal="false"
center>
<div slot="title"
class="header-title"
style="
text-align: left;
height: 30px;
font-size: 16px;
font-family: Microsoft YaHei;
font-weight: bold;
line-height: 30px;
opacity: 1;
">
<div>{{ codeTreeConfig.title }}</div>
</div>
<el-input placeholder="输入关键字进行过滤"
v-model="filterText"
style="
margin-bottom: 4px;
width: calc(100% - 26px) !important;
margin-left: 15px;
margin-top: 2px;
">
</el-input>
<div style="
width: calc(100% - 18px);
height: calc(100% - 42px);
overflow-y: auto;
border-bottom: 1px solid #f2f2f2;
margin-left: 7px;
"
v-loading="loading"
>
<el-tree :props="defaultProps"
node-key="id"
:filter-node-method="filterNode"
ref="codeTreeDialog"
:default-expanded-keys="defaultExpandedKeys"
:default-checked-keys="
Array.isArray(curFormData[curItem.id])
? curFormData[curItem.id]
: [...curFormData[curItem.id]]
"
@check="codeTreeNodeCheck"
@check-change="handleNodeClick"
:check-on-click-node="true"
lazy
:load="loadNode"
check-strictly
show-checkbox
style="height: 288px">
</el-tree>
</div>
<div slot="footer"
class="dialog-footer ar"
style="margin-top: 11px">
<el-button @click="dialogCodeVisible = false"
style="width: 120px; height: 36px">取 消</el-button>
<el-button type="primary"
@click="forSureSelectCode"
style="width: 120px; height: 36px">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import Http from "@/utils/http.js";
import url from "@/api/base";
export default {
name: "treeCode_components",
props: {
formData: Object,
currentItem: Object,
sendId: String,
},
data () {
return {
curFormData: this.formData,
curItem: this.currentItem,
defaultProps: {
parent: "parentId", // 父级唯一标识
value: "id", // 唯一标识
label: "label", // 标签显示
isLeaf: "leaf",
// children: 'children', // 子级
},
id: this.sendId,
filterText: "",
//多级或多数据下拉框弹框样式（数据量太多时使用这种风格 普通字典还用原来的下拉框）
dialogCodeVisible: false,
//树型字典配置
codeTreeConfig: {
//弹框标题
title: "案发地区划",
//值字段
nodeKey: "value",
//字典类型
codeType: "CODE_XZQH",
//绑定的model
realValue: null,
//当前要展示的字段
fieldItem: null,
//codeTree预设
props: [],
},
//默认展开的节点
defaultExpandedKeys: [],
loading:false
};
},
computed: {
newValue () {
this.getcode();
return this.curFormData[this.curItem.id];
},
},
watch: {
formData (val) {
this.curFormData = val;
},
filterText (val) {
this.$refs.codeTreeDialog.filter(val);
},
newValue (val) {
// if (val != '' && this.codeTreeConfig.fieldItem == null) {
if (val != "") {
var self = this;
//判断是否要回显
debugger
if (self.curFormData[self.curItem.id]) {
let parm = {
type: self.currentItem.codeTree,
id: self.curFormData[self.curItem.id],
grade: "prev",
};
debugger;
self.doQueryRequest(parm, "/queryQyxzCodeByType").then((codeResult) => {
var thisCodeOptions = [];
if (codeResult.data.code == 200) {
var codRes = codeResult.data.data.data;
var codeArry = [];
var realCodeResult = [];
for (var j = 0; j < codRes.length; j++) {
var singleRow = codRes[j];
if (singleRow.id == val) {
thisCodeOptions.push({
id: singleRow.id,
label: singleRow.label,
});
} else {
if (singleRow.children && singleRow.children.length > 0) {
var thisItem = self.getChildrenItem(val, singleRow);
if (thisItem) {
thisCodeOptions.push({
id: thisItem.id,
label: thisItem.label,
});
}
}
}
}
if (thisCodeOptions.length < 0) {
self.$emit("clearId");
}
debugger
self.codeTreeConfig.fieldItem = thisCodeOptions;
}
});
}
}
},
},
methods: {
getcode () {
var self = this;
if (self.curFormData[self.curItem.id]) {
let parm = {
type: self.currentItem.codeTree,
id: self.curFormData[self.curItem.id],
grade: "prev",
};
self.doQueryRequest(parm, "/queryQyxzCodeByType").then((codeResult) => {
var thisCodeOptions = [];
console.log(codeResult, 222222222);
self.loading = true
if (codeResult.data.code == 200) {
var codRes = codeResult.data.data.rows;
var codeArry = [];
var realCodeResult = [];
for (var j = 0; j < codRes.length; j++) {
var singleRow = codRes[j];
if (singleRow.id == self.curFormData[self.curItem.id]) {
thisCodeOptions.push({
id: singleRow.id,
label: singleRow.label,
});
} else {
if (singleRow.children && singleRow.children.length > 0) {
var thisItem = self.getChildrenItem(
self.curFormData[self.curItem.id],
singleRow
);
if (thisItem) {
thisCodeOptions.push({
id: thisItem.id,
label: thisItem.label,
});
}
}
}
}
if (thisCodeOptions.length == 0) {
self.$emit("clearId");
}
self.codeTreeConfig.fieldItem = thisCodeOptions;
}
self.loading = false
});
}
},
// 搜索树状数据中的 ID
queryTree (tree, id) {
let stark = [];
stark = stark.concat(tree);
while (stark.length) {
const temp = stark.shift();
if (temp[this.defaultProps.children]) {
stark = stark.concat(temp[this.defaultProps.children]);
}
if (temp[this.defaultProps.value] === id) {
return temp[this.defaultProps.label];
}
}
return "";
},
//多选模式下移除tag时触发
removeTag (val) {
let self = this,
label = "";
self.codeTreeConfig.fieldItem.splice(
self.codeTreeConfig.fieldItem.findIndex((item) => item.id === val),
1
);
if (self.codeTreeConfig.fieldItem.length != 0) {
self.codeTreeConfig.fieldItem.forEach((item, index) => {
label += index == 0 ? "" + item.label : "," + item.label;
});
} else {
label = "";
}
this.$emit("getDialogSeleted", label);
},
//可清空的单选模式下用户点击清空按钮时触发
clearSeleted () {
this.$emit("getDialogSeleted", "");
},
//确定选择当前用户
forSureSelectCode () {
var self = this;
var thisCodeOptions = [];
if (self.$refs.codeTreeDialog.getCheckedNodes().length != 0) {
if (self.curItem.multiple) {
self.$set(
self.codeTreeConfig.realFatherValue,
self.codeTreeConfig.realrValueKey,
self.$refs.codeTreeDialog.getCheckedKeys()
);
var selectedNodes = self.$refs.codeTreeDialog.getCheckedNodes();
for (var i = 0; i < selectedNodes.length; i++) {
thisCodeOptions.push({
id: self.$refs.codeTreeDialog.getCheckedNodes()[i].id,
label: self.$refs.codeTreeDialog.getCheckedNodes()[i].label,
});
}
} else {
self.$set(
self.codeTreeConfig.realFatherValue,
self.codeTreeConfig.realrValueKey,
self.$refs.codeTreeDialog.getCheckedNodes()[0].id
);
thisCodeOptions.push({
id: self.$refs.codeTreeDialog.getCheckedNodes()[0].id,
label: self.$refs.codeTreeDialog.getCheckedNodes()[0].label,
});
}
self.codeTreeConfig.fieldItem = thisCodeOptions;
if (self.codeTreeConfig.fieldItem.type == "codeTag") {
self.changeTags(
self.$refs.codeTreeDialog.getCheckedKeys(),
self.codeTreeConfig.fieldItem
);
}
self.$forceUpdate();
if (self.curItem.multiple) {
let label = "";
thisCodeOptions.forEach((item, index) => {
label += index == 0 ? "" + item.label : "," + item.label;
});
self.$emit("getDialogSeleted", label);
} else {
self.$emit("getDialogSeleted", thisCodeOptions[0].label);
}
} else {
//没有选值得情况
self.$set(
self.codeTreeConfig.realFatherValue,
self.codeTreeConfig.realrValueKey,
""
);
self.$forceUpdate();
self.$emit("getDialogSeleted", "");
}
self.dialogCodeVisible = false;
},
//对树节点进行筛选
filterNode (value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1 || data.id.indexOf(value) !== -1;
},
//树节点点击事件（改为点选）
handleNodeClick (data, checked) {
var self = this;
if (!self.curItem.multiple) {
if (checked === true) {
self.codeTreeConfig.codeId = data.id;
self.$refs.codeTreeDialog.setCheckedKeys([data.id]);
} else {
if (self.codeTreeConfig.codeId === data.id) {
self.$refs.codeTreeDialog.setCheckedKeys([]);
}
}
}
},
//树形字典节点点击事件（用来拦截并控制单选）
codeTreeNodeCheck (data, checked, node) {
console.log(data, checked, node);
},
/**
* 展示字典树弹出框
*/
showCodeTreeDialog (value, item, realFormLableAlign, realValueKey) {
var self = this;
//判断是否要回显
if (realFormLableAlign[realValueKey]) {
let parm = {
type: self.currentItem.codeTree,
id: realFormLableAlign[realValueKey],
grade: "prev",
};
self.doQueryRequest(parm, "/queryQyxzCodeByType").then((codeResult) => {
console.log(codeResult, 33333);
if (codeResult.data.code == 200) {
var codRes = codeResult.data.data.data;
var codeArry = [];
var realCodeResult = [];
for (var j = 0; j < codRes.length; j++) {
var singleRow = codRes[j];
if (singleRow.children && singleRow.children.length > 0) {
codeArry.push(singleRow.id);
self.getChildrenCode(codeArry, singleRow);
}
}
self.defaultExpandedKeys = codeArry;
}
});
}
if (value) {
self.filterText = "";
self.codeTreeConfig.nodeKey = "value";
self.codeTreeConfig.codeType = item.codeTree;
self.codeTreeConfig.codeId = "";
if (this.curFormData[this.curItem.id] == "") {
self.codeTreeConfig.fieldItem = item;
} else {
if (
self.codeTreeConfig.fieldItem == null ||
self.codeTreeConfig.fieldItem.length == 0 ||
self.codeTreeConfig.fieldItem == ""
) {
self.codeTreeConfig.fieldItem = item;
}
}
self.codeTreeConfig.realFatherValue = realFormLableAlign;
self.codeTreeConfig.realrValueKey = realValueKey;
//先设置一个默认空值
self.codeTreeConfig.realValue = realFormLableAlign[realValueKey];
self.codeTreeConfig.title = item.name;
//延迟加载使弹框的z-index值在el-select之上
setTimeout(() => {
self.dialogCodeVisible = true;
}, 10);
if (item.codeTree == "CODE_AJXZ_MA") {
if (realFormLableAlign["ajlbdm"]) {
self.codeTreeConfig.props = item.codeOptions.slice(0);
self.codeTreeConfig.props.forEach((item) => {
if (item.id == realFormLableAlign["ajlbdm"]) {
self.codeTreeConfig.props = item.children;
return false;
}
});
} else {
self.codeTreeConfig.props = [];
return;
}
} else {
self.codeTreeConfig.props = item.codeOptions;
}
}
},
/**
* 懒加载节点
*/
loadNode (currentNode, resolve) {
var self = this;
var cc = arguments;
let parm = {
type: self.currentItem.codeTree,
};
if (currentNode.level != 0) {
parm.id = currentNode.data.id;
parm.grade = "next";
}
debugger;
self.doQueryRequest(parm, "/queryQyxzCodeByType").then((codeResult) => {
console.log(codeResult, 55555555);
if (codeResult.data.code == 200) {
//判断是否有下级
// + "[" + realCodeItem.id + "]"
codeResult.data.data.rows.forEach((realCodeItem) => {
realCodeItem.label =
realCodeItem.label;
if (realCodeItem.parentFlag == "true") {
realCodeItem.leaf = false;
} else {
realCodeItem.leaf = true;
}
});
resolve(codeResult.data.data.rows);
}
});
},
doQueryRequest (form, relurl) {
var currentUrl = relurl ? relurl : this.cxUrl;
return Http({
url: url.alyIP + currentUrl,
data: form,
params: form,
method: "get",
headers: {
"blade-auth": sessionStorage.getItem("token"),
},
});
},
/**
* 获取子字典数据
*/
getChildrenCode (codeArry, singleRo) {
var self = this;
singleRo.children.forEach((childrenItem) => {
if (childrenItem.children && childrenItem.children.length > 0) {
codeArry.push(childrenItem.id);
self.getChildrenCode(codeArry, childrenItem);
}
});
},
/**
* 获取子字典数据item
*/
getChildrenItem (orgId, singleRo) {
var self = this;
var readyToReturn;
singleRo.children.forEach((childrenItem) => {
if (childrenItem.id == orgId) {
readyToReturn = childrenItem;
} else {
if (childrenItem.children.length > 0) {
readyToReturn = self.getChildrenItem(orgId, childrenItem);
}
}
});
return readyToReturn;
},
},
};
</script>
<style scoped lang="scss">
/deep/ .zdyCodeDialog {
opacity: 0;
}
/deep/ .treeDialog {
width: 680px;
height: 498px;
background: #ffffff;
box-shadow: 0px 8px 8px rgba(0, 0, 0, 0.1);
opacity: 1;
border-radius: 8px;
position: absolute;
top: 40%;
left: 50%;
margin-top: -223px !important;
margin-left: -340px;
z-index: 100;
.el-dialog__body {
height: 390px;
}
}
</style>
src/utils/zdList.js
......@@ -12,52 +12,6 @@ export const mixinsZd = {
let self = this;
/*获取字典*/
// // debugger;
self.propQueryField.forEach((val) => {
if (val.type == "codeTree" || val.type == "codeTreeDialog") {
if (val.codeOptions.length == 0) {
axios
.get(`JsonData/${val.codeTree}.json`)
.then((res) => {
console.log(res, 1111);
self.$set(val, "codeOptions", res.data.data.rows);
})
.catch((err) => {
console.log(err);
});
}
} else if (val.type == "codeTreeDialogs") {
let unitcode = JSON.parse(sessionStorage.getItem("userInfo")).unitcode;
let grade = JSON.parse(sessionStorage.getItem("userInfo")).grade;
if (grade == 'S' || grade == 'T') {
var newUnicode = unitcode.substring(0, 2) + '0000000000'
} else if (grade == 'D') {
var newUnicode = unitcode.substring(0, 4) + '00000000'
} else if (grade == 'X') {
var newUnicode = unitcode.substring(0, 6) + '000000'
} else if (grade == 'K') {
var newUnicode = unitcode.substring(0, 8) + '0000'
}
if (val.codeOptions.length == 0) {
axios
.get(`JsonData/${val.codeTree}.json`)
.then((res) => {
let dwList = res.data.data.rows.filter(item => item.id.includes(newUnicode.substring(0, 2)))
if (dwList.length > 0) {
let result
foreachTree(dwList, (item) => { if (item.id === newUnicode) result = item })
if (grade == 'S' || grade == 'T') {
self.$set(val, "codeOptions", dwList);
} else {
self.$set(val, "codeOptions", [result]);
}
}
})
.catch((err) => {
console.log(err);
});
}
}
});
self.propQueryFieldAjlb.forEach((val) => {
if (val.type == "codeTree" || val.type == "codeTreeDialog") {
if (val.codeOptions.length == 0) {
......
src/views/baxz/addBaxz.vue
......@@ -51,10 +51,11 @@
</el-form-item>
<el-form-item label="协作单位:"
prop="xzdwdm">
<select-tree-dialog v-for="item in propQueryField"
<lazy-select-tree-dialog-unit v-for="item in propQueryFieldUnit"
:key="item.id"
:placeholder="'请选择'"
:sendId="item.id"
@getDialogSeleted="getDialogSeleted"
:formData="form"
:currentItem="item" />
......@@ -227,10 +228,11 @@ import addMjInfo from "./components/addMjInfo.vue";
import addXyrInfo from "./components/addXyrInfo.vue";
import { mixinsZd } from '@/utils/zdList.js'
import LazySelectTreeDialog from "@c/lazy_treeCode_components.vue";
import LazySelectTreeDialogUnit from "@c/lazy_treeCode_components_unit.vue";
export default {
components: {
SelectTreeDialog, addMjInfo, addXyrInfo, LazySelectTreeDialog
SelectTreeDialog, addMjInfo, addXyrInfo, LazySelectTreeDialog,LazySelectTreeDialogUnit
},
data () {
......@@ -320,17 +322,18 @@ export default {
},],
//字典码
propQueryField: [{
propQueryFieldUnit: [{
name: "协作单位",
id: "xzdwdm",
props: "checkEmpty",
type: "codeTreeDialog",
type: "lazyCodeTreeDialogUnit",
readonly: false,
value: "",
placeholder: "请选择",
col: "3",
codeOptions: [],
codeTree: "CODE_UNIT",
},],
zdObj: {} // 厂商字典码对象
}
......
src/views/baxz/editBaxz.vue
......@@ -50,7 +50,7 @@
</el-form-item>
<el-form-item label="协作单位:"
prop="xzdwdm">
<select-tree-dialog v-for="item in propQueryField"
<lazy-select-tree-dialog-unit v-for="item in propQueryFieldUnit"
:key="item.id"
:placeholder="'请选择'"
:sendId="item.id"
......@@ -230,10 +230,11 @@ import addMjInfo from "./components/editMjInfo.vue";
import addXyrInfo from "./components/editXyrInfo.vue";
import { mixinsZd } from '@/utils/zdList.js'
import LazySelectTreeDialog from "@c/lazy_treeCode_components.vue";
import LazySelectTreeDialogUnit from "@c/lazy_treeCode_components_unit.vue";
export default {
components: {
SelectTreeDialog, addMjInfo, addXyrInfo, LazySelectTreeDialog
SelectTreeDialog, addMjInfo, addXyrInfo, LazySelectTreeDialog,LazySelectTreeDialogUnit
},
data () {
return {
......@@ -323,17 +324,18 @@ export default {
},],
//字典码
propQueryField: [{
propQueryFieldUnit: [{
name: "协作单位",
id: "xzdwdm",
props: "checkEmpty",
type: "codeTreeDialog",
type: "lazyCodeTreeDialogUnit",
readonly: false,
value: "",
placeholder: "请选择",
col: "3",
codeOptions: [],
codeTree: "CODE_UNIT",
},],
zdObj: {}, // 厂商字典码对象
baseInfoDetail: {},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment