Commit dfa102a0 authored by p-wanping.song's avatar p-wanping.song

业态添加经营状态

parent c5504a91
...@@ -6,6 +6,7 @@ ...@@ -6,6 +6,7 @@
"license": "MIT", "license": "MIT",
"scripts": { "scripts": {
"dev": "vue-cli-service serve", "dev": "vue-cli-service serve",
"serve": "vue-cli-service serve",
"build:prod": "vue-cli-service build", "build:prod": "vue-cli-service build",
"build:stage": "vue-cli-service build --mode staging", "build:stage": "vue-cli-service build --mode staging",
"preview": "node build/index.js --preview", "preview": "node build/index.js --preview",
......
...@@ -255,7 +255,10 @@ ...@@ -255,7 +255,10 @@
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="是否为物业" prop="propertyManagement"> <el-form-item label="是否为物业" prop="propertyManagement">
<el-checkbox v-model="form.propertyManagement">备选项</el-checkbox> <el-radio-group v-model="form.propertyManagement">
<el-radio :label="true"></el-radio>
<el-radio :label="false"></el-radio>
</el-radio-group>
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
......
...@@ -10,26 +10,49 @@ ...@@ -10,26 +10,49 @@
</div> </div>
<div class="map-content"> <div class="map-content">
<div class="map-content-left"> <div class="map-content-left">
<map-item-container title="评估数据统计"> <div class="map-content-left-wrap">
<div ref="leftTop" style="width: 100%; height: 100%"></div> <map-item-container title="评估数据统计">
</map-item-container> <div
<map-item-container title="评估数据统计"> v-for="item in 3"
<mapTable /> :key="item"
</map-item-container> style="width: 30%; display: inline-block"
<map-item-container title="评估数据统计"> class="content-assess-item"
<echartMap /> >
</map-item-container> <div class="content-assess-title">评估项目</div>
<div :id="'leftTop' + item" style="height: 100%"></div>
</div>
</map-item-container>
<map-item-container title="项目风险排名">
<mapTable />
</map-item-container>
<map-item-container title="项目风险排名">
<div ref="bar" style="width: 100%; height: 100%"></div>
</map-item-container>
</div>
</div> </div>
<div ref="myEchart" class="echart-instance"></div> <div ref="myEchart" class="echart-instance"></div>
<div class="map-content-right"> <div class="map-content-right">
<map-item-container title="事故类型统计"> <div class="map-content-right-wrap">
<div <map-item-container title="风险级别统计">
v-for="item in 10" <echartMap />
:key="item" </map-item-container>
:style="randomCircle()" <map-item-container title="事故类型统计">
class="map-circle-item" <div style="columns: 4">
></div> <div
</map-item-container> v-for="item in 10"
:key="item"
:style="randomCircle()"
class="map-circle-item"
>
<div>物体打击</div>
<div>1455</div>
</div>
</div>
</map-item-container>
<map-item-container title="项目风险排名">
<div ref="bar1" style="width: 100%; height: 100%"></div>
</map-item-container>
</div>
</div> </div>
</div> </div>
...@@ -57,6 +80,7 @@ export default { ...@@ -57,6 +80,7 @@ export default {
name: 100000, name: 100000,
myMap: null, myMap: null,
mapData: [], mapData: [],
myTopLeft: [],
}; };
}, },
mounted() { mounted() {
...@@ -67,7 +91,7 @@ export default { ...@@ -67,7 +91,7 @@ export default {
}, },
methods: { methods: {
randomCircle() { randomCircle() {
const w = parseInt(Math.random() * 160 - 100); const w = parseInt(Math.random() * 40 + 50);
let r = Math.floor(Math.random() * 256); //0-255.999999 let r = Math.floor(Math.random() * 256); //0-255.999999
let g = Math.floor(Math.random() * 256); let g = Math.floor(Math.random() * 256);
let b = Math.floor(Math.random() * 256); let b = Math.floor(Math.random() * 256);
...@@ -75,6 +99,7 @@ export default { ...@@ -75,6 +99,7 @@ export default {
width: w + "px", width: w + "px",
height: w + "px", height: w + "px",
backgroundColor: `rgba(${r},${g},${b},0.4)`, backgroundColor: `rgba(${r},${g},${b},0.4)`,
color: `rgb(${r},${g},${b})`,
}; };
}, },
initMap(code = 100000) { initMap(code = 100000) {
...@@ -143,53 +168,210 @@ export default { ...@@ -143,53 +168,210 @@ export default {
}); });
}, },
initEcharts() { initEcharts() {
this.myLeft = echarts.init(this.$refs.leftTop); // 评估数据统计
this.myLeft.setOption({ for (let i = 1; i <= 3; i++) {
series: [ const echart = echarts.init(document.getElementById("leftTop" + i));
{ echart.setOption({
name: "Pressure", series: [
type: "gauge", {
progress: { name: "Pressure",
show: true, type: "gauge",
}, detail: {
detail: { show: false,
show: false, },
}, axisTick: {
axisTick: { show: false,
show: false, },
}, splitLine: {
splitLine: { show: false,
show: false, },
axisLabel: {
show: false,
},
pointer: {
icon: "path://M2.9,0.7L2.9,0.7c1.4,0,2.6,1.2,2.6,2.6v115c0,1.4-1.2,2.6-2.6,2.6l0,0c-1.4,0-2.6-1.2-2.6-2.6V3.3C0.3,1.9,1.4,0.7,2.9,0.7z",
width: 1,
length: "100%",
offsetCenter: [0, "8%"],
itemStyle: {
color: "rgba(255, 252, 57,0.6)",
},
},
anchor: {
show: true,
showAbove: true,
size: 8,
itemStyle: {
borderWidth: 2,
borderColor: "rgba(255, 252, 57,0.6)",
},
},
axisLine: {
show: true,
lineStyle: {
opacity: 0.1,
},
},
progress: {
show: true,
itemStyle: {
color: {
type: "linear",
x: 0,
y: 1,
x2: 0,
y2: 0,
colorStops: [
{
offset: 0,
color: "rgba(164, 190, 203,0.6)", // 0% 处的颜色
},
{
offset: 0.5,
color: "rgba(1,179,227,0.6)", // 0% 处的颜色
},
{
offset: 1,
color: "rgba(67,243,203,0.6)", // 100% 处的颜色
},
],
global: false, // 缺省为 false
},
},
},
data: [
{
value: i * 30,
},
],
}, },
axisLine: { ],
show: true, });
this.myTopLeft.push(echart);
}
// 风险类型统计
const bar = echarts.init(this.$refs.bar);
const bar1 = echarts.init(this.$refs.bar1);
var hours = [
"12a",
"1a",
"2a",
"3a",
"4a",
"5a",
"6a",
"7a",
"8a",
"9a",
"10a",
"11a",
"12p",
"1p",
"2p",
"3p",
"4p",
"5p",
"6p",
"7p",
"8p",
"9p",
"10p",
"11p",
];
const data = [
[1, 0, 5],
[1, 17, 4],
[1, 16, 7],
[1, 1, 3],
[1, 13, 4],
[1, 8, 11],
[1, 20, 3],
[0, 16, 14],
[0, 10, 2],
[0, 6, 0],
[0, 3, 12],
[0, 20, 16],
];
const option = {
visualMap: {
show: false,
max: 20,
inRange: {
color: [
"#313695",
"#4575b4",
"#74add1",
"#abd9e9",
"#e0f3f8",
"#ffffbf",
"#fee090",
"#fdae61",
"#f46d43",
"#d73027",
"#a50026",
],
},
},
xAxis3D: {
type: "category",
data: hours,
},
yAxis3D: {
type: "value",
},
zAxis3D: {
type: "value",
},
grid3D: {
boxWidth: 150,
boxHeight: 80,
boxDepth: 90,
viewControl: {
alpha: 15,
beta: 0,
},
axisLine: {
lineStyle: { color: "rgba(255,255,255,0.3)" },
},
light: {
main: {
shadow: true,
quality: "ultra",
intensity: 1.5,
}, },
axisLabel: { },
},
series: [
{
type: "bar3D",
data: data.map(function (item) {
return {
value: [item[1], item[0], item[2]],
};
}),
shading: "color",
label: {
show: false, show: false,
fontSize: 16,
borderWidth: 1,
}, },
pointer: { itemStyle: {
icon: "path://M2.9,0.7L2.9,0.7c1.4,0,2.6,1.2,2.6,2.6v115c0,1.4-1.2,2.6-2.6,2.6l0,0c-1.4,0-2.6-1.2-2.6-2.6V3.3C0.3,1.9,1.4,0.7,2.9,0.7z", opacity: 0.8,
width: 1,
length: "80%",
offsetCenter: [0, "8%"],
}, },
anchor: { emphasis: {
show: true, label: {
showAbove: true, fontSize: 20,
size: 8, color: "#900",
color: "green", },
itemStyle: { itemStyle: {
borderWidth: 2, color: "#900",
}, },
}, },
data: [
{
value: 50,
},
],
}, },
], ],
}); };
bar.setOption(option);
bar1.setOption(option);
}, },
resetEcharts() {}, resetEcharts() {},
map2d() { map2d() {
...@@ -304,6 +486,14 @@ export default { ...@@ -304,6 +486,14 @@ export default {
right: 0; right: 0;
left: auto; left: auto;
} }
&-left-wrap {
margin-left: 20px;
height: 100%;
}
&-right-wrap {
margin-right: 40px;
height: 100%;
}
} }
.echart-instance { .echart-instance {
...@@ -314,10 +504,55 @@ export default { ...@@ -314,10 +504,55 @@ export default {
} }
.map-circle-item { .map-circle-item {
border-radius: 50%; border-radius: 50%;
animation: circleAnimation 0.5s infinite;
margin: 10px;
break-inside: avoid;
text-align: center;
display: flex;
align-items: center;
justify-content: center;
flex-direction: column;
}
.map-circle-item:nth-of-type(2n) {
animation: circleAnimation 0.4s infinite;
}
.map-circle-item:nth-of-type(2n + 1) {
animation: circleAnimation 0.3s infinite;
}
.map-circle-item:last-child {
animation: circleAnimation 0.6s infinite;
}
}
@keyframes circleAnimation {
0% {
transform: translateY(0);
}
50% {
transform: translateY(-10px);
}
100% {
transform: translateY(0);
} }
} }
::-webkit-scrollbar { ::-webkit-scrollbar {
display: none; display: none;
} }
// 评估数据
.content-assess-item {
display: inline-block;
width: 40%;
.content-assess-title {
height: 60px;
width: 100%;
background: url("../assets/map/content-assess-title.png") center center;
background-size: 100% 100%;
text-align: center;
line-height: 60px;
color: #fff;
font-weight: bold;
}
}
</style> </style>
...@@ -18,12 +18,13 @@ export default { ...@@ -18,12 +18,13 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.map-content-item { .map-content-item {
width: 100%; width: 100%;
height: 35%; height: 34%;
overflow: hidden; overflow: hidden;
padding-left: 30px;
.map-content-inner { .map-content-inner {
height: 100%; height: 100%;
padding: 10px; padding: 10px;
text-align: center;
padding-left: 30px;
} }
.map-content-title { .map-content-title {
......
...@@ -59,6 +59,8 @@ export default { ...@@ -59,6 +59,8 @@ export default {
} }
.map-table-list { .map-table-list {
transition: all 1s; transition: all 1s;
margin: 0;
padding: 0;
&-item { &-item {
display: flex; display: flex;
height: 30px; height: 30px;
......
<template> <template>
<div class="app-container"> <div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="90px"> <el-form
:model="queryParams"
ref="queryForm"
size="small"
:inline="true"
v-show="showSearch"
label-width="90px"
>
<el-form-item label="任务名称" prop="name"> <el-form-item label="任务名称" prop="name">
<el-input v-model="queryParams.name" placeholder="请输入任务名称" clearable @keyup.enter.native="handleQuery" /> <el-input
v-model="queryParams.name"
placeholder="请输入任务名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item label="所属区域" prop="createDeptId"> <el-form-item label="所属区域" prop="createDeptId">
<treeselect <treeselect
...@@ -14,92 +26,199 @@ ...@@ -14,92 +26,199 @@
/> />
</el-form-item> </el-form-item>
<el-form-item label="项目名称" prop="projectName"> <el-form-item label="项目名称" prop="projectName">
<el-input v-model="queryParams.projectName" placeholder="请输入项目名称" clearable @keyup.enter.native="handleQuery" /> <el-input
v-model="queryParams.projectName"
placeholder="请输入项目名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item label="创建人名称" prop="createUserName"> <el-form-item label="创建人名称" prop="createUserName">
<el-input v-model="queryParams.createUserName" placeholder="请输入创建人员名称" clearable <el-input
@keyup.enter.native="handleQuery" /> v-model="queryParams.createUserName"
placeholder="请输入创建人员名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item label="负责人名称" prop="leaderUserName"> <el-form-item label="负责人名称" prop="leaderUserName">
<el-input v-model="queryParams.leaderUserName" placeholder="请输入负责人名称" clearable <el-input
@keyup.enter.native="handleQuery" /> v-model="queryParams.leaderUserName"
placeholder="请输入负责人名称"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item> </el-form-item>
<el-form-item> <el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> <el-button
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item> </el-form-item>
</el-form> </el-form>
<el-row :gutter="10" class="mb8"> <el-row :gutter="10" class="mb8">
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="primary" plain icon="el-icon-plus" size="mini" @click="handleAdd" <el-button
v-hasPermi="['system:riskPlan:add']">新增</el-button> type="primary"
plain
icon="el-icon-plus"
size="mini"
@click="handleAdd"
v-hasPermi="['system:riskPlan:add']"
>新增</el-button
>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" <el-button
v-hasPermi="['system:riskPlan:edit']">修改</el-button> type="success"
plain
icon="el-icon-edit"
size="mini"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['system:riskPlan:edit']"
>修改</el-button
>
</el-col> </el-col>
<el-col :span="1.5"> <el-col :span="1.5">
<el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" <el-button
v-hasPermi="['system:riskPlan:remove']">删除</el-button> type="danger"
plain
icon="el-icon-delete"
size="mini"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['system:riskPlan:remove']"
>删除</el-button
>
</el-col> </el-col>
<!-- <el-col :span="1.5"> <!-- <el-col :span="1.5">
<el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport" <el-button type="warning" plain icon="el-icon-download" size="mini" @click="handleExport"
v-hasPermi="['system:riskPlan:export']">导出</el-button> v-hasPermi="['system:riskPlan:export']">导出</el-button>
</el-col> --> </el-col> -->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> <right-toolbar
:showSearch.sync="showSearch"
@queryTable="getList"
></right-toolbar>
</el-row> </el-row>
<el-table v-loading="loading" :data="planList" @selection-change="handleSelectionChange"> <el-table
<el-table-column type="selection" align="center" :selectable="checkSelect" /> v-loading="loading"
<el-table-column label="序号" align="center" > :data="planList"
@selection-change="handleSelectionChange"
>
<el-table-column
type="selection"
align="center"
:selectable="checkSelect"
/>
<el-table-column label="序号" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ scope.$index + 1 }}</span> <span>{{ scope.$index + 1 }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="任务名称" align="left" prop="name" width="200px"/> <el-table-column
<!-- <el-table-column label="任务编号" align="center" prop="no" /> --> label="任务名称"
<el-table-column label="项目名称" align="left" prop="projectName" width="200px"/> align="left"
<el-table-column label="楼栋名称" align="left" prop="buildingNames" width="300px" > prop="name"
<template slot-scope="scope"> width="200px"
/>
<el-popover <!-- <el-table-column label="任务编号" align="center" prop="no" /> -->
placement="top-start" <el-table-column
title="楼栋名称" label="项目名称"
width="200" align="left"
trigger="hover" prop="projectName"
:content="scope.row.buildingNames"> width="200px"
<span slot="reference">{{ scope.row.buildingNames.length>25?scope.row.buildingNames.substring(0,25)+"...":scope.row.buildingNames}}</span> />
</el-popover> <el-table-column
</template> label="楼栋名称"
align="left"
prop="buildingNames"
width="300px"
>
<template slot-scope="scope">
<el-popover
placement="top-start"
title="楼栋名称"
width="200"
trigger="hover"
:content="scope.row.buildingNames"
>
<span slot="reference">{{
scope.row.buildingNames.length > 25
? scope.row.buildingNames.substring(0, 25) + "..."
: scope.row.buildingNames
}}</span>
</el-popover>
</template>
</el-table-column> </el-table-column>
<el-table-column label="创建人员" align="center" prop="createUserName" /> <el-table-column label="创建人员" align="center" prop="createUserName" />
<el-table-column label="创建单位" align="center" prop="createDeptName" /> <el-table-column label="创建单位" align="center" prop="createDeptName" />
<el-table-column label="负责人" align="center" prop="leaderUserName" /> <el-table-column label="负责人" align="center" prop="leaderUserName" />
<el-table-column label="执行人员" align="center" prop="workUserNames" width="120"/> <el-table-column
<el-table-column label="开始时间" align="center" prop="startTime" width="120" > label="执行人员"
align="center"
prop="workUserNames"
width="120"
/>
<el-table-column
label="开始时间"
align="center"
prop="startTime"
width="120"
>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.startTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.startTime, "{y}-{m}-{d}") }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="结束时间" align="center" prop="endTime" width="120"> <el-table-column
label="结束时间"
align="center"
prop="endTime"
width="120"
>
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{ parseTime(scope.row.endTime, '{y}-{m}-{d}') }}</span> <span>{{ parseTime(scope.row.endTime, "{y}-{m}-{d}") }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="状态" align="center" prop="statusName" width="120"> <el-table-column
label="状态"
align="center"
prop="statusName"
width="120"
>
<template slot-scope="scope"> <template slot-scope="scope">
<div> <div>
<div v-if="scope.row.statusName=='项目完成'"><el-tag type="info">项目完成</el-tag></div> <div v-if="scope.row.statusName == '项目完成'">
<div v-else-if="scope.row.statusName=='审批任务'"><el-tag >审批任务</el-tag></div> <el-tag type="info">项目完成</el-tag>
<div v-else-if="scope.row.statusName=='任务待执行'"><el-tag type="warning">任务待执行</el-tag></div> </div>
<div v-else-if="scope.row.statusName=='验收任务'"><el-tag type="success">验收任务</el-tag></div> <div v-else-if="scope.row.statusName == '审批任务'">
<div v-else><el-tag type="danger">{{scope.row.statusName}}</el-tag></div> <el-tag>审批任务</el-tag>
</div> </div>
<div v-else-if="scope.row.statusName == '任务待执行'">
<el-tag type="warning">任务待执行</el-tag>
</div>
<div v-else-if="scope.row.statusName == '验收任务'">
<el-tag type="success">验收任务</el-tag>
</div>
<div v-else>
<el-tag type="danger">{{ scope.row.statusName }}</el-tag>
</div>
</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width" > <el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope"> <template slot-scope="scope">
<!-- <div v-if="scope.row.statusName=='任务待执行'"> <!-- <div v-if="scope.row.statusName=='任务待执行'">
<el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)"
...@@ -107,26 +226,42 @@ ...@@ -107,26 +226,42 @@
<el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)"
v-hasPermi="['system:riskPlan:remove']">删除</el-button> v-hasPermi="['system:riskPlan:remove']">删除</el-button>
</div> --> </div> -->
<router-link :to="'/risk/plan/ledgerdata/index/' + scope.row.id" class="link-type"> <router-link
<el-button size="mini" type="text" icon="el-icon-view">详情</el-button> :to="'/risk/plan/ledgerdata/index/' + scope.row.id"
class="link-type"
>
<el-button size="mini" type="text" icon="el-icon-view"
>详情</el-button
>
</router-link> </router-link>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<pagination v-show="total>0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" <pagination
@pagination="getList" /> v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 添加或修改风险计划对话框 --> <!-- 添加或修改风险计划对话框 -->
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body> <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
<el-form ref="form" :model="form" :rules="rules" label-width="120px"> <el-form ref="form" :model="form" :rules="rules" label-width="120px">
<el-form-item label="创建人员" prop="createUserId"> <el-form-item label="创建人员" prop="createUserId">
<el-input v-model="user.nickName" placeholder="请输入创建人员" disabled/> <el-input
v-model="user.nickName"
placeholder="请输入创建人员"
disabled
/>
</el-form-item> </el-form-item>
<el-form-item label="创建单位" prop="createDeptId"> <el-form-item label="创建单位" prop="createDeptId">
<el-input v-model="user.dept.deptName" placeholder="请输入创建单位" disabled/> <el-input
v-model="user.dept.deptName"
placeholder="请输入创建单位"
disabled
/>
</el-form-item> </el-form-item>
<el-form-item label="任务名称" prop="name"> <el-form-item label="任务名称" prop="name">
<el-input v-model="form.name" placeholder="请输入任务名称" /> <el-input v-model="form.name" placeholder="请输入任务名称" />
...@@ -135,14 +270,31 @@ ...@@ -135,14 +270,31 @@
<el-input v-model="form.projectIdV" placeholder="请输入任务名称" /> <el-input v-model="form.projectIdV" placeholder="请输入任务名称" />
</el-form-item> </el-form-item>
<el-form-item label="关联项目" prop="projectId"> <el-form-item label="关联项目" prop="projectId">
<el-select v-model="form.projectId" size="medium" @change="getBuildingList(form.projectId,'change')" filterable remote <el-select
reserve-keyword placeholder="请输入项目关键词" :remote-method="remoteMethod" :loading="loading"> v-model="form.projectId"
<el-option v-for="item in projectOptions" :key="item.id" :label="item.name" :value="item.id"> size="medium"
@change="getBuildingList(form.projectId, 'change')"
filterable
remote
reserve-keyword
placeholder="请输入项目关键词"
:remote-method="remoteMethod"
:loading="loading"
>
<el-option
v-for="item in projectOptions"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="业态" prop="projectBusiness"> <el-form-item label="业态" prop="projectBusiness">
<el-select v-model="form.projectBusiness" placeholder="请选择风险点类型"> <el-select
v-model="form.projectBusiness"
placeholder="请选择风险点类型"
>
<el-option <el-option
v-for="dict in dict.type.risk_project_business" v-for="dict in dict.type.risk_project_business"
:key="dict.value" :key="dict.value"
...@@ -151,42 +303,96 @@ ...@@ -151,42 +303,96 @@
></el-option> ></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="经营状态" prop="businessStatus">
<el-radio-group v-model="form.businessStatus">
<el-radio label="自营">自营</el-radio>
<el-radio label="租赁">租赁</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="是否为物业" prop="propertyManagement">
<el-radio-group v-model="form.propertyManagement">
<el-radio :label="true"></el-radio>
<el-radio :label="false"></el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="评估楼栋" prop="buildingIds"> <el-form-item label="评估楼栋" prop="buildingIds">
<el-select v-model="form.buildingIds" multiple medium placeholder="请选择评估楼栋"> <el-select
<el-option v-for="item in buildingOption" :key="item.id" :label="item.name" :value="item.id"> v-model="form.buildingIds"
multiple
medium
placeholder="请选择评估楼栋"
>
<el-option
v-for="item in buildingOption"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option> </el-option>
</el-select> </el-select>
<!-- <el-input v-model="form.buildingIds" placeholder="请输入评估楼栋" /> --> <!-- <el-input v-model="form.buildingIds" placeholder="请输入评估楼栋" /> -->
</el-form-item> </el-form-item>
<el-form-item label="评估小组选择" prop="deptId"> <el-form-item label="评估小组选择" prop="deptId">
<treeselect v-model="form.deptId" :options="deptOptions" :show-count="true" @select="handleNodeClick" placeholder="请选择归属部门" /> <treeselect
v-model="form.deptId"
:options="deptOptions"
:show-count="true"
@select="handleNodeClick"
placeholder="请选择归属部门"
/>
<!-- <el-input v-model="user.dept.deptName" placeholder="请输评估小组选择" /> --> <!-- <el-input v-model="user.dept.deptName" placeholder="请输评估小组选择" /> -->
</el-form-item> </el-form-item>
<el-form-item label="评估小组组长" prop="leaderUserId"> <el-form-item label="评估小组组长" prop="leaderUserId">
<!-- <el-input v-model="form.leaderUserId" placeholder="请输入评估小组组长" /> --> <!-- <el-input v-model="form.leaderUserId" placeholder="请输入评估小组组长" /> -->
<el-select v-model="form.leaderUserId" placeholder="请选择评估小组组长"> <el-select
<el-option v-for="item in userOptions" :key="item.userId" :label="item.nickName" :value="item.userId"> v-model="form.leaderUserId"
placeholder="请选择评估小组组长"
>
<el-option
v-for="item in userOptions"
:key="item.userId"
:label="item.nickName"
:value="item.userId"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="评估小组成员" prop="workUserIds"> <el-form-item label="评估小组成员" prop="workUserIds">
<!-- <el-input v-model="form.workUserIds" placeholder="请输入评估小组成员" /> --> <!-- <el-input v-model="form.workUserIds" placeholder="请输入评估小组成员" /> -->
<el-select v-model="form.workUserIds" multiple placeholder="请选择评评估小组成员"> <el-select
<el-option v-for="item in userOptions" :key="item.userId" :label="item.nickName" :value="item.userId"> v-model="form.workUserIds"
multiple
placeholder="请选择评评估小组成员"
>
<el-option
v-for="item in userOptions"
:key="item.userId"
:label="item.nickName"
:value="item.userId"
>
</el-option> </el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="任务开始时间" prop="startTime"> <el-form-item label="任务开始时间" prop="startTime">
<el-date-picker clearable v-model="form.startTime" type="date" value-format="yyyy-MM-dd" <el-date-picker
placeholder="请选择任务开始时间"> clearable
v-model="form.startTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择任务开始时间"
>
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
<el-form-item label="任务结束时间" prop="endTime"> <el-form-item label="任务结束时间" prop="endTime">
<el-date-picker clearable v-model="form.endTime" type="date" value-format="yyyy-MM-dd" <el-date-picker
placeholder="请选择任务结束时间"> clearable
v-model="form.endTime"
type="date"
value-format="yyyy-MM-dd"
placeholder="请选择任务结束时间"
>
</el-date-picker> </el-date-picker>
</el-form-item> </el-form-item>
</el-form> </el-form>
<div slot="footer" class="dialog-footer"> <div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm"> </el-button> <el-button type="primary" @click="submitForm"> </el-button>
...@@ -197,378 +403,398 @@ ...@@ -197,378 +403,398 @@
</template> </template>
<script> <script>
import { import {
listUser, listUser,
getUser, getUser,
delUser, delUser,
addUser, addUser,
updateUser, updateUser,
resetUserPwd, resetUserPwd,
changeUserStatus, changeUserStatus,
deptTreeSelect deptTreeSelect,
} from "@/api/system/user"; } from "@/api/system/user";
import { import {
listPlan, listPlan,
getPlan, getPlan,
delPlan, delPlan,
addPlan, addPlan,
updatePlan, updatePlan,
getProjectList, getProjectList,
getBuildingList, getBuildingList,
getUserListByDeptId, getUserListByDeptId,
} from "@/api/risk/plan"; } from "@/api/risk/plan";
import { import { getUserProfile } from "@/api/system/user";
getUserProfile
} from "@/api/system/user"; import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
import Treeselect from "@riophae/vue-treeselect";
import "@riophae/vue-treeselect/dist/vue-treeselect.css"; export default {
name: "Plan",
export default { dicts: ["risk_project_business"],
name: "Plan", components: {
dicts: ['risk_project_business'], Treeselect,
components: { },
Treeselect data() {
}, return {
data() { userOptions: [], //用户列表
return { projectOptions: [], //项目列表
userOptions: [], //用户列表 buildingOption: [], //楼栋列表
projectOptions: [], //项目列表 user: {
buildingOption: [], //楼栋列表 dept: {
user: { deptName: "",
dept:{ deptId: "",
deptName:'',
deptId:'',
}
},
// 遮罩层
loading: true,
// 选中数组
ids: [],
// 非单个禁用
single: true,
// 非多个禁用
multiple: true,
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 风险计划表格数据
planList: [],
// 部门树选项
deptOptions: undefined,
// 弹出层标题
title: "",
// 是否显示弹出层
open: false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
name: null,
createDeptId: null,
projectName: null,
createUserName: null,
leaderUserName: null,
workUserName: null,
}, },
// 表单参数 },
form: { // 遮罩层
projectIdV:'', loading: true,
deptId: '', // 选中数组
createUserId:'', ids: [],
createDeptId:'', // 非单个禁用
}, single: true,
// 表单校验 // 非多个禁用
rules: { multiple: true,
// createUserId: [{ // 显示搜索条件
// required: true, showSearch: true,
// message: '请输入创建人姓名', // 总条数
// trigger: 'blur' total: 0,
// }, // 风险计划表格数据
planList: [],
// ], // 部门树选项
// createDeptId: [{ deptOptions: undefined,
// required: true, // 弹出层标题
// message: '请输入创建单位', title: "",
// trigger: 'blur' // 是否显示弹出层
// }, open: false,
// 查询参数
// ], queryParams: {
name: [{ pageNum: 1,
required: true, pageSize: 10,
message: '请输入任务名称', name: null,
trigger: 'blur' createDeptId: null,
}, projectName: null,
{ createUserName: null,
min: 1, leaderUserName: null,
max: 50, workUserName: null,
message: '长度在 1 到 50个字符', },
trigger: 'blur' // 表单参数
} form: {
], projectIdV: "",
deptId: "",
projectId: [{ createUserId: "",
required: true, createDeptId: "",
message: '请输入任务名称', },
trigger: 'blur' // 表单校验
}, rules: {
// createUserId: [{
], // required: true,
projectBusiness: [{ // message: '请输入创建人姓名',
required: true, // trigger: 'blur'
message: '请输入业态', // },
trigger: 'blur'
}, // ],
// createDeptId: [{
], // required: true,
buildingIds: [{ // message: '请输入创建单位',
required: true, // trigger: 'blur'
message: '请输入任务名称', // },
trigger: 'change'
}, // ],
name: [
{
required: true,
message: "请输入任务名称",
trigger: "blur",
},
{
min: 1,
max: 50,
message: "长度在 1 到 50个字符",
trigger: "blur",
},
],
], projectId: [
leaderUserId: [{ {
required: true, required: true,
message: '请选择小组负责人', message: "请输入任务名称",
trigger: 'change' trigger: "change",
}], },
workUserIds: [{ ],
projectBusiness: [
{
required: true, required: true,
message: '请选择小组成员', message: "请输入业态",
trigger: 'change' trigger: "blur",
}], },
startTime: [{ ],
type: 'string', businessStatus: [
{
required: true, required: true,
message: '请选择开始时间', message: "请选择经营状态",
trigger: 'change' trigger: "blur",
}], },
endTime: [{ ],
type: 'string', propertyManagement: [
{
required: true, required: true,
message: '请选择结束时间', message: "请选择是否为物业",
trigger: 'change' trigger: "blur",
}], },
],
} buildingIds: [
}; {
required: true,
message: "请输入任务名称",
trigger: "blur",
},
],
leaderUserId: [
{
required: true,
message: "请选择小组负责人",
trigger: "change",
},
],
workUserIds: [
{
required: true,
message: "请选择小组成员",
trigger: "blur",
},
],
startTime: [
{
type: "string",
required: true,
message: "请选择开始时间",
trigger: "change",
},
],
endTime: [
{
type: "string",
required: true,
message: "请选择结束时间",
trigger: "change",
},
],
},
};
},
watch: {
// 根据名称筛选部门树
deptName(val) {
this.$refs.tree.filter(val);
}, },
watch: { },
// 根据名称筛选部门树
deptName(val) { created() {
this.$refs.tree.filter(val); this.getDeptTree();
} this.getList();
},
mounted() {},
methods: {
/**
* 判断select是否可选
*/
checkSelect(row) {
return row.statusName == "任务待执行";
}, },
created() { getUserListByDeptId(deptId) {
this.getDeptTree(); getUserListByDeptId(deptId).then((response) => {
this.getList(); this.userOptions = response.data;
});
},
remoteMethod(query) {
if (query !== "") {
this.loading = true;
getProjectList(query).then((response) => {
this.loading = false;
this.projectOptions = response.data;
});
} else {
this.projectOptions = [];
}
}, },
mounted() {
getUser() {
getUserProfile().then((response) => {
this.user = response.data;
//console.log(this.user)
this.form.deptId = response.data.deptId;
this.getUserListByDeptId(this.user.dept.deptId);
});
}, },
methods: { getBuildingList(projectId, type) {
/** console.log("changeme");
* 判断select是否可选 if (type == "change") {
*/ this.form.buildingIds = null;
checkSelect(row) { this.form.projectIdV = projectId;
return row.statusName=='任务待执行' }
}, const selectProject = this.projectOptions.find((x) => x.id == projectId);
if (selectProject) {
this.form.projectBusiness = selectProject.business || "";
this.form.businessStatus = selectProject.businessStatus || "";
this.form.propertyManagement =
selectProject.propertyManagement || false;
}
getUserListByDeptId(deptId) { getBuildingList(projectId).then((response) => {
getUserListByDeptId(deptId).then(response => { this.buildingOption = response.data;
this.userOptions = response.data; });
},
/** 查询风险计划列表 */
getList() {
this.loading = true;
listPlan(this.queryParams).then((response) => {
this.planList = response.rows;
this.total = response.total;
this.loading = false;
});
},
/** 查询部门下拉树结构 */
getDeptTree() {
deptTreeSelect().then((response) => {
this.deptOptions = response.data;
});
},
// 筛选节点
filterNode(value, data) {
console.log(" filterNode");
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
// 节点单击事件
handleNodeClick(data) {
console.log(" handleNodeClick");
// console.log(data);
// this.queryParams.deptId = data.id;
// this.handleQuery();
//更新组长和成员人员列表
this.getUserListByDeptId(data.id);
this.form.deptId = data.id;
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
createDeptId: null,
projectName: null,
createUserName: null,
leaderUserName: null,
workUserName: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map((item) => item.id);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.getUser();
this.open = true;
this.title = "创建任务";
},
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
this.getUser();
const id = row.id || this.ids;
getPlan(id).then((response) => {
this.form = response.data;
var projectIdV = response.data.projectId;
this.getBuildingList(response.data.projectId, "edit");
//执行人员
var workUserArr = [];
response.data.workUserIds.split(",").forEach((item) => {
workUserArr.push(item * 1);
}); });
}, this.form.workUserIds = workUserArr;
//楼栋信息
var buildingsArr = [];
remoteMethod(query) { response.data.buildingIds.split(",").forEach((item) => {
if (query !== '') { buildingsArr.push(item * 1);
this.loading = true;
getProjectList(query).then(response => {
this.loading = false;
this.projectOptions = response.data;
});
} else {
this.projectOptions = [];
}
},
getUser() {
getUserProfile().then(response => {
this.user = response.data;
//console.log(this.user)
this.form.deptId = response.data.deptId;
this.getUserListByDeptId(this.user.dept.deptId);
}); });
}, this.form.buildingIds = buildingsArr;
getBuildingList(projectId,type) {
console.log("changeme"); this.form.projectId = response.data.projectName;
if(type=='change'){ this.form.projectIdV = projectIdV;
this.form.buildingIds=null;
this.form.projectIdV=projectId;
}
const selectProject =this.projectOptions.find(x=>x.id==projectId)
if(selectProject){
this.form.projectBusiness = selectProject.business||''
}
getBuildingList(projectId).then(response => {
this.buildingOption = response.data;
});
},
/** 查询风险计划列表 */
getList() {
this.loading = true;
listPlan(this.queryParams).then(response => {
this.planList = response.rows;
this.total = response.total;
this.loading = false;
});
},
/** 查询部门下拉树结构 */
getDeptTree() {
deptTreeSelect().then(response => {
this.deptOptions = response.data;
});
},
// 筛选节点
filterNode(value, data) {
console.log(" filterNode");
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
// 节点单击事件
handleNodeClick(data) {
console.log(" handleNodeClick");
// console.log(data);
// this.queryParams.deptId = data.id;
// this.handleQuery();
//更新组长和成员人员列表
this.getUserListByDeptId(data.id);
this.form.deptId=data.id;
},
// 取消按钮
cancel() {
this.open = false;
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
name: null,
createDeptId: null,
projectName: null,
createUserName: null,
leaderUserName: null,
workUserName: null,
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.id)
this.single = selection.length !== 1
this.multiple = !selection.length
},
/** 新增按钮操作 */
handleAdd() {
this.reset();
this.getUser();
this.open = true; this.open = true;
this.title = "创建任务"; this.title = "修改风险计划";
}, });
/** 修改按钮操作 */ },
handleUpdate(row) { /** 提交按钮 */
this.reset(); submitForm() {
this.getUser(); this.$refs["form"].validate((valid) => {
const id = row.id || this.ids if (valid) {
getPlan(id).then(response => { this.form.buildingIds = this.form.buildingIds.join();
this.form = response.data; this.form.workUserIds = this.form.workUserIds.join();
var projectIdV=response.data.projectId;
this.getBuildingList(response.data.projectId,"edit"); if (this.form.id != null) {
//执行人员 this.form.projectId = this.form.projectIdV;
var workUserArr=[]; updatePlan(this.form).then((response) => {
response.data.workUserIds.split(',').forEach(item=>{ this.$modal.msgSuccess("修改成功");
workUserArr.push(item*1) this.open = false;
}); this.getList();
this.form.workUserIds = workUserArr; });
//楼栋信息 } else {
var buildingsArr=[]; addPlan(this.form).then((response) => {
response.data.buildingIds.split(',').forEach(item=>{ this.$modal.msgSuccess("新增成功");
buildingsArr.push(item*1) this.open = false;
}); this.getList();
this.form.buildingIds = buildingsArr; });
this.form.projectId=response.data.projectName;
this.form.projectIdV=projectIdV;
this.open = true;
this.title = "修改风险计划";
});
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
this.form.buildingIds=this.form.buildingIds.join();
this.form.workUserIds=this.form.workUserIds.join();
if (this.form.id != null) {
this.form.projectId=this.form.projectIdV;
updatePlan(this.form).then(response => {
this.$modal.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addPlan(this.form).then(response => {
this.$modal.msgSuccess("新增成功");
this.open = false;
this.getList();
});
}
} }
}); }
}, });
/** 删除按钮操作 */ },
handleDelete(row) { /** 删除按钮操作 */
const ids = row.id || this.ids; handleDelete(row) {
this.$modal.confirm('是否确认删除风险计划编号为"' + ids + '"的数据项?').then(function() { const ids = row.id || this.ids;
this.$modal
.confirm('是否确认删除风险计划编号为"' + ids + '"的数据项?')
.then(function () {
return delPlan(ids); return delPlan(ids);
}).then(() => { })
.then(() => {
this.getList(); this.getList();
this.$modal.msgSuccess("删除成功"); this.$modal.msgSuccess("删除成功");
}).catch(() => {}); })
}, .catch(() => {});
/** 导出按钮操作 */ },
handleExport() { /** 导出按钮操作 */
this.download('system/plan/export', { handleExport() {
...this.queryParams this.download(
}, `plan_${new Date().getTime()}.xlsx`) "system/plan/export",
} {
} ...this.queryParams,
}; },
`plan_${new Date().getTime()}.xlsx`
);
},
},
};
</script> </script>
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