Commit 4cff7545 by 陈宇

Replace rhzf.vue

parent cceb1843
...@@ -56,29 +56,16 @@ ...@@ -56,29 +56,16 @@
</div> </div>
<div class="form"> <div class="form">
<el-form <el-form label-position="right" :inline="true" :model="formInline" class="demo-form-inline" size="mini"
label-position="right" label-width="72px" ref="searchForm">
:inline="true"
:model="formInline"
class="demo-form-inline"
size="mini"
label-width="72px"
ref="searchForm"
>
<el-form-item label="姓 名:" class="col" prop="xm"> <el-form-item label="姓 名:" class="col" prop="xm">
<el-input v-model="formInline.xm" placeholder="姓名"></el-input> <el-input v-model="formInline.xm" placeholder="姓名"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="证件号码:" class="col" prop="zjhm"> <el-form-item label="证件号码:" class="col" prop="zjhm">
<el-input <el-input v-model="formInline.zjhm" placeholder="证件号码"></el-input>
v-model="formInline.zjhm"
placeholder="证件号码"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="房屋住址:" class="col" prop="fwdz"> <el-form-item label="房屋住址:" class="col" prop="fwdz">
<el-input <el-input v-model="formInline.fwdz" placeholder="房屋住址"></el-input>
v-model="formInline.fwdz"
placeholder="房屋住址"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="完成状态:" class="col" prop="rhzt"> <el-form-item label="完成状态:" class="col" prop="rhzt">
...@@ -112,31 +99,11 @@ ...@@ -112,31 +99,11 @@
</el-option> </el-option>
</el-select> --> </el-select> -->
<el-popover <el-popover placement="bottom" width="400" trigger="click" popper-class="popper">
placement="bottom" <el-tree show-checkbox :props="props2" ref="treenode" lazy :load="loadNodeRybq" node-key="bqCode "
width="400" :expand-on-click-node="true" :default-checked-keys="defaultChecked" :check-on-click-node="true"
trigger="click" :auto-expand-parent="true" @check-change="handleCheckChange" @check="handleCheck">
popper-class="popper" <span class="tree-node" slot-scope="{ data }" :title="data.name">
>
<el-tree
show-checkbox
:props="props2"
ref="treenode"
lazy
:load="loadNodeRybq"
node-key="bqCode "
:expand-on-click-node="true"
:default-checked-keys="defaultChecked"
:check-on-click-node="true"
:auto-expand-parent="true"
@check-change="handleCheckChange"
@check="handleCheck"
>
<span
class="tree-node"
slot-scope="{ data }"
:title="data.name"
>
<span>{{ data.name }}</span> <span>{{ data.name }}</span>
</span> </span>
</el-tree> </el-tree>
...@@ -147,6 +114,7 @@ ...@@ -147,6 +114,7 @@
{{ item.disabled ? "" : item.name }} {{ item.disabled ? "" : item.name }}
</span> </span>
</template> </template>
<template v-else> <template v-else>
<span>--请选择--</span> <span>--请选择--</span>
</template> </template>
...@@ -171,26 +139,10 @@ ...@@ -171,26 +139,10 @@
</el-form-item> --> </el-form-item> -->
<!-- 懒加载 --> <!-- 懒加载 -->
<el-form-item label="组织机构:" class="col" prop="zzjg"> <el-form-item label="组织机构:" class="col" prop="zzjg">
<el-popover <el-popover placement="bottom" width="400" trigger="click" popper-class="popper">
placement="bottom" <el-tree :props="props" ref="tree" lazy :load="loadNode" node-key="id" :expand-on-click-node="false"
width="400" @node-click="nodeClick">
trigger="click" <span class="tree-node" slot-scope="{ data }" :title="data.name">
popper-class="popper"
>
<el-tree
:props="props"
ref="tree"
lazy
:load="loadNode"
node-key="id"
:expand-on-click-node="false"
@node-click="nodeClick"
>
<span
class="tree-node"
slot-scope="{ data }"
:title="data.name"
>
<span>{{ data.name }}</span> <span>{{ data.name }}</span>
</span> </span>
</el-tree> </el-tree>
...@@ -224,53 +176,27 @@ ...@@ -224,53 +176,27 @@
placeholder="组织机构" placeholder="组织机构"
></el-input> --> ></el-input> -->
</el-form-item> </el-form-item>
<el-form-item label="时间:" class="col" prop="kssj" v-if="lx!=14"> <el-form-item label="时间:" class="col" prop="kssj" v-if="lx != 14">
<el-date-picker <el-date-picker v-model="formInline.kssj" type="month" placeholder="选择月" value-format="yyyy-MM">
v-model="formInline.kssj"
type="month"
placeholder="选择月"
value-format="yyyy-MM"
>
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<div class="btn"> <div class="btn">
<el-button <el-button type="primary" icon="el-icon-search" size="small" @click="handleSearch">查询</el-button>
type="primary" <el-button type="primary" icon="el-icon-refresh" size="small" @click="resetForm('searchForm')">重置
icon="el-icon-search" </el-button>
size="small"
@click="handleSearch"
>查询</el-button
>
<el-button
type="primary"
icon="el-icon-refresh"
size="small"
@click="resetForm('searchForm')"
>重置</el-button
>
</div> </div>
</el-form> </el-form>
</div> </div>
<div class="table"> <div class="table">
<el-scrollbar style="height: 100%"> <el-scrollbar style="height: 100%">
<el-table <el-table :data="tableData" border style="width: 100%" :header-cell-style="{
:data="tableData"
border
style="width: 100%"
:header-cell-style="{
background: '#c4ddf6', background: '#c4ddf6',
fontWeight: 'bolder', fontWeight: 'bolder',
fontSize: '16px', fontSize: '16px',
color: '#000', color: '#000',
'text-align': 'center', 'text-align': 'center',
}" }" v-loading="tableLoading" element-loading-text="拼命加载中" @cell-click="clickrow"
v-loading="tableLoading" @cell-mouse-enter="clickHover" :cell-style="{ 'text-align': 'center' }" :cell-class-name="addClass">
element-loading-text="拼命加载中"
@cell-click="clickrow"
@cell-mouse-enter="clickHover"
:cell-style="{ 'text-align': 'center' }"
:cell-class-name="addClass"
>
<el-table-column type="index" width="auto" label="序号"> <el-table-column type="index" width="auto" label="序号">
</el-table-column> </el-table-column>
<el-table-column prop="rhbs" label="入户状态" width="auto"> <el-table-column prop="rhbs" label="入户状态" width="auto">
...@@ -289,13 +215,8 @@ ...@@ -289,13 +215,8 @@
<el-table-column label="操作" width="auto"> <el-table-column label="操作" width="auto">
<template slot-scope="scope"> <template slot-scope="scope">
<el-button <el-button @click="handleClick(scope.row)" type="text" size="small"
@click="handleClick(scope.row)" style="font-weight: bolder; font-size: 15px">入户</el-button>
type="text"
size="small"
style="font-weight: bolder; font-size: 15px"
>入户</el-button
>
<!-- <el-button <!-- <el-button
@click="handleClickMap(scope.row)" @click="handleClickMap(scope.row)"
type="text" type="text"
...@@ -307,43 +228,22 @@ ...@@ -307,43 +228,22 @@
</el-table> </el-table>
</el-scrollbar> </el-scrollbar>
</div> </div>
<el-dialog <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose">
title="提示" <el-tree :props="props" ref="tree" lazy :load="loadNode" node-key="id" :expand-on-click-node="false"
:visible.sync="dialogVisible" @node-click="nodeClick" :before-close="handleClose">
width="30%"
:before-close="handleClose"
>
<el-tree
:props="props"
ref="tree"
lazy
:load="loadNode"
node-key="id"
:expand-on-click-node="false"
@node-click="nodeClick"
:before-close="handleClose"
>
<span class="tree-node" slot-scope="{ data }" :title="data.name"> <span class="tree-node" slot-scope="{ data }" :title="data.name">
<span>{{ data.name }}</span> <span>{{ data.name }}</span>
</span> </span>
</el-tree> </el-tree>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="handleCancel">取 消</el-button> <el-button @click="handleCancel">取 消</el-button>
<el-button type="primary" @click="dialogVisible = false" <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
>确 定</el-button
>
</span> </span>
</el-dialog> </el-dialog>
<div class="fy"> <div class="fy">
<el-pagination <el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
@size-change="handleSizeChange" :current-page.sync="currentPage" :page-sizes="[10, 50, 100, 200]" :page-size="10"
@current-change="handleCurrentChange" layout="sizes, prev, pager, next" :total="tableDataLength">
:current-page.sync="currentPage"
:page-sizes="[10, 50, 100, 200]"
:page-size="10"
layout="sizes, prev, pager, next"
:total="tableDataLength"
>
</el-pagination> </el-pagination>
</div> </div>
</div> </div>
...@@ -434,30 +334,24 @@ export default { ...@@ -434,30 +334,24 @@ export default {
newarr: [], newarr: [],
rybqoneList: [ rybqoneList: [
{ {
name: "红色标签", name: "疫苗接种标签",
id: "f1527aee10d84f899c0bd29de6b0a378", id: "a88756f6aae4491a88e1d314641d4060",
disabled: true, disabled: true,
}, },
//如果第一节不可点击 换成disable
{ {
name: "橙色标签", name: "疫情防控标签",
id: "840cee45a19c477fa9390e61c34f0eaa", id: "a9fac2e647b649a4931e114317e134a1",
disabled: true, disabled: true,
}, },
{ {
name: "黄色标签", name: "四失五类标签",
id: "c4db05a5b78243c2a597cbb444dec493", id: "129264ff91ad4ad9b6f75e82dd0f0def",
disabled: true, disabled: true,
}, },
{ {
name: "蓝色标签 ", name: "群防群控标签 ",
id: "a6c613c9d784409988e80a3982cd7ede", id: "dad6f019e2044513bb66964efc526ba9",
disabled: true, disabled: true
},
{
name: "绿色标签 ",
id: "42b4c8af92ed43208f9b69b137ac6991",
disabled: true,
}, },
// { name: "第一级02", id: "2" },'\ // { name: "第一级02", id: "2" },'\
], ],
...@@ -527,7 +421,7 @@ export default { ...@@ -527,7 +421,7 @@ export default {
} }
if (!checked && !data.disabled) { if (!checked && !data.disabled) {
self.newarr.push(data); self.newarr.push(data);
console.log("-----", self.newarr); // console.log("-----", self.newarr);
self.rybqList.map((item, idx) => { self.rybqList.map((item, idx) => {
self.newarr.map((item2) => { self.newarr.map((item2) => {
if (item.name == item2.name) { if (item.name == item2.name) {
...@@ -562,7 +456,7 @@ export default { ...@@ -562,7 +456,7 @@ export default {
* @return {*} * @return {*}
*/ */
nodeClick(data) { nodeClick(data) {
console.log(data); // console.log(data);
this.treeList = data; this.treeList = data;
this.treeName = data.name; this.treeName = data.name;
this.$set(this.formInline, "cxzzjg", data.id); this.$set(this.formInline, "cxzzjg", data.id);
...@@ -575,7 +469,7 @@ export default { ...@@ -575,7 +469,7 @@ export default {
*/ */
nodechange(data) { nodechange(data) {
let self = this; let self = this;
console.log(data); // console.log(data);
// this.treeListBq = data; // this.treeListBq = data;
// this.treeListBq.push(data) // this.treeListBq.push(data)
this.treeListBq.push(data); this.treeListBq.push(data);
...@@ -586,10 +480,10 @@ export default { ...@@ -586,10 +480,10 @@ export default {
this.treeNameBq.push(item.label); this.treeNameBq.push(item.label);
} }
}); });
console.log(this.treeListBq); // console.log(this.treeListBq);
}, },
loadNode(node, resolve) { loadNode(node, resolve) {
console.log(node); // console.log(node);
// console.log(resolve) // console.log(resolve)
if (node.level === 0) { if (node.level === 0) {
return resolve([ return resolve([
...@@ -603,10 +497,10 @@ export default { ...@@ -603,10 +497,10 @@ export default {
}, },
getTreeChild(id, resolve) { getTreeChild(id, resolve) {
// debugger; // debugger;
console.log(id); // console.log(id);
// 这里可以替换成向后台发起的请求修改data,为了演示我用的是写死的数据,获取到data后,resolve出去就好了 // 这里可以替换成向后台发起的请求修改data,为了演示我用的是写死的数据,获取到data后,resolve出去就好了
postJson("/xqapixjDept/selectjdzz", { ssjgdm: id }).then((res) => { postJson("/xqapixjDept/selectjdzz", { ssjgdm: id }).then((res) => {
console.log(res); // console.log(res);
// console.log({ name: res.data.rows, id: res.data.rows }); // console.log({ name: res.data.rows, id: res.data.rows });
let data = res.data.rows; let data = res.data.rows;
if (res.code == 200) { if (res.code == 200) {
...@@ -633,7 +527,7 @@ export default { ...@@ -633,7 +527,7 @@ export default {
* @return {*} * @return {*}
*/ */
loadNodeRybq(node, resolve) { loadNodeRybq(node, resolve) {
console.log(node); // console.log(node);
// console.log(resolve) // console.log(resolve)
if (node.level === 0) { if (node.level === 0) {
return resolve( return resolve(
...@@ -687,6 +581,7 @@ export default { ...@@ -687,6 +581,7 @@ export default {
let arr = []; let arr = [];
if (data.length != "0") { if (data.length != "0") {
data.map((item) => { data.map((item) => {
arr.push({ arr.push({
name: item.bqName, name: item.bqName,
id: item.id, id: item.id,
...@@ -695,6 +590,18 @@ export default { ...@@ -695,6 +590,18 @@ export default {
}); });
resolve(arr); resolve(arr);
self.$set(self.rybqoneList, "disabled", true); self.$set(self.rybqoneList, "disabled", true);
if(item.bqTypeId=='129264ff91ad4ad9b6f75e82dd0f0def'){
debugger;
arr.forEach(element => {
self.$set( element, "disabled", true);
});
// self.$set( arr[1], "disabled", true);
// self.$set( arr[2], "disabled", true);
// self.$set( arr[3], "disabled", true);
// self.$set( arr[4], "disabled", true);
}
}); });
} else { } else {
resolve([]); resolve([]);
...@@ -716,7 +623,7 @@ export default { ...@@ -716,7 +623,7 @@ export default {
this.$set(this.formInline, "rybq", isArr); this.$set(this.formInline, "rybq", isArr);
if (this.formInline.kssj) { if (this.formInline.kssj) {
this.$set(this.formInline, "kssj", this.formInline.kssj + "-1"); this.$set(this.formInline, "kssj", this.formInline.kssj + "-1");
}else{ } else {
this.$set(this.formInline, "kssj", ''); this.$set(this.formInline, "kssj", '');
} }
this.getList(this.formInline); this.getList(this.formInline);
...@@ -1276,30 +1183,38 @@ export default { ...@@ -1276,30 +1183,38 @@ export default {
display: flex; display: flex;
// width: 48%; // width: 48%;
} }
.perRight { .perRight {
// width: 48%; // width: 48%;
display: flex; display: flex;
} }
.popper { .popper {
max-height: 260px; max-height: 260px;
overflow: auto; overflow: auto;
} }
.el-popover { .el-popover {
max-height: 260px; max-height: 260px;
overflow: auto; overflow: auto;
} }
.rhzf { .rhzf {
display: flex; display: flex;
height: calc(100vh - 136px); height: calc(100vh - 136px);
.table /deep/ { .table /deep/ {
height: 550px; height: 550px;
.el-scrollbar__wrap { .el-scrollbar__wrap {
overflow-x: hidden; overflow-x: hidden;
} }
.el-table td, .el-table td,
.el-table th { .el-table th {
padding: 5px 0; padding: 5px 0;
} }
// overflow: auto; // overflow: auto;
/*滚动条样式*/ /*滚动条样式*/
// .table::-webkit-scrollbar { // .table::-webkit-scrollbar {
...@@ -1320,62 +1235,77 @@ export default { ...@@ -1320,62 +1235,77 @@ export default {
cursor: pointer; cursor: pointer;
} }
} }
.left { .left {
width: 60%; width: 60%;
border: 1px solid #ccc; border: 1px solid #ccc;
padding: 10px; padding: 10px;
box-sizing: border-box; box-sizing: border-box;
.title { .title {
// display: flex; // display: flex;
// justify-content: space-between; // justify-content: space-between;
.per { .per {
font-weight: bold; font-weight: bold;
} }
.cgre { .cgre {
color: #10ca4d; color: #10ca4d;
} }
.cred { .cred {
color: #ff3232; color: #ff3232;
} }
} }
.prgress /deep/ { .prgress /deep/ {
display: flex; display: flex;
flex: 1; flex: 1;
margin-top: 8px; margin-top: 8px;
// margin-left: 6px; // margin-left: 6px;
.el-progress { .el-progress {
line-height: 1.5; line-height: 1.5;
width: 100%; width: 100%;
.el-progress__text { .el-progress__text {
width: 20px; width: 20px;
} }
} }
} }
.col { .col {
width: 32%; width: 32%;
} }
.form /deep/ { .form /deep/ {
border: 1px solid #ccc; border: 1px solid #ccc;
border-left: none; border-left: none;
border-right: none; border-right: none;
// margin: 10px 0px; // margin: 10px 0px;
padding: 10px; padding: 10px;
.el-form-item--mini .el-form-item__content, .el-form-item--mini .el-form-item__content,
.el-form-item--mini .el-form-item__label { .el-form-item--mini .el-form-item__label {
width: 70%; width: 70%;
} }
.el-select { .el-select {
width: 100%; width: 100%;
} }
.el-tree { .el-tree {
max-height: 200px; max-height: 200px;
overflow: auto; overflow: auto;
// height: 0px; // height: 0px;
} }
.el-date-editor.el-input, .el-date-editor.el-input,
.el-date-editor.el-input__inner { .el-date-editor.el-input__inner {
width: 100%; width: 100%;
} }
.tree { .tree {
-webkit-appearance: none; -webkit-appearance: none;
background-color: #fff; background-color: #fff;
...@@ -1399,20 +1329,23 @@ export default { ...@@ -1399,20 +1329,23 @@ export default {
white-space: nowrap; //强制文本在一行内显示 white-space: nowrap; //强制文本在一行内显示
text-overflow: ellipsis; //当对象内文本溢出时显示省略标记 text-overflow: ellipsis; //当对象内文本溢出时显示省略标记
} }
.treeselect {
} .treeselect {}
} }
.btn { .btn {
display: flex; display: flex;
justify-content: center; justify-content: center;
// margin: 15px; // margin: 15px;
} }
.fy { .fy {
// position: absolute; // position: absolute;
// bottom: 20px; // bottom: 20px;
// margin-top: 10px; // margin-top: 10px;
} }
} }
.right { .right {
width: 40%; width: 40%;
height: calc(100vh - 136px); height: calc(100vh - 136px);
...@@ -1421,11 +1354,13 @@ export default { ...@@ -1421,11 +1354,13 @@ export default {
box-sizing: border-box; box-sizing: border-box;
} }
} }
.ppp { .ppp {
width: 100px; width: 100px;
height: 100px; height: 100px;
background: yellow; background: yellow;
} }
.map { .map {
width: 100%; width: 100%;
height: calc(100vh - 200px); height: calc(100vh - 200px);
......
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