Skip to content

bdc / bdcjg-web

Go to a project
Toggle navigation
Toggle navigation pinning
21f1641f by renchao@pashanhoo.com
Options

style:配置

2 parents 5562fbe1 35abf7c0
Inline Side-by-side
Showing 39 changed files with 1563 additions and 1100 deletions
1 ### 1 ###
2 # @Description: 2 # @Description:
3 # @Autor: renchao 3 # @Autor: renchao
4 # @LastEditTime: 2023-05-12 13:23:31 4 # @LastEditTime: 2023-05-15 10:37:45
5 ###
6 # just a flag
7 ENV = 'development' 5 ENV = 'development'
8 NODE_ENV=development 6 NODE_ENV=development
9 # base api 7 # base api
10 VUE_APP_BASE_API = '/api' 8 VUE_APP_BASE_API = '/api'
11 9
12 # 开发环境 10 # 开发环境
13 VUE_APP_API_BASE_URL = 'http://192.168.2.89:8027' 11 VUE_APP_API_BASE_URL = 'http://192.168.2.38:8026'
......
1 /*
2 * @Description: 干部查询
3 * @Autor:
4 * @LastEditTime: 2023-05-12 16:20:40
5 */
6 /* 引入axios请求文件 */
7 import request from '@/utils/request'
8 /* 引入配置 */
9 let SERVER = window.config ? window.config : JSON.parse(localStorage.getItem('ApiUrl'))
10 const urlHeader = SERVER.SERVERAPI + '/rest/searchRecord'
11
12 /**
13 * @description: 获取列表
14 * @param {*}
15 * @author:
16 */
17 export function getSearchRecordList (data) {
18 return request({
19 url: urlHeader + '/getList',
20 method: 'post',
21 data
22 })
23 }
24
25 /**
26 * @description: 新增
27 * @param {*} data
28 * @author:
29 */
30 export function saveSearchRecord (data) {
31 return request({
32 url: urlHeader + '/search',
33 method: 'post',
34 data
35 })
36 }
37
38
39 /**
40 * @description: 编辑
41 * @param {*} id
42 * @author:
43 */
44 export function editSearchRecord (id) {
45 return request({
46 url: urlHeader + '/' + id,
47 method: 'get'
48 })
49 }
...@@ -52,19 +52,19 @@ export const constantRoutes = [ ...@@ -52,19 +52,19 @@ export const constantRoutes = [
52 export const asyncRoutes = [ 52 export const asyncRoutes = [
53 // 区县接入 53 // 区县接入
54 { 54 {
55 path: '/jsbwcx', 55 path: '/qxjr',
56 component: Layout, 56 component: Layout,
57 children: [ 57 children: [
58 // { 58 {
59 // path: 'xxcx', 59 path: 'gbxxcx',
60 // component: () => import('@/views/gbxxcx/index'), 60 component: () => import('@/views/qxjr/gbxxcx/index'),
61 // name: 'xxcx', 61 name: 'gbxxcx',
62 // meta: { title: '信息查询', icon: 'xxcx' } 62 meta: { title: '信息查询', icon: 'zsgl' }
63 // }, 63 },
64 { 64 {
65 path: 'qxjr', 65 path: 'jsbwcx',
66 component: () => import('@/views/jsbwcx/index'), 66 component: () => import('@/views/qxjr/jsbwcx/index'),
67 name: 'qxjr', 67 name: 'jsbwcx',
68 meta: { title: '区县接入', icon: 'zsgl' } 68 meta: { title: '区县接入', icon: 'zsgl' }
69 } 69 }
70 ] 70 ]
......
...@@ -3,9 +3,7 @@ ...@@ -3,9 +3,7 @@
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="80px"> 4 <el-form ref="form" :model="form" label-width="80px">
5 <!-- 判断进入监管还是上报系统 --> 5 <!-- 判断进入监管还是上报系统 -->
6 <el-form-item v-if="BASE_API.THEME == 'jg'"> 6 <Breadcrumb />
7 <Breadcrumb />
8 </el-form-item>
9 <!-- <el-row> 7 <!-- <el-row>
10 <el-col :span="5"> 8 <el-col :span="5">
11 <el-form-item label="行政区"> 9 <el-form-item label="行政区">
......
...@@ -3,9 +3,7 @@ ...@@ -3,9 +3,7 @@
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="120px"> 4 <el-form ref="form" :model="form" label-width="120px">
5 <!-- 判断进入监管还是上报系统 --> 5 <!-- 判断进入监管还是上报系统 -->
6 <el-form-item v-if="BASE_API.THEME == 'jg'"> 6 <Breadcrumb />
7 <Breadcrumb />
8 </el-form-item>
9 <el-row class="mb-5"> 7 <el-row class="mb-5">
10 <el-col :span="6"> 8 <el-col :span="6">
11 <el-form-item label="行政区"> 9 <el-form-item label="行政区">
......
...@@ -3,9 +3,7 @@ ...@@ -3,9 +3,7 @@
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="150px"> 4 <el-form ref="form" :model="form" label-width="150px">
5 <!-- 判断进入监管还是上报系统 --> 5 <!-- 判断进入监管还是上报系统 -->
6 <el-form-item v-if="BASE_API.THEME == 'jg'"> 6 <Breadcrumb />
7 <Breadcrumb />
8 </el-form-item>
9 <el-row> 7 <el-row>
10 <el-col :span="5"> 8 <el-col :span="5">
11 <el-form-item label="行政区" label-width="100px"> 9 <el-form-item label="行政区" label-width="100px">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="fdcqdz from-clues"> 2 <div class="fdcqdz from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="120px"> 4 <el-form ref="form" :model="form" label-width="120px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5"> 6 <el-row class="mb-5">
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="fdcqqfsyq from-clues"> 2 <div class="fdcqqfsyq from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="80px"> 4 <el-form ref="form" :model="form" label-width="80px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5"> 6 <el-row class="mb-5">
9 <el-col :span="5"> 7 <el-col :span="5">
10 <el-form-item label="业务号"> 8 <el-form-item label="业务号">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="fdcqyz from-clues"> 2 <div class="fdcqyz from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="120px"> 4 <el-form ref="form" :model="form" label-width="120px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5"> 6 <el-row class="mb-5">
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="gzwsyq from-clues"> 2 <div class="gzwsyq from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="105px"> 4 <el-form ref="form" :model="form" label-width="105px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row> 6 <el-row>
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="hysyq from-clues"> 2 <div class="hysyq from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="105px"> 4 <el-form ref="form" :model="form" label-width="105px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row> 6 <el-row>
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="jsydzjdsyq from-clues"> 2 <div class="jsydzjdsyq from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="120px"> 4 <el-form ref="form" :model="form" label-width="120px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5"> 6 <el-row class="mb-5">
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="lq from-clues"> 2 <div class="lq from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="105px"> 4 <el-form ref="form" :model="form" label-width="105px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row> 6 <el-row>
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="from-clues"> 2 <div class="from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="105px"> 4 <el-form ref="form" :model="form" label-width="105px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row> 6 <el-row>
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="tdsyq from-clues"> 2 <div class="tdsyq from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="120px"> 4 <el-form ref="form" :model="form" label-width="120px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5"> 6 <el-row class="mb-5">
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="from-clues"> 2 <div class="from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="110px"> 4 <el-form ref="form" :model="form" label-width="110px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5"> 6 <el-row class="mb-5">
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区" label-width="106px"> 8 <el-form-item label="行政区" label-width="106px">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="from-clues"> 2 <div class="from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="105px"> 4 <el-form ref="form" :model="form" label-width="105px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row> 6 <el-row>
9 <el-col :span="5"> 7 <el-col :span="5">
10 <el-form-item label="行政区" label-width="80px"> 8 <el-form-item label="行政区" label-width="80px">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="cancellationReg from-clues"> 2 <div class="cancellationReg from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="105px"> 4 <el-form ref="form" :model="form" label-width="105px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row> 6 <el-row>
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="行政区"> 8 <el-form-item label="行政区">
......
...@@ -4,9 +4,7 @@ ...@@ -4,9 +4,7 @@
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="form" :model="form" label-width="100px"> 6 <el-form ref="form" :model="form" label-width="100px">
7 <el-form-item v-if="BASE_API.THEME == 'jg'"> 7 <Breadcrumb />
8 <Breadcrumb />
9 </el-form-item>
10 <el-row class="mb-5"> 8 <el-row class="mb-5">
11 <el-col :span="4"> 9 <el-col :span="4">
12 <el-form-item label="开始日期" prop="startTime" class="d-flex"> 10 <el-form-item label="开始日期" prop="startTime" class="d-flex">
...@@ -39,300 +37,300 @@ ...@@ -39,300 +37,300 @@
39 </div> 37 </div>
40 </template> 38 </template>
41 <script> 39 <script>
42 import { mapGetters } from "vuex"; 40 import { mapGetters } from "vuex";
43 import efficient from "@/api/efficient"; 41 import efficient from "@/api/efficient";
44 import { getFirstDayOfSeason, timeFormat } from "@/utils/operation"; 42 import { getFirstDayOfSeason, timeFormat } from "@/utils/operation";
45 export default { 43 export default {
46 name: "jktj", 44 name: "jktj",
47 data () { 45 data () {
48 return { 46 return {
49 // 开始日期限制 47 // 开始日期限制
50 pickerOptionsStart: { 48 pickerOptionsStart: {
51 disabledDate: (time) => { 49 disabledDate: (time) => {
52 if (this.form.endTime) { 50 if (this.form.endTime) {
53 return time.getTime() > new Date(this.form.endTime).getTime(); 51 return time.getTime() > new Date(this.form.endTime).getTime();
54 } 52 }
53 },
55 }, 54 },
56 }, 55 // 结束日期限制
57 // 结束日期限制 56 pickerOptionsEnd: {
58 pickerOptionsEnd: { 57 disabledDate: (time) => {
59 disabledDate: (time) => { 58 if (this.form.startTime) {
60 if (this.form.startTime) { 59 return time.getTime() < new Date(this.form.startTime).getTime();
61 return time.getTime() < new Date(this.form.startTime).getTime(); 60 }
62 } 61 },
63 }, 62 },
64 }, 63 form: {
65 form: { 64 startTime: getFirstDayOfSeason(),
66 startTime: getFirstDayOfSeason(), 65 endTime: timeFormat(new Date(), true),
67 endTime: timeFormat(new Date(), true), 66 },
68 }, 67 // 搜索表单
69 // 搜索表单 68 pieChartsData: [],
70 pieChartsData: [],
71 };
72 },
73 created () { },
74 mounted () {
75 this.getProcessCounts();
76 },
77 computed: {
78 ...mapGetters(["dicData"]),
79 },
80 methods: {
81 endTimeChange (val) {
82 this.form.endTime = timeFormat(new Date(val), true);
83 },
84 //查询各区县办件数量
85 async getProcessCounts () {
86 this.pieChartsData = [];
87 let { result: res } = await efficient.getProcessCounts(
88 this.form.startTime,
89 this.form.endTime
90 );
91 //获取图表配置项需要的数据
92 res.length > 0 &&
93 res.forEach((item) => {
94 this.pieChartsData.push({
95 //登记数量
96 value: item.counts,
97 //登记数量
98 name: item.recTypeName,
99 //登记类型代码
100 groupId: item.recType,
101 });
102 });
103 res.length &&
104 this.$nextTick(() => {
105 // 初始化图表
106 this.echartInit();
107 this.barChartInit(res[0].recType);
108 });
109 },
110 // 重置
111 resetForm () {
112 this.form = {
113 startTime: getFirstDayOfSeason(),
114 endTime: timeFormat(new Date(), true),
115 }; 69 };
70 },
71 created () { },
72 mounted () {
116 this.getProcessCounts(); 73 this.getProcessCounts();
117 }, 74 },
118 //玫瑰图初始化 75 computed: {
119 echartInit () { 76 ...mapGetters(["dicData"]),
120 let _this = this; 77 },
121 // 基于准备好的dom，初始化echarts实例 78 methods: {
122 let myChart = this.$echarts.init(document.getElementById("myChart")); 79 endTimeChange (val) {
123 // 绘制图表 80 this.form.endTime = timeFormat(new Date(val), true);
124 myChart.setOption({ 81 },
125 legend: { 82 //查询各区县办件数量
126 bottom: "-1%", 83 async getProcessCounts () {
127 left: "center", 84 this.pieChartsData = [];
128 textStyle: { 85 let { result: res } = await efficient.getProcessCounts(
129 color: this.BASE_API.echartTextColor, 86 this.form.startTime,
130 }, 87 this.form.endTime
131 }, 88 );
132 tooltip: { 89 //获取图表配置项需要的数据
133 trigger: "item", 90 res.length > 0 &&
134 formatter: "{b} : {c}", 91 res.forEach((item) => {
135 }, 92 this.pieChartsData.push({
136 label: { 93 //登记数量
137 color: 'inherit', 94 value: item.counts,
138 }, 95 //登记数量
139 series: [ 96 name: item.recTypeName,
140 { 97 //登记类型代码
141 name: "各业务类型办理数量", 98 groupId: item.recType,
142 type: "pie", 99 });
143 radius: [0, 250], 100 });
144 center: ["50%", "32%"], 101 res.length &&
145 roseType: "area", 102 this.$nextTick(() => {
146 itemStyle: { 103 // 初始化图表
147 borderRadius: 8, 104 this.echartInit();
105 this.barChartInit(res[0].recType);
106 });
107 },
108 // 重置
109 resetForm () {
110 this.form = {
111 startTime: getFirstDayOfSeason(),
112 endTime: timeFormat(new Date(), true),
113 };
114 this.getProcessCounts();
115 },
116 //玫瑰图初始化
117 echartInit () {
118 let _this = this;
119 // 基于准备好的dom，初始化echarts实例
120 let myChart = this.$echarts.init(document.getElementById("myChart"));
121 // 绘制图表
122 myChart.setOption({
123 legend: {
124 bottom: "-1%",
125 left: "center",
126 textStyle: {
127 color: this.BASE_API.echartTextColor,
148 }, 128 },
149 data: this.pieChartsData,
150 }, 129 },
151 ], 130 tooltip: {
152 }); 131 trigger: "item",
153 //添加点击事件 132 formatter: "{b} : {c}",
154 myChart.on("click", function (param) { 133 },
155 _this.barChartInit(param.data.groupId); 134 label: {
156 }); 135 color: 'inherit',
157 //默认选中第一个 136 },
158 let index = 1; 137 series: [
159 myChart.dispatchAction({ 138 {
160 type: "highlight", 139 name: "各业务类型办理数量",
161 seriesIndex: 0, 140 type: "pie",
162 dataIndex: 0, 141 radius: [0, 250],
163 }); 142 center: ["50%", "32%"],
164 myChart.on("mouseover", function (e) { 143 roseType: "area",
165 if (e.dataIndex != index) { 144 itemStyle: {
166 myChart.dispatchAction({ 145 borderRadius: 8,
167 type: "downplay", 146 },
168 seriesIndex: 0, 147 data: this.pieChartsData,
169 dataIndex: index, 148 },
170 }); 149 ],
171 } 150 });
172 }); 151 //添加点击事件
173 myChart.on("mouseout", function (e) { 152 myChart.on("click", function (param) {
174 index = e.dataIndex; 153 _this.barChartInit(param.data.groupId);
154 });
155 //默认选中第一个
156 let index = 1;
175 myChart.dispatchAction({ 157 myChart.dispatchAction({
176 type: "highlight", 158 type: "highlight",
177 seriesIndex: 0, 159 seriesIndex: 0,
178 dataIndex: e.dataIndex, 160 dataIndex: 0,
179 }); 161 });
180 }); 162 myChart.on("mouseover", function (e) {
181 }, 163 if (e.dataIndex != index) {
182 //柱图初始化 164 myChart.dispatchAction({
183 async barChartInit (recType) { 165 type: "downplay",
184 //请求recType对应业务的各区县数据 166 seriesIndex: 0,
185 let { result: res } = await efficient.getProcessDays( 167 dataIndex: index,
186 recType, 168 });
187 this.form.startTime, 169 }
188 this.form.endTime
189 );
190 //行政区数组
191 let xzqArr = [];
192 this.dicData["A20"].forEach((item) => {
193 xzqArr.push(item.DNAME);
194 let tempArr = res.filter((i) => {
195 return i.qxdm == item.DCODE;
196 }); 170 });
197 if (tempArr.length) { 171 myChart.on("mouseout", function (e) {
198 item.avgDay = tempArr[0].avgDay; 172 index = e.dataIndex;
199 item.maxDay = tempArr[0].maxDay; 173 myChart.dispatchAction({
200 item.minDay = tempArr[0].minDay; 174 type: "highlight",
201 } else { 175 seriesIndex: 0,
202 item.avgDay = 0; 176 dataIndex: e.dataIndex,
203 item.maxDay = 0; 177 });
204 item.minDay = 0; 178 });
205 } 179 },
206 }); 180 //柱图初始化
207 //补全无数据行政区后的结果数组 181 async barChartInit (recType) {
208 let dealArr = [...this.dicData["A20"]]; 182 //请求recType对应业务的各区县数据
209 let myChartBar = this.$echarts.init( 183 let { result: res } = await efficient.getProcessDays(
210 document.getElementById("myChart-bar") 184 recType,
211 ); 185 this.form.startTime,
212 myChartBar.setOption({ 186 this.form.endTime
213 color: ["#00bdb1", "#ff6e6e", "#3f99ff", "#ffaf48"], 187 );
214 tooltip: { 188 //行政区数组
215 show: true, 189 let xzqArr = [];
216 trigger: "axis", 190 this.dicData["A20"].forEach((item) => {
217 textStyle: { 191 xzqArr.push(item.DNAME);
218 fontSize: 16, // 字体大小 192 let tempArr = res.filter((i) => {
219 }, 193 return i.qxdm == item.DCODE;
220 extraCssText: "width:220px;height:160px;", // 背景色 194 });
221 }, 195 if (tempArr.length) {
222 grid: { 196 item.avgDay = tempArr[0].avgDay;
223 top: 120, 197 item.maxDay = tempArr[0].maxDay;
224 }, 198 item.minDay = tempArr[0].minDay;
225 legend: { 199 } else {
226 data: ["最短用时", "平均用时", "最长用时"], 200 item.avgDay = 0;
227 top: 20, 201 item.maxDay = 0;
228 textStyle: { 202 item.minDay = 0;
203 }
204 });
205 //补全无数据行政区后的结果数组
206 let dealArr = [...this.dicData["A20"]];
207 let myChartBar = this.$echarts.init(
208 document.getElementById("myChart-bar")
209 );
210 myChartBar.setOption({
211 color: ["#00bdb1", "#ff6e6e", "#3f99ff", "#ffaf48"],
212 tooltip: {
229 show: true, 213 show: true,
230 color: this.BASE_API.echartTextColor, 214 trigger: "axis",
231 fontSize: "16", 215 textStyle: {
232 }, 216 fontSize: 16, // 字体大小
233 },
234 xAxis: [
235 {
236 type: "category",
237 data: xzqArr,
238 axisLabel: {
239 interval: 0,
240 textStyle: {
241 show: true,
242 color: this.BASE_API.echartTextColor,
243 fontSize: "16",
244 },
245 }, 217 },
218 extraCssText: "width:220px;height:160px;", // 背景色
246 }, 219 },
247 ], 220 grid: {
248 yAxis: [ 221 top: 120,
249 { 222 },
250 type: "value", 223 legend: {
251 name: "单位：天", 224 data: ["最短用时", "平均用时", "最长用时"],
252 nameTextStyle: { 225 top: 20,
253 color: this.BASE_APIechartTextColor, 226 textStyle: {
227 show: true,
228 color: this.BASE_API.echartTextColor,
254 fontSize: "16", 229 fontSize: "16",
255 }, 230 },
256 axisLabel: { 231 },
257 textStyle: { 232 xAxis: [
258 show: true, 233 {
259 color: this.BASE_API.echartTextColor, 234 type: "category",
235 data: xzqArr,
236 axisLabel: {
237 interval: 0,
238 textStyle: {
239 show: true,
240 color: this.BASE_API.echartTextColor,
241 fontSize: "16",
242 },
243 },
244 },
245 ],
246 yAxis: [
247 {
248 type: "value",
249 name: "单位：天",
250 nameTextStyle: {
251 color: this.BASE_APIechartTextColor,
260 fontSize: "16", 252 fontSize: "16",
261 }, 253 },
254 axisLabel: {
255 textStyle: {
256 show: true,
257 color: this.BASE_API.echartTextColor,
258 fontSize: "16",
259 },
260 },
262 }, 261 },
262 ],
263 label: {
264 color: 'inherit',
263 }, 265 },
264 ], 266 series: [
265 label: { 267 {
266 color: 'inherit', 268 type: "bar",
267 }, 269 //显示数值
268 series: [ 270 itemStyle: {
269 { 271 normal: {
270 type: "bar", 272 label: {
271 //显示数值 273 show: true, //开启显示
272 itemStyle: { 274 position: "top", //在上方显示
273 normal: {
274 label: {
275 show: true, //开启显示
276 position: "top", //在上方显示
277 275
276 },
278 }, 277 },
279 }, 278 },
279 barMaxWidth: "60",
280 name: "最短用时",
281 data: dealArr.map((item) => item.minDay),
280 }, 282 },
281 barMaxWidth: "60", 283 {
282 name: "最短用时", 284 type: "bar",
283 data: dealArr.map((item) => item.minDay), 285 //显示数值
284 }, 286 itemStyle: {
285 { 287 normal: {
286 type: "bar", 288 label: {
287 //显示数值 289 show: true, //开启显示
288 itemStyle: { 290 position: "top", //在上方显示
289 normal: {
290 label: {
291 show: true, //开启显示
292 position: "top", //在上方显示
293 291
292 },
294 }, 293 },
295 }, 294 },
295 barMaxWidth: "60",
296 name: "平均用时",
297 data: dealArr.map((item) => item.avgDay),
296 }, 298 },
297 barMaxWidth: "60", 299 {
298 name: "平均用时", 300 type: "bar",
299 data: dealArr.map((item) => item.avgDay), 301 //显示数值
300 }, 302 itemStyle: {
301 { 303 normal: {
302 type: "bar", 304 label: {
303 //显示数值 305 show: true, //开启显示
304 itemStyle: { 306 position: "top", //在上方显示
305 normal: {
306 label: {
307 show: true, //开启显示
308 position: "top", //在上方显示
309 307
308 },
310 }, 309 },
311 }, 310 },
311 barMaxWidth: "60",
312 name: "最长用时",
313 data: dealArr.map((item) => item.maxDay),
312 }, 314 },
313 barMaxWidth: "60", 315 ],
314 name: "最长用时", 316 });
315 data: dealArr.map((item) => item.maxDay), 317 },
316 },
317 ],
318 });
319 }, 318 },
320 }, 319 };
321 };
322 </script> 320 </script>
323 <style scoped lang="scss"> 321 <style scoped lang="scss">
324 .jktjDetail { 322 .jktjDetail {
325 flex-direction: column; 323 flex-direction: column;
326 324
327 .rows { 325 .rows {
328 margin-left: 100px; 326 margin-left: 100px;
329 } 327 }
330 328
331 .center { 329 .center {
332 line-height: 50vh; 330 line-height: 50vh;
333 text-align: center; 331 text-align: center;
334 color: #b6b5b5; 332 color: #b6b5b5;
333 }
335 } 334 }
336 }
337 </style> 335 </style>
338 336
......
...@@ -4,9 +4,7 @@ ...@@ -4,9 +4,7 @@
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="form" :model="form" label-width="80px"> 6 <el-form ref="form" :model="form" label-width="80px">
7 <el-form-item v-if="BASE_API.THEME == 'jg'"> 7 <Breadcrumb />
8 <Breadcrumb />
9 </el-form-item>
10 <el-row class="mb-5"> 8 <el-row class="mb-5">
11 <el-col :span="4"> 9 <el-col :span="4">
12 <el-form-item label="行政区" class="d-flex"> 10 <el-form-item label="行政区" class="d-flex">
...@@ -47,256 +45,256 @@ ...@@ -47,256 +45,256 @@
47 </template> 45 </template>
48 46
49 <script> 47 <script>
50 import { mapGetters } from "vuex"; 48 import { mapGetters } from "vuex";
51 import { getFirstDayOfSeason, timeFormat } from "@/utils/operation"; 49 import { getFirstDayOfSeason, timeFormat } from "@/utils/operation";
52 import business from "@/api/business"; 50 import business from "@/api/business";
53 export default { 51 export default {
54 name: "jktj", 52 name: "jktj",
55 data () { 53 data () {
56 return { 54 return {
57 // 开始日期限制 55 // 开始日期限制
58 pickerOptionsStart: { 56 pickerOptionsStart: {
59 disabledDate: (time) => { 57 disabledDate: (time) => {
60 if (this.form.endTime) { 58 if (this.form.endTime) {
61 return time.getTime() > new Date(this.form.endTime).getTime(); 59 return time.getTime() > new Date(this.form.endTime).getTime();
62 } 60 }
63 },
64 },
65 // 结束日期限制
66 pickerOptionsEnd: {
67 disabledDate: (time) => {
68 if (this.form.startTime) {
69 return time.getTime() < new Date(this.form.startTime).getTime();
70 }
71 },
72 },
73 recTypeArr: [],
74 chartData: [],
75 // 搜索表单
76 form: {
77 startTime: getFirstDayOfSeason(),
78 endTime: timeFormat(new Date(), true),
79 qxdm: "",
80 },
81 interval: 50
82 };
83 },
84 mounted () {
85 // 查询成功率
86 this.getSuucessRate();
87 },
88 computed: {
89 ...mapGetters(["dicData"]),
90 },
91 methods: {
92 endTimeChange (val) {
93 this.form.endTime = timeFormat(new Date(val), true)
94 },
95 async getSuucessRate () {
96 this.recTypeArr = [];
97 this.chartData = [];
98 let { result: res } = await business.getSuucessRate(
99 this.form.startTime,
100 this.form.endTime,
101 this.form.qxdm
102 );
103 this.chartData = res;
104
105 let maxData = Math.max.apply(Math, this.chartData.map(item => { return item.failure }))
106 this.interval = Math.ceil(maxData / 10)
107 //行政区代码过滤
108 res.length > 0 &&
109 res.forEach((item) => {
110 this.recTypeArr.push(item.recTypeName);
111 });
112 this.$nextTick(() => {
113 // 初始化图表
114 this.chartData.length && this.echartInit();
115 });
116 },
117 // 重置
118 resetForm () {
119 this.form = {
120 startTime: getFirstDayOfSeason(),
121 endTime: timeFormat(new Date(), true),
122 qxdm: "",
123 };
124 this.getSuucessRate();
125 },
126 echartInit () {
127 let _this = this;
128 // 基于准备好的dom，初始化echarts实例
129 let myChart = this.$echarts.init(document.getElementById("myChart"));
130 // 绘制图表
131 myChart.setOption({
132 color: ["#13E5FF", "#C99E68", "#E873B2", "#ffaf48"],
133 tooltip: {
134 trigger: "axis",
135 formatter: '{b}<br/>{a0}：{c0}个<br/>{a1}：{c1}个<br/>{a2}：{c2}%',
136 axisPointer: {
137 type: "cross",
138 crossStyle: {
139 color: this.BASE_API.echartTextColor,
140 },
141 }, 61 },
142 }, 62 },
143 legend: { 63 // 结束日期限制
144 data: ["成功", "失败", "成功率"], 64 pickerOptionsEnd: {
145 top: '16', 65 disabledDate: (time) => {
146 textStyle: { 66 if (this.form.startTime) {
147 show: true, 67 return time.getTime() < new Date(this.form.startTime).getTime();
148 color: this.BASE_API.echartTextColor, 68 }
149 fontSize: "16",
150 }, 69 },
151 }, 70 },
152 label: { 71 recTypeArr: [],
153 color: 'inherit', 72 chartData: [],
73 // 搜索表单
74 form: {
75 startTime: getFirstDayOfSeason(),
76 endTime: timeFormat(new Date(), true),
77 qxdm: "",
154 }, 78 },
155 xAxis: [ 79 interval: 50
156 { 80 };
157 type: "category", 81 },
158 data: _this.recTypeArr, 82 mounted () {
83 // 查询成功率
84 this.getSuucessRate();
85 },
86 computed: {
87 ...mapGetters(["dicData"]),
88 },
89 methods: {
90 endTimeChange (val) {
91 this.form.endTime = timeFormat(new Date(val), true)
92 },
93 async getSuucessRate () {
94 this.recTypeArr = [];
95 this.chartData = [];
96 let { result: res } = await business.getSuucessRate(
97 this.form.startTime,
98 this.form.endTime,
99 this.form.qxdm
100 );
101 this.chartData = res;
102
103 let maxData = Math.max.apply(Math, this.chartData.map(item => { return item.failure }))
104 this.interval = Math.ceil(maxData / 10)
105 //行政区代码过滤
106 res.length > 0 &&
107 res.forEach((item) => {
108 this.recTypeArr.push(item.recTypeName);
109 });
110 this.$nextTick(() => {
111 // 初始化图表
112 this.chartData.length && this.echartInit();
113 });
114 },
115 // 重置
116 resetForm () {
117 this.form = {
118 startTime: getFirstDayOfSeason(),
119 endTime: timeFormat(new Date(), true),
120 qxdm: "",
121 };
122 this.getSuucessRate();
123 },
124 echartInit () {
125 let _this = this;
126 // 基于准备好的dom，初始化echarts实例
127 let myChart = this.$echarts.init(document.getElementById("myChart"));
128 // 绘制图表
129 myChart.setOption({
130 color: ["#13E5FF", "#C99E68", "#E873B2", "#ffaf48"],
131 tooltip: {
132 trigger: "axis",
133 formatter: '{b}<br/>{a0}：{c0}个<br/>{a1}：{c1}个<br/>{a2}：{c2}%',
159 axisPointer: { 134 axisPointer: {
160 type: "shadow", 135 type: "cross",
161 }, 136 crossStyle: {
162 axisLabel: {
163 textStyle: {
164 show: true,
165 color: this.BASE_API.echartTextColor, 137 color: this.BASE_API.echartTextColor,
166 fontSize: "16",
167 },
168 formatter: function (val) {
169 let c = document.createElement("canvas");
170 const ctx = c.getContext("2d");
171 const arr = val.split("");
172 arr
173 .map((item) => ctx.measureText(item).width)
174 .reduce((pre, next, index) => {
175 const nLen = pre + next;
176 if (nLen > 40) {
177 arr[index - 1] += "...";
178 return next;
179 } else {
180 return nLen;
181 }
182 });
183 c = null;
184 let ind = arr.findIndex((i) => {
185 return i.indexOf("...") > -1;
186 });
187 let newArr = ind > 0 ? arr.splice(0, ind + 1) : arr;
188 return newArr.join("");
189 }, 138 },
190 }, 139 },
191 }, 140 },
192 ], 141 legend: {
193 yAxis: [ 142 data: ["成功", "失败", "成功率"],
194 { 143 top: '16',
195 type: "value", 144 textStyle: {
196 name: "数量/个", 145 show: true,
197 nameTextStyle: {
198 color: this.BASE_API.echartTextColor, 146 color: this.BASE_API.echartTextColor,
199 fontSize: "16", 147 fontSize: "16",
200 }, 148 },
201 // interval: this.interval, 149 },
202 axisLabel: { 150 label: {
203 formatter: "{value}", 151 color: 'inherit',
204 textStyle: { 152 },
205 show: true, 153 xAxis: [
154 {
155 type: "category",
156 data: _this.recTypeArr,
157 axisPointer: {
158 type: "shadow",
159 },
160 axisLabel: {
161 textStyle: {
162 show: true,
163 color: this.BASE_API.echartTextColor,
164 fontSize: "16",
165 },
166 formatter: function (val) {
167 let c = document.createElement("canvas");
168 const ctx = c.getContext("2d");
169 const arr = val.split("");
170 arr
171 .map((item) => ctx.measureText(item).width)
172 .reduce((pre, next, index) => {
173 const nLen = pre + next;
174 if (nLen > 40) {
175 arr[index - 1] += "...";
176 return next;
177 } else {
178 return nLen;
179 }
180 });
181 c = null;
182 let ind = arr.findIndex((i) => {
183 return i.indexOf("...") > -1;
184 });
185 let newArr = ind > 0 ? arr.splice(0, ind + 1) : arr;
186 return newArr.join("");
187 },
188 },
189 },
190 ],
191 yAxis: [
192 {
193 type: "value",
194 name: "数量/个",
195 nameTextStyle: {
206 color: this.BASE_API.echartTextColor, 196 color: this.BASE_API.echartTextColor,
207 fontSize: "16", 197 fontSize: "16",
208 }, 198 },
199 // interval: this.interval,
200 axisLabel: {
201 formatter: "{value}",
202 textStyle: {
203 show: true,
204 color: this.BASE_API.echartTextColor,
205 fontSize: "16",
206 },
207 },
209 }, 208 },
210 }, 209 {
211 { 210 type: "value",
212 type: "value", 211 name: "成功率",
213 name: "成功率", 212 nameTextStyle: {
214 nameTextStyle: {
215 color: this.BASE_API.echartTextColor,
216 fontSize: "16",
217 },
218 splitNumber: 2,
219 axisLabel: {
220 formatter: "{value} %",
221 textStyle: {
222 show: true,
223 color: this.BASE_API.echartTextColor, 213 color: this.BASE_API.echartTextColor,
224 fontSize: "16", 214 fontSize: "16",
225 }, 215 },
216 splitNumber: 2,
217 axisLabel: {
218 formatter: "{value} %",
219 textStyle: {
220 show: true,
221 color: this.BASE_API.echartTextColor,
222 fontSize: "16",
223 },
224 },
226 }, 225 },
227 }, 226 ],
228 ], 227 series: [
229 series: [ 228 {
230 { 229 name: "成功",
231 name: "成功", 230 type: "bar",
232 type: "bar", 231 //显示数值
233 //显示数值 232 itemStyle: {
234 itemStyle: { 233 normal: {
235 normal: { 234 label: {
236 label: { 235 show: true, //开启显示
237 show: true, //开启显示 236 position: "top", //在上方显示
238 position: "top", //在上方显示 237 },
239 }, 238 },
240 }, 239 },
240 barMaxWidth: '60',
241 data: this.chartData.map((item) => {
242 return item.success;
243 }),
241 }, 244 },
242 barMaxWidth: '60', 245 {
243 data: this.chartData.map((item) => { 246 name: "失败",
244 return item.success; 247 type: "bar",
245 }), 248 //显示数值
246 }, 249 itemStyle: {
247 { 250 normal: {
248 name: "失败", 251 label: {
249 type: "bar", 252 show: true, //开启显示
250 //显示数值 253 position: "top", //在上方显示
251 itemStyle: { 254 },
252 normal: {
253 label: {
254 show: true, //开启显示
255 position: "top", //在上方显示
256 }, 255 },
257 }, 256 },
257 barMaxWidth: '60',
258 data: this.chartData.map((item) => {
259 return item.failure;
260 }),
258 }, 261 },
259 barMaxWidth: '60', 262 {
260 data: this.chartData.map((item) => { 263 name: "成功率",
261 return item.failure; 264 //显示数值
262 }), 265 itemStyle: {
263 }, 266 normal: {
264 { 267 label: {
265 name: "成功率", 268 show: true, //开启显示
266 //显示数值 269 position: "top", //在上方显示
267 itemStyle: { 270 },
268 normal: {
269 label: {
270 show: true, //开启显示
271 position: "top", //在上方显示
272 }, 271 },
273 }, 272 },
273 type: "line",
274 barMaxWidth: '60',
275 yAxisIndex: 1,
276 data: this.chartData.map((item) => {
277 return item.rate;
278 }),
274 }, 279 },
275 type: "line", 280 ],
276 barMaxWidth: '60', 281 });
277 yAxisIndex: 1, 282 },
278 data: this.chartData.map((item) => {
279 return item.rate;
280 }),
281 },
282 ],
283 });
284 }, 283 },
285 }, 284 };
286 };
287 </script> 285 </script>
288 <style scoped lang="scss"> 286 <style scoped lang="scss">
289 .jktjDetail { 287 .jktjDetail {
290 flex-direction: column; 288 flex-direction: column;
291 289
292 .rows { 290 .rows {
293 margin-left: 100px; 291 margin-left: 100px;
294 } 292 }
295 293
296 .center { 294 .center {
297 line-height: 50vh; 295 line-height: 50vh;
298 text-align: center; 296 text-align: center;
299 color: #b6b5b5; 297 color: #b6b5b5;
298 }
300 } 299 }
301 }
302 </style> 300 </style>
......
...@@ -4,9 +4,7 @@ ...@@ -4,9 +4,7 @@
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="ruleForm" :model="form" label-width="100px"> 6 <el-form ref="ruleForm" :model="form" label-width="100px">
7 <el-form-item v-if="BASE_API.THEME == 'jg'"> 7 <Breadcrumb />
8 <Breadcrumb />
9 </el-form-item>
10 <el-row class="mb-5"> 8 <el-row class="mb-5">
11 <el-col :span="6"> 9 <el-col :span="6">
12 <el-form-item label="接收日期" prop="startTime"> 10 <el-form-item label="接收日期" prop="startTime">
......
...@@ -4,9 +4,7 @@ ...@@ -4,9 +4,7 @@
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="ruleForm" :model="form" label-width="100px"> 6 <el-form ref="ruleForm" :model="form" label-width="100px">
7 <el-form-item v-if="BASE_API.THEME == 'jg'"> 7 <Breadcrumb />
8 <Breadcrumb />
9 </el-form-item>
10 <el-row class="mb-5"> 8 <el-row class="mb-5">
11 <el-col :span="6"> 9 <el-col :span="6">
12 <el-form-item label="接收日期" prop="startTime"> 10 <el-form-item label="接收日期" prop="startTime">
......
...@@ -14,9 +14,7 @@ ...@@ -14,9 +14,7 @@
14 <!-- 头部搜索 --> 14 <!-- 头部搜索 -->
15 <div class="from-clues-header"> 15 <div class="from-clues-header">
16 <el-form ref="ruleForm" :model="form" label-width="100px"> 16 <el-form ref="ruleForm" :model="form" label-width="100px">
17 <el-form-item v-if="BASE_API.THEME == 'jg'"> 17 <Breadcrumb />
18 <Breadcrumb />
19 </el-form-item>
20 <el-row class="mb-5"> 18 <el-row class="mb-5">
21 <el-col :span="6"> 19 <el-col :span="6">
22 <el-form-item label="接收日期" prop="startTime"> 20 <el-form-item label="接收日期" prop="startTime">
......
...@@ -4,9 +4,7 @@ ...@@ -4,9 +4,7 @@
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="form" :model="form" label-width="100px"> 6 <el-form ref="form" :model="form" label-width="100px">
7 <el-form-item v-if="BASE_API.THEME == 'jg'"> 7 <Breadcrumb />
8 <Breadcrumb />
9 </el-form-item>
10 <el-row class="mb-5"> 8 <el-row class="mb-5">
11 <el-col :span="4"> 9 <el-col :span="4">
12 <el-form-item label="行政区" class="d-flex"> 10 <el-form-item label="行政区" class="d-flex">
...@@ -46,184 +44,184 @@ ...@@ -46,184 +44,184 @@
46 </div> 44 </div>
47 </template> 45 </template>
48 <script> 46 <script>
49 import { mapGetters } from "vuex"; 47 import { mapGetters } from "vuex";
50 import efficient from "@/api/efficient"; 48 import efficient from "@/api/efficient";
51 import { getFirstDayOfSeason, timeFormat } from "@/utils/operation"; 49 import { getFirstDayOfSeason, timeFormat } from "@/utils/operation";
52 export default { 50 export default {
53 name: "jktj", 51 name: "jktj",
54 data () { 52 data () {
55 return { 53 return {
56 // 开始日期限制 54 // 开始日期限制
57 pickerOptionsStart: { 55 pickerOptionsStart: {
58 disabledDate: (time) => { 56 disabledDate: (time) => {
59 if (this.form.endTime) { 57 if (this.form.endTime) {
60 return time.getTime() > new Date(this.form.endTime).getTime(); 58 return time.getTime() > new Date(this.form.endTime).getTime();
61 } 59 }
60 },
62 }, 61 },
63 }, 62 // 结束日期限制
64 // 结束日期限制 63 pickerOptionsEnd: {
65 pickerOptionsEnd: { 64 disabledDate: (time) => {
66 disabledDate: (time) => { 65 if (this.form.startTime) {
67 if (this.form.startTime) { 66 return time.getTime() < new Date(this.form.startTime).getTime();
68 return time.getTime() < new Date(this.form.startTime).getTime(); 67 }
69 } 68 },
70 }, 69 },
71 }, 70 // 搜索表单
72 // 搜索表单 71 valueTime: "",
73 valueTime: "", 72 // 搜索表单
74 // 搜索表单 73 form: {
75 form: { 74 startTime: getFirstDayOfSeason(),
76 startTime: getFirstDayOfSeason(), 75 endTime: timeFormat(new Date(), true),
77 endTime: timeFormat(new Date(), true), 76 qxdm: "",
78 qxdm: "", 77 },
79 }, 78 chartData: []
80 chartData: []
81 };
82 },
83 mounted () {
84 // 查询业务量
85 this.getProcessCounts();
86 },
87 computed: {
88 ...mapGetters(["dicData"]),
89 },
90 methods: {
91 endTimeChange (val) {
92 this.form.endTime = timeFormat(new Date(val), true)
93 },
94 async getProcessCounts () {
95 this.chartData = [];
96 let { result: res } = await efficient.getProcessCounts(
97 this.form.startTime,
98 this.form.endTime,
99 this.form.qxdm
100 );
101 //获取图表配置项需要的数据
102 this.chartData = res;
103 this.$nextTick(() => {
104 // 初始化图表
105 this.chartData.length && this.echartInit(this.chartData)
106 });
107
108 },
109 // 重置
110 resetForm () {
111 this.form = {
112 startTime: getFirstDayOfSeason(),
113 endTime: timeFormat(new Date(), true),
114 qxdm: ""
115 }; 79 };
80 },
81 mounted () {
82 // 查询业务量
116 this.getProcessCounts(); 83 this.getProcessCounts();
117 }, 84 },
118 //图表渲染 85 computed: {
119 echartInit (chartArr) { 86 ...mapGetters(["dicData"]),
120 // 基于准备好的dom，初始化echarts实例 87 },
121 let myChart = this.$echarts.init(document.getElementById("myChart")); 88 methods: {
122 // 绘制图表 89 endTimeChange (val) {
123 myChart.setOption({ 90 this.form.endTime = timeFormat(new Date(val), true)
124 color: ["#13E5FF"], 91 },
125 tooltip: { 92 async getProcessCounts () {
126 show: true, 93 this.chartData = [];
127 trigger: "axis", 94 let { result: res } = await efficient.getProcessCounts(
128 textStyle: { 95 this.form.startTime,
129 fontSize: 16, // 字体大小 96 this.form.endTime,
97 this.form.qxdm
98 );
99 //获取图表配置项需要的数据
100 this.chartData = res;
101 this.$nextTick(() => {
102 // 初始化图表
103 this.chartData.length && this.echartInit(this.chartData)
104 });
105
106 },
107 // 重置
108 resetForm () {
109 this.form = {
110 startTime: getFirstDayOfSeason(),
111 endTime: timeFormat(new Date(), true),
112 qxdm: ""
113 };
114 this.getProcessCounts();
115 },
116 //图表渲染
117 echartInit (chartArr) {
118 // 基于准备好的dom，初始化echarts实例
119 let myChart = this.$echarts.init(document.getElementById("myChart"));
120 // 绘制图表
121 myChart.setOption({
122 color: ["#13E5FF"],
123 tooltip: {
124 show: true,
125 trigger: "axis",
126 textStyle: {
127 fontSize: 16, // 字体大小
128 },
130 }, 129 },
131 }, 130 grid: {
132 grid: { 131 top: 120,
133 top: 120, 132 bottom: 100,
134 bottom: 100, 133 },
135 }, 134 label: {
136 label: { 135 color: 'inherit',
137 color: 'inherit', 136 },
138 }, 137 xAxis: [
139 xAxis: [ 138 {
140 { 139 type: "category",
141 type: "category", 140 data: chartArr.map(item => item.recTypeName),
142 data: chartArr.map(item => item.recTypeName), 141 axisLabel: {
143 axisLabel: { 142 interval: 0,
144 interval: 0, 143 rotate: 40,
145 rotate: 40, 144 formatter: function (val) {
146 formatter: function (val) { 145 let c = document.createElement("canvas");
147 let c = document.createElement("canvas"); 146 const ctx = c.getContext("2d");
148 const ctx = c.getContext("2d"); 147 const arr = val.split("");
149 const arr = val.split(""); 148 arr
150 arr 149 .map((item) => ctx.measureText(item).width)
151 .map((item) => ctx.measureText(item).width) 150 .reduce((pre, next, index) => {
152 .reduce((pre, next, index) => { 151 const nLen = pre + next;
153 const nLen = pre + next; 152 if (nLen > 60) {
154 if (nLen > 60) { 153 arr[index - 1] += "...";
155 arr[index - 1] += "..."; 154 return next;
156 return next; 155 } else {
157 } else { 156 return nLen;
158 return nLen; 157 }
159 } 158 });
159 c = null;
160 let ind = arr.findIndex((i) => {
161 return i.indexOf("...") > -1;
160 }); 162 });
161 c = null; 163 let newArr = ind > 0 ? arr.splice(0, ind + 1) : arr;
162 let ind = arr.findIndex((i) => { 164 return newArr.join("");
163 return i.indexOf("...") > -1; 165 },
164 }); 166 textStyle: {
165 let newArr = ind > 0 ? arr.splice(0, ind + 1) : arr; 167 show: true,
166 return newArr.join(""); 168 color: this.BASE_API.echartTextColor,
167 }, 169 fontSize: "16",
168 textStyle: { 170 },
169 show: true,
170 color: this.BASE_API.echartTextColor,
171 fontSize: "16",
172 }, 171 },
173 }, 172 },
174 }, 173 ],
175 ], 174 yAxis: [
176 yAxis: [ 175 {
177 { 176 type: "value",
178 type: "value", 177 name: "数量/个",
179 name: "数量/个", 178 nameTextStyle: {
180 nameTextStyle: {
181 color: this.BASE_API.echartTextColor,
182 fontSize: "16",
183 },
184 axisLabel: {
185 textStyle: {
186 show: true,
187 color: this.BASE_API.echartTextColor, 179 color: this.BASE_API.echartTextColor,
188 fontSize: "16", 180 fontSize: "16",
189 }, 181 },
182 axisLabel: {
183 textStyle: {
184 show: true,
185 color: this.BASE_API.echartTextColor,
186 fontSize: "16",
187 },
188 },
190 }, 189 },
191 }, 190 ],
192 ],
193 191
194 series: [ 192 series: [
195 { 193 {
196 type: "bar", 194 type: "bar",
197 //显示数值 195 //显示数值
198 itemStyle: { 196 itemStyle: {
199 normal: { 197 normal: {
200 label: { 198 label: {
201 show: true, //开启显示 199 show: true, //开启显示
202 position: "top", //在上方显示 200 position: "top", //在上方显示
201 },
203 }, 202 },
204 }, 203 },
204 barMaxWidth: '60',
205 data: chartArr.map(item => item.counts),
205 }, 206 },
206 barMaxWidth: '60', 207 ],
207 data: chartArr.map(item => item.counts), 208 });
208 }, 209 },
209 ],
210 });
211 }, 210 },
212 }, 211 };
213 };
214 </script> 212 </script>
215 <style scoped lang="scss"> 213 <style scoped lang="scss">
216 .jktjDetail { 214 .jktjDetail {
217 flex-direction: column; 215 flex-direction: column;
218 216
219 .rows { 217 .rows {
220 margin-left: 100px; 218 margin-left: 100px;
221 } 219 }
222 220
223 .center { 221 .center {
224 line-height: 50vh; 222 line-height: 50vh;
225 text-align: center; 223 text-align: center;
226 color: #b6b5b5; 224 color: #b6b5b5;
225 }
227 } 226 }
228 }
229 </style> 227 </style>
......
1 <template>
2 <!-- 接收报文查询 -->
3 <div class="reportLog from-clues dialogCon">
4 <!-- 头部搜索 -->
5 <div class="from-clues-header">
6 <el-form ref="ruleForm" :model="form" label-width="100px">
7 <el-row class="mb-5">
8 <el-col :span="6">
9 <el-form-item label="权利人名称" prop="qlrmc">
10 <el-input v-model.trim="form.qlrmc" clearable class="width100" placeholder="权利人名称"></el-input>
11 </el-form-item>
12 </el-col>
13 <el-col :span="6">
14 <el-form-item label="证件号" prop="zjh">
15 <el-input v-model.trim="form.zjh" clearable class="width100" placeholder="证件号"></el-input>
16 </el-form-item>
17 </el-col>
18 <!-- 按钮操作 -->
19 <el-col :span="6" class="btnColRight">
20 <el-form-item>
21 <btn nativeType="cx" v-if="Object.keys(dataDetail).length == 0" @click="handleSearchResult">查询</btn>
22 </el-form-item>
23 </el-col>
24 </el-row>
25 </el-form>
26 </div>
27 <!-- 列表区域 -->
28 <div class="from-clues-content">
29 <lb-table ref="table" :page-size="pageData.size" :calcHeight="300" :current-page.sync="pageData.current" :total="tableData.total"
30 @size-change="handleSizeChange" @p-current-change="handleCurrentChange" :column="tableData.columns"
31 :data="tableData.data">
32 </lb-table>
33 </div>
34 </div>
35 </template>
36 <script>
37 // 接收报文查询
38 // 引入表格头部数据
39 import data from "../data";
40 // 引入table混入方法
41 import tableMixin from "@/mixins/tableMixin.js";
42 import { saveSearchRecord } from "@/api/searchRecord.js";
43 //引入日期处理方法
44 import { timeFormat } from "@/utils/operation";
45 export default {
46 name: "jsbwcx",
47 mixins: [tableMixin],
48 props: {
49 dataDetail: {
50 type: Object,
51 default: function () { return {} }
52 }
53 },
54 watch: {
55 dataDetail: {
56 handler (newName, oldName) {
57 let _this = this
58 this.$nextTick(() => {
59 _this.tableData.data = JSON.parse(newName.result)
60 _this.form.qlrmc = newName.zjmc ? newName.zjmc : ""
61 _this.form.zjh = newName.zjh ? newName.zjh : ""
62 })
63 },
64 immediate: true,
65 deep: true
66 }
67 },
68 data () {
69 return {
70 pickerOptionsStart: {
71 disabledDate: (time) => {
72 let endDateVal = this.form.receiveEndTime;
73 if (endDateVal) {
74 return (
75 time.getTime() >=
76 new Date(endDateVal).getTime()
77 );
78 }
79 },
80 },
81 pickerOptionsEnd: {
82 disabledDate: (time) => {
83 let beginDateVal = this.form.receiveStartTime;
84 if (beginDateVal) {
85 return (
86 time.getTime() <
87 new Date(beginDateVal).getTime()
88 );
89 }
90 },
91 },
92 // 表格数据
93 form: {
94 qlrmc: "", // 行政区
95 zjh: "" // 开始日期
96 },
97 // 校验规则
98 rules: {
99 pcode: [{ required: true, message: "请选择行政区", trigger: "change" }],
100 startTime: [
101 { required: true, message: "请选择开始日期", trigger: "change" },
102 ],
103 endTime: [
104 { required: true, message: "请选择结束日期", trigger: "change" },
105 ],
106 bdcdyh: [
107 { required: true, message: "不动产单元号", trigger: "change" },
108 ],
109 ywmc: [{ required: true, message: "业务名称", trigger: "change" }],
110 jcjg: [{ required: true, message: "检查结果", trigger: "change" }],
111 rkjg: [{ required: true, message: "入库结果", trigger: "change" }],
112 },
113 // 表格数据
114 tableData: {
115 // 表格头部
116 columns: [
117 {
118 label: "序号",
119 type: "index",
120 width: "50",
121 index: this.indexMethod,
122 },
123 {
124 prop: 'bdcdyh',
125 label: '不动产单元号',
126 width: 200
127 },
128 {
129 prop: "bdcqzh",
130 label: "不动产权证号",
131 width: 160,
132 },
133 {
134 prop: 'djsj',
135 label: '登记时间',
136 width: 200
137 },
138 {
139 prop: "fdzl",
140 label: "坐落",
141 width: 160,
142 },
143 {
144 prop: 'ghyt',
145 label: '用途',
146 width: 200
147 },
148 {
149 prop: "gyqk",
150 label: "共有情况",
151 width: 160,
152 },
153 {
154 prop: 'jzmj',
155 label: '建筑面积',
156 width: 100
157 },
158 {
159 prop: "qlrmc",
160 label: "权利人",
161 width: 100,
162 },
163 {
164 prop: "zjh",
165 label: "证件号",
166 width: 260,
167 },
168 ],
169 // 表格列表数据
170 total: 0,
171 data: [],
172 },
173 // 分页
174 pageData: {
175 total: 0,
176 pageSize: 10,
177 current: 1
178 },
179 title: "",
180 };
181 },
182 methods: {
183 //截止日期变化
184 endTimeChange (val) {
185 this.form.receiveEndTime = timeFormat(new Date(val), true)
186 },
187 // 初始化数据
188 queryClickSearch () {
189 saveSearchRecord({ ...this.form, ...this.formData }).then(
190 (res) => {
191 if (res.code === 200) {
192 this.tableData.data = res.result
193 } else {
194 this.$message.warning(res.message)
195 }
196 }
197 )
198 },
199 // 重置
200 resetForm () {
201 this.$refs.ruleForm.resetFields();
202 this.form.currentPage = 1
203 },
204 featchData () { },
205 handleSearchResult () {
206 this.queryClickSearch()
207 },
208 // 详情
209 handleDetails (row) {
210 }
211 }
212 }
213 </script>
214 <style scoped lang="scss">
215 .lastdom:nth-child(3) {
216 margin-bottom: 0px;
217 }
218 .from-clues-content {
219 background: none;
220 padding: 0;
221 }
222 </style>
223
1 /*
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-03-17 15:10:43
5 */
6 import filter from '@/utils/filter.js'
7 class data extends filter {
8 constructor() {
9 super()
10 }
11 columns () {
12 return [
13 {
14 prop: 'name',
15 label: '查询人员',
16 },
17 {
18 prop: 'zjh',
19 label: '查询证件号',
20 },
21 {
22 prop: "zjmc",
23 label: "查询证件名称",
24 },
25 {
26 prop: "createtime",
27 label: "查询时间",
28 },
29 // {
30 // prop: "result",
31 // label: "查询结果",
32 // }
33 ]
34 }
35 }
36 export default new data()
1 <template>
2 <!-- 接收报文查询 -->
3 <div class="reportLog from-clues">
4 <!-- 头部搜索 -->
5 <div class="from-clues-header">
6 <el-form ref="ruleForm" :model="form" label-width="100px">
7 <Breadcrumb />
8 <el-row class="mb-5">
9 <el-col :span="6">
10 <el-form-item label="查询人员" prop="qxdm">
11 <el-input v-model.trim="form.name" clearable class="width100" placeholder="查询人员"></el-input>
12 </el-form-item>
13 </el-col>
14 <el-col :span="6">
15 <el-form-item label="证件号" prop="zjh">
16 <el-input v-model.trim="form.zjh" clearable class="width100" placeholder="不动产单元号"></el-input>
17 </el-form-item>
18 </el-col>
19 <el-col :span="6">
20 <el-form-item label="查询证件名称" prop="zjmc">
21 <el-input v-model.trim="form.zjmc" clearable class="width100" placeholder="业务流水号"></el-input>
22 </el-form-item>
23 </el-col>
24 <el-col :span="6" class="btnColRight">
25 <el-form-item>
26 <btn nativeType="cz" @click="save">新增</btn>
27 <btn nativeType="cx" @click="handleSearch">查询</btn>
28 <!-- <btn nativeType="resetForm">重置</btn> -->
29 </el-form-item>
30 </el-col>
31 </el-row>
32 </el-form>
33 </div>
34 <!-- 列表区域 -->
35 <div class="from-clues-content">
36 <lb-table ref="table" :page-size="pageData.size" :current-page.sync="pageData.current" :total="tableData.total"
37 @size-change="handleSizeChange" @p-current-change="handleCurrentChange" :column="tableData.columns"
38 :data="tableData.data">
39 </lb-table>
40 </div>
41 <!-- 编辑 -->
42 <el-dialog :close-on-click-modal="false" top="0"
43 custom-class="dialogBox dataReporting editDialogBox sbdialog commonDialog mainCenter" :visible.sync="dialogVisible"
44 width="92%">
45 <div slot="title" class="dialog_title" ref="dialogTitle">
46 干部信息查询
47 </div>
48 <search-result ref="resultData" :dataDetail="dataDetail"></search-result>
49 </el-dialog>
50 </div>
51 </template>
52
53 <script>
54 import Vue from 'vue'
55 // 接收报文查询
56 // 引入表格头部数据
57 import data from "./data";
58 // 引入table混入方法
59 import tableMixin from "@/mixins/tableMixin.js";
60 import { getSearchRecordList, editSearchRecord } from "@/api/searchRecord.js";
61 // 引入详情弹框
62 import SearchResult from "./components/result";
63 //引入日期处理方法
64 import { timeFormat } from "@/utils/operation";
65 export default {
66 name: "jsbwcx",
67 mixins: [tableMixin],
68 // 注册组件
69 components: {
70 SearchResult
71 },
72 data () {
73 return {
74 dialogVisible: false,
75 pickerOptionsStart: {
76 disabledDate: (time) => {
77 let endDateVal = this.form.receiveEndTime;
78 if (endDateVal) {
79 return (
80 time.getTime() >=
81 new Date(endDateVal).getTime()
82 );
83 }
84 },
85 },
86 pickerOptionsEnd: {
87 disabledDate: (time) => {
88 let beginDateVal = this.form.receiveStartTime;
89 if (beginDateVal) {
90 return (
91 time.getTime() <
92 new Date(beginDateVal).getTime()
93 );
94 }
95 },
96 },
97 // 表格数据
98 form: {
99 qxdm: "", // 行政区
100 receiveStartTime: "", // 开始日期
101 receiveEndTime: "", // 结束日期
102 bdcdyh: "", // 不动产单元号
103 ywh: "", // 业务号
104 qllx: "", // 权利类型
105 djlx: "", // 登记类型
106 jcjg: "", // 检查结果
107 rkjg: "", //入库结果
108 currentPage: 1
109 },
110 // 校验规则
111 rules: {
112 pcode: [{ required: true, message: "请选择行政区", trigger: "change" }],
113 startTime: [
114 { required: true, message: "请选择开始日期", trigger: "change" },
115 ],
116 endTime: [
117 { required: true, message: "请选择结束日期", trigger: "change" },
118 ],
119 bdcdyh: [
120 { required: true, message: "不动产单元号", trigger: "change" },
121 ],
122 ywmc: [{ required: true, message: "业务名称", trigger: "change" }],
123 jcjg: [{ required: true, message: "检查结果", trigger: "change" }],
124 rkjg: [{ required: true, message: "入库结果", trigger: "change" }],
125 },
126 // 表格数据
127 tableData: {
128 // 表格头部
129 columns: [
130 {
131 label: "序号",
132 type: "index",
133 width: "50",
134 index: this.indexMethod,
135 }
136 ]
137 .concat(data.columns())
138 .concat([
139 {
140 label: "操作",
141 width: "90",
142 render: (h, scope) => {
143 return (
144 <div>
145 <el-button
146 type="text"
147 class='btnColor'
148 onClick={() => {
149 this.handleDetails(scope.row);
150 }}
151 >
152 详情
153 </el-button>
154 </div>
155 )
156 }
157 }
158 ]),
159 // 表格列表数据
160 total: 0,
161 data: []
162 },
163 // 分页
164 pageData: {
165 total: 0,
166 pageSize: 10,
167 current: 1
168 },
169 dataDetail: {}
170 }
171 },
172 methods: {
173 //截止日期变化
174 endTimeChange (val) {
175 this.form.receiveEndTime = timeFormat(new Date(val), true)
176 },
177 // 初始化数据
178 queryClick () {
179 getSearchRecordList({ ...this.form, ...this.formData }).then(
180 (res) => {
181 if (res.code === 200) {
182 let { total, records, current } = res.result;
183 this.tableData.total = total;
184 this.tableData.data = records ? records : [];
185 this.pageData.current = current
186 }
187 }
188 )
189 },
190 // 重置
191 resetForm () {
192 this.$refs.ruleForm.resetFields();
193 this.form.currentPage = 1
194 this.queryClick();
195 },
196 featchData () {
197 this.queryClick();
198 },
199 // 详情
200 handleDetails (row) {
201 editSearchRecord(row.bsm).then(res => {
202 this.dialogVisible = true
203 this.dataDetail = res.result
204 })
205 },
206 save () {
207 this.dialogVisible = true
208 }
209 }
210 }
211 </script>
212 <style scoped lang="scss">
213 .lastdom:nth-child(3) {
214 margin-bottom: 0px;
215 }
216 </style>
217
...@@ -4,9 +4,7 @@ ...@@ -4,9 +4,7 @@
4 <!-- 头部搜索 --> 4 <!-- 头部搜索 -->
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="ruleForm" :model="form" label-width="100px"> 6 <el-form ref="ruleForm" :model="form" label-width="100px">
7 <el-form-item v-if="BASE_API.THEME == 'jg'"> 7 <Breadcrumb />
8 <Breadcrumb />
9 </el-form-item>
10 <el-row class="mb-5"> 8 <el-row class="mb-5">
11 <el-col :span="6"> 9 <el-col :span="6">
12 <el-form-item label="行政区" prop="qxdm"> 10 <el-form-item label="行政区" prop="qxdm">
......
...@@ -5,9 +5,7 @@ ...@@ -5,9 +5,7 @@
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="ruleForm" :model="form" label-width="80px"> 6 <el-form ref="ruleForm" :model="form" label-width="80px">
7 <!-- 判断进入监管还是上报系统 --> 7 <!-- 判断进入监管还是上报系统 -->
8 <el-form-item v-if="BASE_API.THEME == 'jg'"> 8 <Breadcrumb />
9 <Breadcrumb />
10 </el-form-item>
11 <el-row> 9 <el-row>
12 <el-col :span="6"> 10 <el-col :span="6">
13 <el-form-item label="行政区"> 11 <el-form-item label="行政区">
...@@ -103,8 +101,8 @@ ...@@ -103,8 +101,8 @@
103 pageSize: 10, 101 pageSize: 10,
104 current: 1 102 current: 1
105 }, 103 },
106 // 表格数据 104 // 表格数据
107 tableData: { 105 tableData: {
108 // 表头 106 // 表头
109 columns: [ 107 columns: [
110 { 108 {
......
...@@ -5,9 +5,7 @@ ...@@ -5,9 +5,7 @@
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="ruleForm" :model="form" label-width="100px"> 6 <el-form ref="ruleForm" :model="form" label-width="100px">
7 <!-- 判断进入监管还是上报系统 --> 7 <!-- 判断进入监管还是上报系统 -->
8 <el-form-item v-if="BASE_API.THEME == 'jg'"> 8 <Breadcrumb />
9 <Breadcrumb />
10 </el-form-item>
11 <el-row class="mb-5"> 9 <el-row class="mb-5">
12 <el-col :span="6"> 10 <el-col :span="6">
13 <el-form-item label="行政区" prop="qxdm"> 11 <el-form-item label="行政区" prop="qxdm">
...@@ -141,8 +139,8 @@ ...@@ -141,8 +139,8 @@
141 pageSize: 10, 139 pageSize: 10,
142 current: 1 140 current: 1
143 }, 141 },
144 // 表格数据 142 // 表格数据
145 tableData: { 143 tableData: {
146 // 表头数据 144 // 表头数据
147 columns: [ 145 columns: [
148 { 146 {
......
...@@ -5,9 +5,7 @@ ...@@ -5,9 +5,7 @@
5 <div class="from-clues-header"> 5 <div class="from-clues-header">
6 <el-form ref="ruleForm" :model="form" label-width="100px"> 6 <el-form ref="ruleForm" :model="form" label-width="100px">
7 <!-- 判断进入监管还是上报系统 --> 7 <!-- 判断进入监管还是上报系统 -->
8 <el-form-item v-if="BASE_API.THEME == 'jg'"> 8 <Breadcrumb />
9 <Breadcrumb />
10 </el-form-item>
11 <el-row class="mb-5"> 9 <el-row class="mb-5">
12 <el-col :span="6"> 10 <el-col :span="6">
13 <el-form-item label="行政区" prop="qxdm"> 11 <el-form-item label="行政区" prop="qxdm">
......
1 <template> 1 <template>
2 <!-- 编辑 --> 2 <!-- 编辑 -->
3 <dialogBox submitForm="submitForm" class="tableClass dictionary" @closeDialog="closeDialog" @submitForm="handleSubmit" width="60%" 3 <dialogBox submitForm="submitForm" class="tableClass dictionary" @closeDialog="closeDialog" @submitForm="handleSubmit" width="70%"
4 v-model="myValue" :isMain="true" title="字典信息"> 4 v-model="myValue" :isMain="true" title="字典信息">
5 <div class="editDialogBox-box "> 5 <div class="editDialogBox-box ">
6 <el-form :model="ruleForm" ref="ruleForm" label-width="100px"> 6 <el-form :model="ruleForm" ref="ruleForm" label-width="100px">
......
...@@ -3,9 +3,7 @@ ...@@ -3,9 +3,7 @@
3 <!-- 表单部分 --> 3 <!-- 表单部分 -->
4 <div class="from-clues-header"> 4 <div class="from-clues-header">
5 <el-form @submit.native.prevent :model="ruleForm" label-width="120px"> 5 <el-form @submit.native.prevent :model="ruleForm" label-width="120px">
6 <el-form-item v-if="BASE_API.THEME == 'jg'"> 6 <Breadcrumb />
7 <Breadcrumb />
8 </el-form-item>
9 <el-row :gutter="20" class="mb-5"> 7 <el-row :gutter="20" class="mb-5">
10 <el-col :span="6"> 8 <el-col :span="6">
11 <el-form-item label="字典类型编码"> 9 <el-form-item label="字典类型编码">
......
...@@ -10,9 +10,7 @@ ...@@ -10,9 +10,7 @@
10 <div class="information from-clues"> 10 <div class="information from-clues">
11 <div class="from-clues-header"> 11 <div class="from-clues-header">
12 <el-form ref="ruleForm" label-width="100px"> 12 <el-form ref="ruleForm" label-width="100px">
13 <el-form-item v-if="BASE_API.THEME == 'jg'"> 13 <Breadcrumb />
14 <Breadcrumb />
15 </el-form-item>
16 <el-row class="mb-5"> 14 <el-row class="mb-5">
17 <el-col class="btnColRight"> 15 <el-col class="btnColRight">
18 <btn nativeType="cx" @click="information"> 16 <btn nativeType="cx" @click="information">
...@@ -34,38 +32,38 @@ ...@@ -34,38 +32,38 @@
34 </div> 32 </div>
35 </template> 33 </template>
36 <script> 34 <script>
37 import "@/utils/flexible.js"; 35 import "@/utils/flexible.js";
38 import BaseSet from "./base-set.vue"; 36 import BaseSet from "./base-set.vue";
39 import PasswordEdit from "./password-edit.vue"; 37 import PasswordEdit from "./password-edit.vue";
40 export default { 38 export default {
41 components: { 39 components: {
42 BaseSet, 40 BaseSet,
43 PasswordEdit, 41 PasswordEdit,
44 },
45 data () {
46 return {
47 isshow: true,
48 };
49 },
50 computed: {
51 userData () {
52 return this.$store.state.user.userInfo;
53 }, 42 },
54 }, 43 data () {
55 watch: {}, 44 return {
56 created () { }, 45 isshow: true,
57 mounted () { }, 46 };
58 methods: {
59 information () {
60 this.isshow = true;
61 }, 47 },
62 password () { 48 computed: {
63 this.isshow = false; 49 userData () {
50 return this.$store.state.user.userInfo;
51 },
64 }, 52 },
65 }, 53 watch: {},
66 }; 54 created () { },
55 mounted () { },
56 methods: {
57 information () {
58 this.isshow = true;
59 },
60 password () {
61 this.isshow = false;
62 },
63 },
64 };
67 </script> 65 </script>
68 66
69 <style scoped lang="scss"> 67 <style scoped lang="scss">
70 @import "~@/styles/mixin.scss"; 68 @import "~@/styles/mixin.scss";
71 </style> 69 </style>
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="from-clues"> 2 <div class="from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="ruleForm" :model="form" label-width="100px"> 4 <el-form ref="ruleForm" :model="form" label-width="100px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5"> 6 <el-row class="mb-5">
9 <el-col :span="4"> 7 <el-col :span="4">
10 <el-form-item label="角色名称" prop="rolesName"> 8 <el-form-item label="角色名称" prop="rolesName">
......
...@@ -2,9 +2,7 @@ ...@@ -2,9 +2,7 @@
2 <div class="from-clues"> 2 <div class="from-clues">
3 <div class="from-clues-header"> 3 <div class="from-clues-header">
4 <el-form ref="form" :model="form" label-width="80px"> 4 <el-form ref="form" :model="form" label-width="80px">
5 <el-form-item v-if="BASE_API.THEME == 'jg'"> 5 <Breadcrumb />
6 <Breadcrumb />
7 </el-form-item>
8 <el-row class="mb-5"> 6 <el-row class="mb-5">
9 <el-col :span="6"> 7 <el-col :span="6">
10 <el-form-item label="搜索标题"> 8 <el-form-item label="搜索标题">
......
1 <template> 1 <template>
2 <!-- 人员管理 --> 2 <!-- 人员管理 -->
3 <div class="from-clues"> 3 <div class="from-clues">
4 <div class="from-clues-header"> 4 <div class="from-clues-header">
5 <el-form ref="ruleForm" :model="form" label-width="100px"> 5 <el-form ref="ruleForm" :model="form" label-width="100px">
6 <el-form-item v-if="BASE_API.THEME == 'jg'"> 6 <Breadcrumb />
7 <Breadcrumb />
8 </el-form-item>
9 <el-row class="mb-5"> 7 <el-row class="mb-5">
10 <el-col :span="4"> 8 <el-col :span="4">
11 <el-form-item label="用户名" prop="loginName"> 9 <el-form-item label="用户名" prop="loginName">
...@@ -40,368 +38,368 @@ ...@@ -40,368 +38,368 @@
40 </div> 38 </div>
41 </template> 39 </template>
42 <script> 40 <script>
43 import { 41 import {
44 getUuid, 42 getUuid,
45 judgeSort, 43 judgeSort,
46 realMove, 44 realMove,
47 findParents, 45 findParents,
48 removeTreeListItem, 46 removeTreeListItem,
49 } from "@/utils/operation"; 47 } from "@/utils/operation";
50 import { 48 import {
51 resetPassword, 49 resetPassword,
52 getUserList, getUserLists 50 getUserList, getUserLists
53 } from "@/api/personnelManage"; 51 } from "@/api/personnelManage";
54 import { api, deleteAction, getAction } from '@/api/manageApi' 52 import { api, deleteAction, getAction } from '@/api/manageApi'
55 import data from "./data"; 53 import data from "./data";
56 import { deleteDomStr } from '@/utils/proDomStr' 54 import { deleteDomStr } from '@/utils/proDomStr'
57 import tableMixin from "@/mixins/tableMixin.js"; 55 import tableMixin from "@/mixins/tableMixin.js";
58 import EditDialog from "./edit-dialog.vue"; 56 import EditDialog from "./edit-dialog.vue";
59 import { updateOrder } from "@/api/orders" 57 import { updateOrder } from "@/api/orders"
60 export default { 58 export default {
61 name: "menus", 59 name: "menus",
62 mixins: [tableMixin], 60 mixins: [tableMixin],
63 components: { 61 components: {
64 EditDialog, 62 EditDialog,
65 }, 63 },
66 data () { 64 data () {
67 return { 65 return {
68 isDialog: false, 66 isDialog: false,
69 keyList: [], 67 keyList: [],
70 form: { 68 form: {
71 loginName: "", 69 loginName: "",
72 name: "", 70 name: "",
73 code: "", 71 code: "",
74 },
75 departmentId: "", // 部门ID
76 typeOptions: [
77 {
78 value: "0",
79 label: "姓名",
80 },
81 {
82 value: "1",
83 label: "工号",
84 },
85 {
86 value: "2",
87 label: "部门",
88 },
89 {
90 value: "3",
91 label: "机构",
92 }, 72 },
93 ], 73 departmentId: "", // 部门ID
94 74 typeOptions: [
95 selectionList: [],
96 // 表格数据
97 tableData: {
98 columns: [
99 { 75 {
100 label: "序号", 76 value: "0",
101 type: "index", 77 label: "姓名",
102 width: "50",
103 index: this.indexMethod,
104 }, 78 },
105 ] 79 {
106 .concat(data.columns()) 80 value: "1",
107 .concat([ 81 label: "工号",
108 { 82 },
109 label: "职位", 83 {
110 render: (h, scope) => { 84 value: "2",
111 return ( 85 label: "部门",
112 <div v-show={scope.row.jobLevel !== null}>{scope.row.jobLevel ? "干事" : "经理"}</div> 86 },
113 ) 87 {
88 value: "3",
89 label: "机构",
90 },
91 ],
114 92
115 } 93 selectionList: [],
116 }, 94 // 表格数据
95 tableData: {
96 columns: [
117 { 97 {
118 label: "负责人", 98 label: "序号",
119 render: (h, scope) => { 99 type: "index",
120 return ( 100 width: "50",
121 <i v-show={scope.row.isDuty !== null} class="el-icon-check" /> 101 index: this.indexMethod,
122 )
123 }
124 }, 102 },
125 { 103 ]
126 label: "排序", 104 .concat(data.columns())
127 width: 300, 105 .concat([
128 render: (h, scope) => { 106 {
129 return ( 107 label: "职位",
130 <div> 108 render: (h, scope) => {
131 <el-button 109 return (
132 type="text" 110 <div v-show={scope.row.jobLevel !== null}>{scope.row.jobLevel ? "干事" : "经理"}</div>
133 class='movebtnColor' 111 )
134 disabled={scope.row.isTop} 112
135 onClick={() => { 113 }
136 this.updateOrder(scope.row, 'TOP');
137 }}
138 >
139 置顶
140 </el-button>
141 <el-button
142 type="text"
143 class='movebtnColor'
144 disabled={scope.row.isTop}
145 onClick={() => {
146 this.updateOrder(scope.row, 'UP');
147 }}
148 >
149 上移
150 </el-button>
151 <el-button
152 type="text"
153 class='movebtnColor'
154 disabled={scope.row.isBottom}
155 onClick={() => {
156 this.updateOrder(scope.row, 'DOWN');
157 }}
158 >
159 下移
160 </el-button>
161 <el-button
162 type="text"
163 size="mini"
164 class='movebtnColor'
165 disabled={scope.row.isBottom}
166 onClick={() => {
167 this.updateOrder(scope.row, 'BOTTOM');
168 }}
169 >
170 置底
171 </el-button>
172 </div>
173 );
174 }, 114 },
175 }, 115 {
176 { 116 label: "负责人",
177 label: "操作", 117 render: (h, scope) => {
178 width: 380, 118 return (
179 render: (h, scope) => { 119 <i v-show={scope.row.isDuty !== null} class="el-icon-check" />
180 return ( 120 )
181 <div> 121 }
182 <el-button
183 type="text"
184 size="mini"
185 class='resetbtnColor'
186 onClick={() => {
187 this.resetPassword(scope.row.id);
188 }}
189 >
190 重置
191 </el-button>
192 <el-button
193 type="text"
194 size="mini"
195 class='successColor'
196 onClick={() => {
197 this.handleEdit(scope.row);
198 }}
199 >
200 修改
201 </el-button>
202 <el-button
203 type="text"
204 size="mini"
205 class='delColor'
206 onClick={() => {
207 this.handleDelete(scope.row.id, scope.row.name);
208 }}
209 >
210 删除
211 </el-button>
212 </div>
213 );
214 }, 122 },
215 },
216 ]),
217 data: [],
218 },
219 };
220 },
221 created () {
222 this.getTableList();
223 },
224 computed: {
225 departmentid () {
226 return this.$store.state.user.userInfo;
227 },
228 },
229 methods: {
230 handleAdd () {
231 this.isDialog = true
232 this.$refs.dialogForm.adds();
233 this.$refs.dialogForm.title = "添加";
234 },
235 // 查询
236 getTableList () {
237 this.queryParam = {
238 name: this.form.name,
239 code: this.form.code,
240 loginName: this.form.loginName,
241 };
242 getUserLists(this.queryParam).then((res) => {
243 if (res.status === 1) {
244 this.loading = false;
245 this.tableData.data = res.content;
246 this.tableData.data = judgeSort(this.tableData.data);
247 let arr = []
248 this.tableData.data.forEach((item) => {
249 arr.push(item.departmentId)
250 })
251 this.getDepts(arr)
252 } else {
253 this.$message.error({ message: res.message, showClose: true })
254 }
255 })
256 },
257 // 获取组织机构
258 getDepts (deptIdArr) {
259 let params = {
260 queryOptions: {
261 conditionGroup: {
262 conditions: [
263 { 123 {
264 property: "id", 124 label: "排序",
265 value: deptIdArr, 125 width: 300,
266 operator: "IN", 126 render: (h, scope) => {
127 return (
128 <div>
129 <el-button
130 type="text"
131 class='movebtnColor'
132 disabled={scope.row.isTop}
133 onClick={() => {
134 this.updateOrder(scope.row, 'TOP');
135 }}
136 >
137 置顶
138 </el-button>
139 <el-button
140 type="text"
141 class='movebtnColor'
142 disabled={scope.row.isTop}
143 onClick={() => {
144 this.updateOrder(scope.row, 'UP');
145 }}
146 >
147 上移
148 </el-button>
149 <el-button
150 type="text"
151 class='movebtnColor'
152 disabled={scope.row.isBottom}
153 onClick={() => {
154 this.updateOrder(scope.row, 'DOWN');
155 }}
156 >
157 下移
158 </el-button>
159 <el-button
160 type="text"
161 size="mini"
162 class='movebtnColor'
163 disabled={scope.row.isBottom}
164 onClick={() => {
165 this.updateOrder(scope.row, 'BOTTOM');
166 }}
167 >
168 置底
169 </el-button>
170 </div>
171 );
172 },
267 }, 173 },
268 ], 174 {
269 queryRelation: "AND", 175 label: "操作",
270 }, 176 width: 380,
271 orderBys: [], 177 render: (h, scope) => {
178 return (
179 <div>
180 <el-button
181 type="text"
182 size="mini"
183 class='resetbtnColor'
184 onClick={() => {
185 this.resetPassword(scope.row.id);
186 }}
187 >
188 重置
189 </el-button>
190 <el-button
191 type="text"
192 size="mini"
193 class='successColor'
194 onClick={() => {
195 this.handleEdit(scope.row);
196 }}
197 >
198 修改
199 </el-button>
200 <el-button
201 type="text"
202 size="mini"
203 class='delColor'
204 onClick={() => {
205 this.handleDelete(scope.row.id, scope.row.name);
206 }}
207 >
208 删除
209 </el-button>
210 </div>
211 );
212 },
213 },
214 ]),
215 data: [],
272 }, 216 },
273 }; 217 };
274 getAction(api.departments, params).then( 218 },
275 (res) => { 219 created () {
276 let deptsList = res.content; 220 this.getTableList();
277 deptsList.forEach((ele) => { 221 },
222 computed: {
223 departmentid () {
224 return this.$store.state.user.userInfo;
225 },
226 },
227 methods: {
228 handleAdd () {
229 this.isDialog = true
230 this.$refs.dialogForm.adds();
231 this.$refs.dialogForm.title = "添加";
232 },
233 // 查询
234 getTableList () {
235 this.queryParam = {
236 name: this.form.name,
237 code: this.form.code,
238 loginName: this.form.loginName,
239 };
240 getUserLists(this.queryParam).then((res) => {
241 if (res.status === 1) {
242 this.loading = false;
243 this.tableData.data = res.content;
244 this.tableData.data = judgeSort(this.tableData.data);
245 let arr = []
278 this.tableData.data.forEach((item) => { 246 this.tableData.data.forEach((item) => {
279 if (ele.id == item.departmentId) { 247 arr.push(item.departmentId)
280 item.departmentName = ele.name 248 })
281 } 249 this.getDepts(arr)
250 } else {
251 this.$message.error({ message: res.message, showClose: true })
252 }
253 })
254 },
255 // 获取组织机构
256 getDepts (deptIdArr) {
257 let params = {
258 queryOptions: {
259 conditionGroup: {
260 conditions: [
261 {
262 property: "id",
263 value: deptIdArr,
264 operator: "IN",
265 },
266 ],
267 queryRelation: "AND",
268 },
269 orderBys: [],
270 },
271 };
272 getAction(api.departments, params).then(
273 (res) => {
274 let deptsList = res.content;
275 deptsList.forEach((ele) => {
276 this.tableData.data.forEach((item) => {
277 if (ele.id == item.departmentId) {
278 item.departmentName = ele.name
279 }
280 })
282 }) 281 })
283 })
284 282
285 }, 283 },
286 (err) => { 284 (err) => {
287 console.log("err :", err); 285 console.log("err :", err);
288 } 286 }
289 ); 287 );
290 }, 288 },
291 // getTableList () { 289 // getTableList () {
292 // this.loading = true; 290 // this.loading = true;
293 291
294 // getUserList().then((res) => { 292 // getUserList().then((res) => {
295 // if (res.status === 1) { 293 // if (res.status === 1) {
296 // console.log("res人员列表", res); 294 // console.log("res人员列表", res);
297 // this.loading = false; 295 // this.loading = false;
298 // this.tableData.data = res.content; 296 // this.tableData.data = res.content;
299 // this.tableData.data = judgeSort(this.tableData.data); 297 // this.tableData.data = judgeSort(this.tableData.data);
300 // } else { 298 // } else {
301 // this.$message.error({ message: res.message, showClose: true }); 299 // this.$message.error({ message: res.message, showClose: true });
302 // } 300 // }
303 // }); 301 // });
304 // }, 302 // },
305 303
306 // 重置用户密码 304 // 重置用户密码
307 resetPassword (data) { 305 resetPassword (data) {
308 const ids = [] 306 const ids = []
309 if (data instanceof Array) { 307 if (data instanceof Array) {
310 data.forEach((item) => { 308 data.forEach((item) => {
311 ids.push(item.id) 309 ids.push(item.id)
312 }) 310 })
313 } else { 311 } else {
314 ids.push(data) 312 ids.push(data)
315 } 313 }
316 if (ids.length === 0) { 314 if (ids.length === 0) {
317 this.$message({ 315 this.$message({
318 message: '请选择需要重置密码的用户!', 316 message: '请选择需要重置密码的用户!',
319 showClose: true 317 showClose: true
320 }) 318 })
321 return 319 return
322 } 320 }
323 this.$confirm( 321 this.$confirm(
324 `<div class="customer-message-wrapper"> 322 `<div class="customer-message-wrapper">
325 <h5 class="title">确定要重置密码吗</h5> 323 <h5 class="title">确定要重置密码吗</h5>
326 <p class="result">执行后，数据将 324 <p class="result">执行后，数据将
327 <span >无法恢复</span> 325 <span >无法恢复</span>
328 </p> 326 </p>
329 </div>`, 327 </div>`,
330 '执行确认', 328 '执行确认',
331 { 329 {
330 dangerouslyUseHTMLString: true,
331 customClass: 'customer-delete',
332 confirmButtonText: '确定',
333 cancelButtonText: '取消',
334 type: 'warning'
335 }
336 )
337 .then(() => {
338 resetPassword(ids).then((res) => {
339 if (res.status === 1) {
340 this.$message.success({ message: res.message, showClose: true })
341 this.getTableList()
342 } else {
343 this.$message.error({ message: res.message, showClose: true })
344 }
345 })
346 })
347 .catch(() => { })
348 },
349 //排序
350 updateOrder (record, operate) {
351 const findIndex = this.tableData.data.findIndex(item => item.id === record.id)
352 let swapId = ''
353 if (operate === 'UP') {
354 swapId = this.tableData.data[findIndex - 1].id
355 } else if (operate === 'DOWN') {
356 swapId = this.tableData.data[findIndex + 1].id
357 }
358 updateOrder('/rest/users', record, operate, swapId).then(res => {
359 if (res.status === 1) {
360 this.$message.success({ message: res.message, showClose: true })
361 this.getTableList();
362 } else {
363 this.$message.error({ message: res.message, showClose: true })
364 }
365 })
366 },
367
368 // 修改人员信息
369 handleEdit (row) {
370 this.isDialog = true
371 this.$refs.dialogForm.edit(row);
372 this.$refs.dialogForm.title = "修改";
373 },
374 // 删除
375 handleDelete (id, content) {
376 this.$confirm(deleteDomStr(content), '执行确认', {
332 dangerouslyUseHTMLString: true, 377 dangerouslyUseHTMLString: true,
333 customClass: 'customer-delete', 378 customClass: 'customer-delete',
334 confirmButtonText: '确定', 379 confirmButtonText: '确定',
335 cancelButtonText: '取消', 380 cancelButtonText: '取消',
336 type: 'warning' 381 type: 'warning'
337 }
338 )
339 .then(() => {
340 resetPassword(ids).then((res) => {
341 if (res.status === 1) {
342 this.$message.success({ message: res.message, showClose: true })
343 this.getTableList()
344 } else {
345 this.$message.error({ message: res.message, showClose: true })
346 }
347 })
348 }) 382 })
349 .catch(() => { }) 383 .then(() => {
350 }, 384 删除传
351 //排序 385 deleteAction(`${api.users}/${id}`).then((res) => {
352 updateOrder (record, operate) { 386 if (res.status === 1) {
353 const findIndex = this.tableData.data.findIndex(item => item.id === record.id) 387 this.$message.success({ message: res.message, showClose: true })
354 let swapId = '' 388 } else {
355 if (operate === 'UP') { 389 this.$message.error({ message: res.message, showClose: true })
356 swapId = this.tableData.data[findIndex - 1].id 390 }
357 } else if (operate === 'DOWN') { 391 this.getTableList()
358 swapId = this.tableData.data[findIndex + 1].id 392 })
359 }
360 updateOrder('/rest/users', record, operate, swapId).then(res => {
361 if (res.status === 1) {
362 this.$message.success({ message: res.message, showClose: true })
363 this.getTableList();
364 } else {
365 this.$message.error({ message: res.message, showClose: true })
366 }
367 })
368 },
369
370 // 修改人员信息
371 handleEdit (row) {
372 this.isDialog = true
373 this.$refs.dialogForm.edit(row);
374 this.$refs.dialogForm.title = "修改";
375 },
376 // 删除
377 handleDelete (id, content) {
378 this.$confirm(deleteDomStr(content), '执行确认', {
379 dangerouslyUseHTMLString: true,
380 customClass: 'customer-delete',
381 confirmButtonText: '确定',
382 cancelButtonText: '取消',
383 type: 'warning'
384 })
385 .then(() => {
386 删除传
387 deleteAction(`${api.users}/${id}`).then((res) => {
388 if (res.status === 1) {
389 this.$message.success({ message: res.message, showClose: true })
390 } else {
391 this.$message.error({ message: res.message, showClose: true })
392 }
393 this.getTableList()
394 }) 393 })
395 }) 394 .catch(() => { })
396 .catch(() => { }) 395 },
397 }, 396 // 新增回显
398 // 新增回显 397 reloadTableData () {
399 reloadTableData () { 398 this.getTableList()
400 this.getTableList() 399 },
401 }, 400 },
402 }, 401 };
403 };
404 </script> 402 </script>
405 <style scoped lang="scss"> 403 <style scoped lang="scss">
406 @import "~@/styles/mixin.scss"; 404 @import "~@/styles/mixin.scss";
407 </style> 405 </style>
......