Skip to content

bdc / bdcdj-web

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

Merge branch 'dev'

2 parents 46032fe9 d164eca5
Inline Side-by-side
Showing 24 changed files with 2125 additions and 176 deletions
1 /*
2 * @Description: 信息备案
3 * @Autor:
4 * @LastEditTime: 2023-09-11 11:25:22
5 */
6
7 import request from '@/utils/request'
8 let SERVER = window.config ? window.config : JSON.parse(localStorage.getItem('ApiUrl'))
9
10 /**
11 * @description: cstj
12 * @author:
13 * @param params
14 */
15 export function cstj (params) {
16 return request({
17 url: SERVER.SERVERAPI + '/rest/tjfx/xn/cstj?startAt='+params.startAt + '&endAt=' + params.endAt,
18 method: 'post'
19 })
20 }
21
22 /**
23 * @description: exportCstj
24 * @author:
25 * @param params
26 */
27 export function exportCstj (params) {
28 return request({
29 url: SERVER.SERVERAPI + '/rest/tjfx/xn/exportCstj?startAt='+params.startAt + '&endAt=' + params.endAt,
30 method: 'post',
31 responseType: 'blob'
32 })
33 }
34
35 /**
36 * @description: tjtj
37 * @author:
38 * @param data
39 */
40 export function tjtj (data) {
41 return request({
42 url: SERVER.SERVERAPI + '/rest/tjfx/xn/tjtj',
43 method: 'post',
44 data
45 })
46 }
47
48 /**
49 * @description: exportTjtj
50 * @author:
51 * @param data
52 */
53 export function exportTjtj (data) {
54 return request({
55 url: SERVER.SERVERAPI + '/rest/tjfx/xn/exportTjtj',
56 method: 'post',
57 data,
58 responseType: 'blob'
59 })
60 }
61
62 /**
63 * @description: getDjlxStatistic
64 * @author:
65 * @param data
66 */
67 export function getDjlxStatistic (data) {
68 return request({
69 url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getDjlxStatistic',
70 method: 'post',
71 data
72 })
73 }
74
75 /**
76 * @description: getPrintBdcqzStatistic
77 * @author:
78 * @param data
79 */
80 export function getPrintBdcqzStatistic (data) {
81 return request({
82 url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getPrintBdcqzStatistic',
83 method: 'post',
84 data
85 })
86 }
87
88 /**
89 * @description: getSlryStatistic
90 * @author:
91 * @param data
92 */
93 export function getSlryStatistic (data) {
94 return request({
95 url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getSlryStatistic',
96 method: 'post',
97 data
98 })
99 }
100
101 /**
102 * @description: getAcceptMonthStatistic
103 * @author:
104 * @param data
105 */
106 export function getAcceptMonthStatistic (data) {
107 return request({
108 url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getAcceptMonthStatistic',
109 method: 'post',
110 data
111 })
112 }
113
114 /**
115 * @description: getAcceptDayStatistic
116 * @author:
117 * @param data
118 */
119 export function getAcceptDayStatistic (data) {
120 return request({
121 url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getAcceptDayStatistic',
122 method: 'post',
123 data
124 })
125 }
126
127 /**
128 * @description: getAcceptAreaStatistic
129 * @author:
130 * @param data
131 */
132 export function getAcceptAreaStatistic (data) {
133 return request({
134 url: SERVER.SERVERAPI + '/rest/tjfx/djqkfx/getAcceptAreaStatistic',
135 method: 'post',
136 data
137 })
138 }
...@@ -86,6 +86,7 @@ ...@@ -86,6 +86,7 @@
86 </template> 86 </template>
87 <script> 87 <script>
88 import * as echarts from "echarts"; 88 import * as echarts from "echarts";
89 import { getDjlxStatistic } from "@/api/tjfx.js";
89 import { mapGetters } from "vuex"; 90 import { mapGetters } from "vuex";
90 import { getdatamonth } from "@/utils/util"; 91 import { getdatamonth } from "@/utils/util";
91 export default { 92 export default {
...@@ -97,27 +98,51 @@ export default { ...@@ -97,27 +98,51 @@ export default {
97 return { 98 return {
98 queryForm: { 99 queryForm: {
99 sj: [], 100 sj: [],
101 qy: ''
100 }, 102 },
101 tableList: [ 103 tableList: [
102 { name: "首次登记", value: "2" }, 104 // { name: "首次登记", value: "2" },
103 { name: "变更登记", value: "12" }, 105 // { name: "变更登记", value: "12" },
104 { name: "抵押登记", value: "23" }, 106 // { name: "抵押登记", value: "23" },
105 { name: "转移登记", value: "33" }, 107 // { name: "转移登记", value: "33" },
106 { name: "预告登记", value: "13" }, 108 // { name: "预告登记", value: "13" },
107 { name: "注销登记", value: "3" }, 109 // { name: "注销登记", value: "3" },
108 { name: "查封登记", value: "4" }, 110 // { name: "查封登记", value: "4" },
109 { name: "其他登记", value: "26" }, 111 // { name: "其他登记", value: "26" },
110 ], 112 ],
111 }; 113 };
112 }, 114 },
113 mounted() { 115 mounted() {
114 this.setdata(); 116 this.setdata();
115 // 创建一个 ECharts 实例
116 this.chart = echarts.init(this.$refs.chart);
117 // 在 ECharts 实例中配置图表
118 this.chart.setOption(this.getOption());
119 }, 117 },
120 methods: { 118 methods: {
119 getDjlxStatistic() {
120 getDjlxStatistic(
121 {
122 startDate: this.queryForm.sj[0],
123 endDate: this.queryForm.sj[1],
124 qxdm: this.queryForm.qy
125 }
126 ).then(res => {
127 if (res.code === 200) {
128 this.tableList = []
129 let dicList = this.dictData['A21']
130 res.result.forEach(it=>{
131 const matchingObject = dicList.find(obj => obj.dcode === it.DJLX);
132 const djlxmc = matchingObject != null ? matchingObject.dname : it.DJLX;
133 let obj = {
134 name: djlxmc,
135 value: it.SJCOUNT
136 }
137 this.tableList.push(obj)
138 })
139 // 创建一个 ECharts 实例
140 this.chart = echarts.init(this.$refs.chart);
141 // 在 ECharts 实例中配置图表
142 this.chart.setOption(this.getOption());
143 }
144 })
145 },
121 getOption() { 146 getOption() {
122 return { 147 return {
123 title: { 148 title: {
...@@ -171,10 +196,12 @@ export default { ...@@ -171,10 +196,12 @@ export default {
171 setdata() { 196 setdata() {
172 this.queryForm.sj = getdatamonth(); 197 this.queryForm.sj = getdatamonth();
173 console.log("this.queryForm", this.queryForm); 198 console.log("this.queryForm", this.queryForm);
199 this.getDjlxStatistic()
174 }, 200 },
175 201
176 handleSearch() { 202 handleSearch() {
177 console.log(" this.queryForm", this.queryForm); 203 console.log(" this.queryForm", this.queryForm);
204 this.getDjlxStatistic()
178 }, 205 },
179 }, 206 },
180 }; 207 };
......
...@@ -68,28 +68,56 @@ ...@@ -68,28 +68,56 @@
68 <script> 68 <script>
69 import * as echarts from "echarts"; 69 import * as echarts from "echarts";
70 import { getdatamonth } from "@/utils/util"; 70 import { getdatamonth } from "@/utils/util";
71 import { getAcceptAreaStatistic } from "@/api/tjfx.js";
72 import {mapGetters} from "vuex";
71 export default { 73 export default {
72 components: {}, 74 components: {},
75 computed: {
76 ...mapGetters(["dictData"]),
77 },
73 data() { 78 data() {
74 return { 79 return {
75 queryForm: {}, 80 queryForm: {},
76 tableList: [ 81 tableList: [
77 { name: "浐灞", value: "2" }, 82 // { name: "浐灞", value: "2" },
78 { name: "长安", value: "12" }, 83 // { name: "长安", value: "12" },
79 { name: "莲湖", value: "23" }, 84 // { name: "莲湖", value: "23" },
80 { name: "高新", value: "33" }, 85 // { name: "高新", value: "33" },
81 { name: "高新", value: "33" }, 86 // { name: "高新", value: "33" },
82 ], 87 ],
83 }; 88 };
84 }, 89 },
85 mounted() { 90 mounted() {
86 this.setdata(); 91 this.setdata();
87 // 创建一个 ECharts 实例
88 this.chart = echarts.init(this.$refs.chart);
89 // 在 ECharts 实例中配置图表
90 this.chart.setOption(this.getOption());
91 }, 92 },
92 methods: { 93 methods: {
94
95 getAcceptAreaStatistic() {
96 getAcceptAreaStatistic({
97 startDate: this.queryForm.sj[0],
98 endDate: this.queryForm.sj[1],
99 qxdm: this.queryForm.qy
100 }).then(res => {
101 if (res.code === 200) {
102 this.tableList = []
103 let dicList = this.dictData['A20']
104 res.result.forEach(it=>{
105 const matchingObject = dicList.find(obj => obj.dcode === it.QXDM);
106 const qxmc = matchingObject != null ? matchingObject.dname : it.QXDM;
107 let obj = {
108 name: qxmc,
109 value: it.SJCOUNT
110 }
111 this.tableList.push(obj)
112 })
113 // 创建一个 ECharts 实例
114 this.chart = echarts.init(this.$refs.chart);
115 // 在 ECharts 实例中配置图表
116 this.chart.setOption(this.getOption());
117 }
118 })
119 },
120
93 getOption() { 121 getOption() {
94 return { 122 return {
95 title: { 123 title: {
...@@ -143,9 +171,11 @@ export default { ...@@ -143,9 +171,11 @@ export default {
143 setdata() { 171 setdata() {
144 this.queryForm.sj = getdatamonth(); 172 this.queryForm.sj = getdatamonth();
145 console.log("this.queryForm", this.queryForm); 173 console.log("this.queryForm", this.queryForm);
174 this.getAcceptAreaStatistic()
146 }, 175 },
147 handleSearch() { 176 handleSearch() {
148 console.log(" this.queryForm", this.queryForm); 177 console.log(" this.queryForm", this.queryForm);
178 this.getAcceptAreaStatistic()
149 }, 179 },
150 }, 180 },
151 }; 181 };
......
...@@ -87,6 +87,7 @@ ...@@ -87,6 +87,7 @@
87 import * as echarts from "echarts"; 87 import * as echarts from "echarts";
88 import { mapGetters } from "vuex"; 88 import { mapGetters } from "vuex";
89 import { getdatamonth } from "@/utils/util"; 89 import { getdatamonth } from "@/utils/util";
90 import { getSlryStatistic } from "@/api/tjfx.js";
90 export default { 91 export default {
91 components: {}, 92 components: {},
92 computed: { 93 computed: {
...@@ -94,22 +95,46 @@ export default { ...@@ -94,22 +95,46 @@ export default {
94 }, 95 },
95 data() { 96 data() {
96 return { 97 return {
97 queryForm: {}, 98 queryForm: {
99 qy: ''
100 },
98 tableList: [ 101 tableList: [
99 { name: "小红", value: "2" }, 102 // { name: "小红", value: "2" },
100 { name: "小张", value: "12" }, 103 // { name: "小张", value: "12" },
101 { name: "小王", value: "23" }, 104 // { name: "小王", value: "23" },
102 ], 105 ],
103 }; 106 };
104 }, 107 },
105 mounted() { 108 mounted() {
106 this.setdata(); 109 this.setdata();
107 // 创建一个 ECharts 实例
108 this.chart = echarts.init(this.$refs.chart);
109 // 在 ECharts 实例中配置图表
110 this.chart.setOption(this.getOption());
111 }, 110 },
112 methods: { 111 methods: {
112 getSlryStatistic() {
113 getSlryStatistic({
114 startDate: this.queryForm.sj[0],
115 endDate: this.queryForm.sj[1],
116 qxdm: this.queryForm.qy
117 }).then(res => {
118 if (res.code === 200) {
119 this.tableList = []
120 res.result.forEach(it=>{
121 let obj = {
122 name: it.SLRY,
123 value: it.SJCOUNT
124 }
125 this.tableList.push(obj)
126 })
127 // 创建一个 ECharts 实例
128 this.chart = echarts.init(this.$refs.chart);
129 // 在 ECharts 实例中配置图表
130 this.chart.setOption(this.getOption());
131 // 创建一个 ECharts 实例
132 this.chart = echarts.init(this.$refs.chart);
133 // 在 ECharts 实例中配置图表
134 this.chart.setOption(this.getOption());
135 }
136 })
137 },
113 getOption() { 138 getOption() {
114 return { 139 return {
115 title: { 140 title: {
...@@ -163,9 +188,11 @@ export default { ...@@ -163,9 +188,11 @@ export default {
163 setdata() { 188 setdata() {
164 this.queryForm.sj = getdatamonth(); 189 this.queryForm.sj = getdatamonth();
165 console.log("this.queryForm", this.queryForm); 190 console.log("this.queryForm", this.queryForm);
191 this.getSlryStatistic()
166 }, 192 },
167 handleSearch() { 193 handleSearch() {
168 console.log(" this.queryForm", this.queryForm); 194 console.log(" this.queryForm", this.queryForm);
195 this.getSlryStatistic()
169 }, 196 },
170 }, 197 },
171 }; 198 };
......
...@@ -56,8 +56,27 @@ ...@@ -56,8 +56,27 @@
56 </div> 56 </div>
57 </template> 57 </template>
58 <script> 58 <script>
59 function getFirstAndLastDayOfMonth(dateString) {
60 const date = new Date(dateString);
61 const firstDay = new Date(date.getFullYear(), date.getMonth(), 1);
62 const lastDay = new Date(date.getFullYear(), date.getMonth() + 1, 0);
63
64 // 将日期格式化为 "yyyy-MM-dd"
65 const formatDate = (d) => {
66 const year = d.getFullYear();
67 const month = String(d.getMonth() + 1).padStart(2, '0');
68 const day = String(d.getDate()).padStart(2, '0');
69 return `${year}-${month}-${day}`;
70 };
71
72 return {
73 firstDay: formatDate(firstDay),
74 lastDay: formatDate(lastDay)
75 };
76 }
59 import * as echarts from "echarts"; 77 import * as echarts from "echarts";
60 import { mapGetters } from "vuex"; 78 import { mapGetters } from "vuex";
79 import { getAcceptDayStatistic } from "@/api/tjfx.js";
61 export default { 80 export default {
62 components: {}, 81 components: {},
63 computed: { 82 computed: {
...@@ -66,23 +85,11 @@ export default { ...@@ -66,23 +85,11 @@ export default {
66 data() { 85 data() {
67 return { 86 return {
68 queryForm: { 87 queryForm: {
69 monthValue:"" 88 monthValue:"",
89 qy: ''
70 }, 90 },
71 datas: [12, 23, 15, 28, 37, 11, 13, 32, 34, 56, 12, 15], 91 datas: [],
72 datatime: [ 92 datatime: [],
73 "1日",
74 "2日",
75 "4日",
76 "5日",
77 "7日",
78 "10日",
79 "14日",
80 "15日",
81 "17日",
82 "19日",
83 "20日",
84 "21日",
85 ],
86 93
87 }; 94 };
88 }, 95 },
...@@ -101,16 +108,13 @@ export default { ...@@ -101,16 +108,13 @@ export default {
101 console.log("this.queryForm",this.queryForm); 108 console.log("this.queryForm",this.queryForm);
102 }, 109 },
103 mounted() { 110 mounted() {
104 // 创建一个 ECharts 实例 111 this.handleSearch()
105 this.chart = echarts.init(this.$refs.chart);
106 // 在 ECharts 实例中配置图表
107 this.chart.setOption(this.getOption());
108 }, 112 },
109 methods: { 113 methods: {
110 getOption() { 114 getOption() {
111 return { 115 return {
112 title: { 116 title: {
113 text: "2023年11月收件情况 ", // 主标题名称 117 text: "收件情况统计(月) ", // 主标题名称
114 118
115 textStyle: { 119 textStyle: {
116 //主标题文本设置 120 //主标题文本设置
...@@ -168,7 +172,20 @@ export default { ...@@ -168,7 +172,20 @@ export default {
168 }; 172 };
169 }, 173 },
170 174
171 handleSearch() {}, 175 handleSearch() {
176 const { firstDay, lastDay } = getFirstAndLastDayOfMonth(this.queryForm.monthValue);
177 getAcceptDayStatistic({startDate: firstDay, endDate: lastDay, qxdm: this.queryForm.qy}).then(res => {
178 if (res.code === 200) {
179 let dataSource = res.result
180 this.datas = dataSource.map(item => item.SJCOUNT)
181 this.datatime = dataSource.map(item => item.SJDAY)
182 // 创建一个 ECharts 实例
183 this.chart = echarts.init(this.$refs.chart);
184 // 在 ECharts 实例中配置图表
185 this.chart.setOption(this.getOption());
186 }
187 })
188 },
172 }, 189 },
173 }; 190 };
174 </script> 191 </script>
......
...@@ -14,6 +14,7 @@ ...@@ -14,6 +14,7 @@
14 class="width100" 14 class="width100"
15 v-model="queryForm.sj" 15 v-model="queryForm.sj"
16 type="year" 16 type="year"
17 @change="chooseDateRange"
17 placeholder="选择年" 18 placeholder="选择年"
18 > 19 >
19 </el-date-picker> 20 </el-date-picker>
...@@ -58,7 +59,7 @@ ...@@ -58,7 +59,7 @@
58 <script> 59 <script>
59 import * as echarts from "echarts"; 60 import * as echarts from "echarts";
60 import { mapGetters } from "vuex"; 61 import { mapGetters } from "vuex";
61 62 import { getAcceptMonthStatistic } from "@/api/tjfx.js";
62 export default { 63 export default {
63 components: {}, 64 components: {},
64 computed: { 65 computed: {
...@@ -67,50 +68,44 @@ export default { ...@@ -67,50 +68,44 @@ export default {
67 data() { 68 data() {
68 return { 69 return {
69 queryForm: { 70 queryForm: {
70 sj:"" 71 sj:"",
72 year: "",
73 qy: ''
71 }, 74 },
75 datetime: [],
76 datas: []
72 }; 77 };
73 }, 78 },
74 created() { 79 created() {
75 var tempDate = new Date(); 80 var tempDate = new Date();
81 this.queryForm.sj = tempDate
76 var year = tempDate.getFullYear(); 82 var year = tempDate.getFullYear();
77 console.log("year", year); 83 console.log("year", year);
78 // 默认当月 84 // 默认当月
79 85
80 this.$set(this.queryForm, "sj", year.toString()); 86 this.$set(this.queryForm, "year", year.toString());
81 console.log("this.queryForm",this.queryForm); 87 console.log("this.queryForm",this.queryForm);
82 }, 88 },
83 mounted() { 89 mounted() {
84 // 创建一个 ECharts 实例 90 this.handleSearch()
85 this.chart = echarts.init(this.$refs.chart);
86 // 在 ECharts 实例中配置图表
87 this.chart.setOption(this.getOption());
88 }, 91 },
89 methods: { 92 methods: {
93 chooseDateRange() {
94 var year = this.queryForm.sj.getFullYear();
95 this.$set(this.queryForm, "year", year.toString());
96 this.handleSearch()
97 },
90 getOption() { 98 getOption() {
91 return { 99 return {
92 xAxis: { 100 xAxis: {
93 type: "category", 101 type: "category",
94 data: [ 102 data: this.datatime,
95 "1月",
96 "2月",
97 "3月",
98 "4月",
99 "5月",
100 "6月",
101 "7月",
102 "8月",
103 "9月",
104 "10月",
105 "11月",
106 "12月",
107 ],
108 }, 103 },
109 yAxis: { 104 yAxis: {
110 type: "value", 105 type: "value",
111 }, 106 },
112 title: { 107 title: {
113 text: "2023年收件情况 ", // 主标题名称 108 text: "收件情况统计(年) ", // 主标题名称
114 109
115 textStyle: { 110 textStyle: {
116 //主标题文本设置 111 //主标题文本设置
...@@ -149,7 +144,7 @@ export default { ...@@ -149,7 +144,7 @@ export default {
149 }, 144 },
150 series: [ 145 series: [
151 { 146 {
152 data: [38, 42, 50, 157, 40, 45, 60, 140, 36, 47, 54, 143], 147 data: this.datas,
153 barWidth: 40, 148 barWidth: 40,
154 type: "bar", 149 type: "bar",
155 }, 150 },
...@@ -157,7 +152,22 @@ export default { ...@@ -157,7 +152,22 @@ export default {
157 }; 152 };
158 }, 153 },
159 154
160 handleSearch() {}, 155 handleSearch() {
156 console.log(this.queryForm)
157 let startAt = this.queryForm.year + '-01-01'
158 let endAt = this.queryForm.year + '-12-31'
159 getAcceptMonthStatistic({startDate: startAt, endDate: endAt, qxdm: this.queryForm.qy}).then(res => {
160 if (res.code === 200) {
161 let dataSource = res.result
162 this.datas = dataSource.map(item => item.SJCOUNT)
163 this.datatime = dataSource.map(item => item.SJMONTH)
164 // 创建一个 ECharts 实例
165 this.chart = echarts.init(this.$refs.chart);
166 // 在 ECharts 实例中配置图表
167 this.chart.setOption(this.getOption());
168 }
169 })
170 },
161 }, 171 },
162 }; 172 };
163 </script> 173 </script>
......
...@@ -84,6 +84,7 @@ ...@@ -84,6 +84,7 @@
84 </div> 84 </div>
85 </template> 85 </template>
86 <script> 86 <script>
87 import { getPrintBdcqzStatistic } from "@/api/tjfx.js";
87 import * as echarts from "echarts"; 88 import * as echarts from "echarts";
88 import { mapGetters } from "vuex"; 89 import { mapGetters } from "vuex";
89 import { getdatamonth } from "@/utils/util"; 90 import { getdatamonth } from "@/utils/util";
...@@ -94,7 +95,9 @@ export default { ...@@ -94,7 +95,9 @@ export default {
94 }, 95 },
95 data() { 96 data() {
96 return { 97 return {
97 queryForm: {}, 98 queryForm: {
99 qy: ''
100 },
98 tableList: [ 101 tableList: [
99 { name: "单一版不动产权证书", value: "459" }, 102 { name: "单一版不动产权证书", value: "459" },
100 { name: "不动产登记证明", value: "164" }, 103 { name: "不动产登记证明", value: "164" },
...@@ -110,6 +113,48 @@ export default { ...@@ -110,6 +113,48 @@ export default {
110 this.chart.setOption(this.getOption()); 113 this.chart.setOption(this.getOption());
111 }, 114 },
112 methods: { 115 methods: {
116 getPrintBdcqzStatistic() {
117 getPrintBdcqzStatistic({
118 startDate: this.queryForm.sj[0],
119 endDate: this.queryForm.sj[1],
120 qxdm: this.queryForm.qy
121 }).then(res => {
122 if (res.code === 200) {
123 this.tableList = []
124 res.result.forEach(it=>{
125 let obj = {
126 name: it.BDCQZLX == '1' ? '单一版不动产权证书' : '不动产登记证明',
127 ky: it.BDCQZLX,
128 value: it.SJCOUNT
129 }
130 this.tableList.push(obj)
131 })
132 const hasBdclx1 = this.tableList.some(item => item.ky === '1');
133 if (!hasBdclx1) {
134 let obj1 = {
135 name: '单一版不动产权证书',
136 ky: '1',
137 value: 0
138 }
139 this.tableList.push(obj1)
140 }
141 const hasBdclx2 = this.tableList.some(item => item.ky === '2');
142 if (!hasBdclx2) {
143 let obj2 = {
144 name: '不动产登记证明',
145 ky: '2',
146 value: 0
147 }
148 this.tableList.push(obj2)
149 }
150
151 // 创建一个 ECharts 实例
152 this.chart = echarts.init(this.$refs.chart);
153 // 在 ECharts 实例中配置图表
154 this.chart.setOption(this.getOption());
155 }
156 })
157 },
113 getOption() { 158 getOption() {
114 return { 159 return {
115 title: { 160 title: {
...@@ -163,9 +208,11 @@ export default { ...@@ -163,9 +208,11 @@ export default {
163 setdata() { 208 setdata() {
164 this.queryForm.sj = getdatamonth(); 209 this.queryForm.sj = getdatamonth();
165 console.log("this.queryForm", this.queryForm); 210 console.log("this.queryForm", this.queryForm);
211 this.getPrintBdcqzStatistic()
166 }, 212 },
167 handleSearch() { 213 handleSearch() {
168 console.log(" this.queryForm", this.queryForm); 214 console.log(" this.queryForm", this.queryForm);
215 this.getPrintBdcqzStatistic()
169 }, 216 },
170 }, 217 },
171 }; 218 };
......
...@@ -50,6 +50,7 @@ ...@@ -50,6 +50,7 @@
50 </template> 50 </template>
51 <script> 51 <script>
52 import * as echarts from "echarts"; 52 import * as echarts from "echarts";
53 import {cstj, exportCstj} from "@/api/tjfx.js";
53 import XLSX from "xlsx"; 54 import XLSX from "xlsx";
54 export default { 55 export default {
55 components: {}, 56 components: {},
...@@ -69,50 +70,62 @@ export default { ...@@ -69,50 +70,62 @@ export default {
69 chooseIndex: 0, // 日期快捷选择项索引 70 chooseIndex: 0, // 日期快捷选择项索引
70 dateRange: [], // 自定义列表 - 日期范围 71 dateRange: [], // 自定义列表 - 日期范围
71 queryForm: {}, 72 queryForm: {},
72 data1: [12, 10, 15, 12, 15, 19, 15], 73 data1: [],
73 data2: [1, 2, 2, 3, 2, 3, 2], 74 data2: [],
74 data3: [], 75 data3: [],
76 selectDate : {
77 startAt:'2020-01-03 02:57:57',
78 endAt:'2025-01-03 02:57:57'
79 },
75 xAxisData: [ 80 xAxisData: [
76 "赵龙龙", 81
77 "刘刚",
78 "任启亮",
79 "梁亚博",
80 "李含",
81 "周路",
82 ], 82 ],
83 }; 83 };
84 }, 84 },
85 mounted() { 85 mounted() {
86 this.setdata(); 86 this.setdata();
87 // 创建一个 ECharts 实例 87
88 this.chart = echarts.init(this.$refs.chart);
89 // 在 ECharts 实例中配置图表
90 this.chart.setOption(this.getOption());
91 this.chooseDateQuick(0);
92 }, 88 },
93 methods: { 89 methods: {
90
91 cstj () {
92 cstj(this.selectDate).then(res => {
93 if (res.code == 200) {
94 let dataSource = res.result;
95 if (dataSource != null) {
96 this.xAxisData = dataSource.map(item => item.assignee)
97 this.data1 = dataSource.map(item => item.total)
98 this.data2 = dataSource.map(item => item.count)
99 this.data3 = dataSource.map(item => item.cumulativeTimeout)
100 }
101 console.log(this.xAxisData)
102 console.log(this.data1)
103 console.log(this.data2)
104 console.log(this.data3)
105 // 创建一个 ECharts 实例
106 this.chart = echarts.init(this.$refs.chart);
107 // 在 ECharts 实例中配置图表
108 this.chart.setOption(this.getOption());
109 }
110 })
111 },
112
94 setdata() { 113 setdata() {
95 for (let i = 0; i < this.data1.length; i++) { 114 this.chooseDateQuick(7)
96 let sum = (this.data2[i] / this.data1[i]) * 100; 115 this.cstj()
97 this.data3.push(Number(sum).toFixed(0));
98 }
99 }, 116 },
100 // 导出 117 // 导出
101 derive() { 118 derive() {
102 this.exdata = [["受理人员", "收件数", "退件数", "推荐率"]]; 119 exportCstj(this.selectDate).then(res => {
103 this.xAxisData.forEach((item, index) => { 120 const link=document.createElement("a");
104 console.log("this.exdata[index+1]", this.exdata[index + 1]); 121 let blob=new Blob([res], { type: "application/vnd.ms-excel" }); //类型excel
105 this.exdata.push([]); 122 link.style.display="none";
106 this.exdata[index + 1].push(item); 123 link.href=URL.createObjectURL(blob);
107 this.exdata[index + 1].push(this.data1[index]); 124 link.setAttribute("download", this.dateRange[0]+'~'+ this.dateRange[1] +'超时统计');
108 this.exdata[index + 1].push(this.data2[index]); 125 document.body.appendChild(link);
109 this.exdata[index + 1].push(this.data3[index]); 126 link.click();
110 }); 127 document.body.removeChild(link);
111 console.log("this.exdata", this.exdata); 128 })
112 const ws = XLSX.utils.aoa_to_sheet(this.exdata);
113 const wb = XLSX.utils.book_new();
114 XLSX.utils.book_append_sheet(wb, ws, "Sheet1");
115 XLSX.writeFile(wb, "收件与超时统计情况.xlsx");
116 }, 129 },
117 // 查询 130 // 查询
118 chchch() { 131 chchch() {
...@@ -140,15 +153,21 @@ export default { ...@@ -140,15 +153,21 @@ export default {
140 }, 153 },
141 // 如果需要自定义 tooltip样式，需要使用formatter 154 // 如果需要自定义 tooltip样式，需要使用formatter
142 formatter: (params) => { 155 formatter: (params) => {
143 console.log("paramsssssssssssssssssss", params); 156 if (params.seriesName == '超时时间') {
157 return `<div font-size: 14px;line-height: 24px>
158 ${params.seriesName}
159 <br>
160 <span font-size: 16px; font-weight: 600;"> ${params.name}: ${
161 Number(params.value).toFixed(2) + "小时"
162 } </span>
163 </div>`;
164 }
144 return `<div font-size: 14px;line-height: 24px> 165 return `<div font-size: 14px;line-height: 24px>
145 ${params.seriesName} 166 ${params.seriesName}
146 <br> 167 <br>
147 <span font-size: 16px; font-weight: 600;"> ${params.name}: ${ 168 <span font-size: 16px; font-weight: 600;"> ${params.name}: ${
148 Number(params.value).toFixed(2) + "%" 169 Number(params.value).toFixed(2) + "件"
149 } </span> 170 } </span>
150
151
152 </div>`; 171 </div>`;
153 }, 172 },
154 }, 173 },
...@@ -279,6 +298,9 @@ export default { ...@@ -279,6 +298,9 @@ export default {
279 this.formatDate(new Date(year - 1, 11, 31)) 298 this.formatDate(new Date(year - 1, 11, 31))
280 ); 299 );
281 } 300 }
301 this.selectDate.startAt = this.dateRange[0] + " 00:00:00"
302 this.selectDate.endAt = this.dateRange[1] + " 00:00:00"
303 this.cstj()
282 }, 304 },
283 // 日期范围选择器事件 305 // 日期范围选择器事件
284 chooseDateRange() { 306 chooseDateRange() {
......
...@@ -53,6 +53,7 @@ ...@@ -53,6 +53,7 @@
53 </template> 53 </template>
54 <script> 54 <script>
55 import * as echarts from "echarts"; 55 import * as echarts from "echarts";
56 import {tjtj, exportTjtj} from "@/api/tjfx.js";
56 import XLSX from 'xlsx'; 57 import XLSX from 'xlsx';
57 export default { 58 export default {
58 components: {}, 59 components: {},
...@@ -69,62 +70,68 @@ export default { ...@@ -69,62 +70,68 @@ export default {
69 { code: "7", name: "今年" }, 70 { code: "7", name: "今年" },
70 { code: "8", name: "去年" }, 71 { code: "8", name: "去年" },
71 ], 72 ],
73 selectDate : {
74 startAt:'2020-01-03 02:57:57',
75 endAt:'2025-01-03 02:57:57'
76 },
72 chooseIndex: 0, // 日期快捷选择项索引 77 chooseIndex: 0, // 日期快捷选择项索引
73 dateRange: [], // 自定义列表 - 日期范围 78 dateRange: [], // 自定义列表 - 日期范围
74 queryForm: {}, 79 queryForm: {},
75 data1: [23, 45, 23, 11, 15, 19, 35], 80 data1: [],
76 data2: [1, 4, 1, 3, 2, 3, 4], 81 data2: [],
77 data3: [], 82 data3: [],
78 xAxisData: [ 83 xAxisData: [],
79 "任超",
80 "杨威",
81 "魏娜",
82 "张祎旋",
83 "苗菁",
84 "王文刚",
85 "单帅旗",
86 ],
87 }; 84 };
88 }, 85 },
89 mounted() { 86 mounted() {
90 this.setdata(); 87 this.setdata();
91 // 创建一个 ECharts 实例
92 this.chart = echarts.init(this.$refs.chart);
93 // 在 ECharts 实例中配置图表
94 this.chart.setOption(this.getOption());
95 this.chooseDateQuick(0);
96
97 }, 88 },
98 methods: { 89 methods: {
90
91 tjtj () {
92 tjtj(this.selectDate).then(res => {
93 if (res.code == 200) {
94 let dataSource = res.result;
95 if (dataSource != null) {
96 this.xAxisData = dataSource.map(item => item.assignee)
97 this.data1 = dataSource.map(item => item.sj)
98 this.data2 = dataSource.map(item => item.tj)
99 this.data3 = dataSource.map(item => item.tjl)
100 }
101 console.log(this.xAxisData)
102 console.log(this.data1)
103 console.log(this.data2)
104 console.log(this.data3)
105 // 创建一个 ECharts 实例
106 this.chart = echarts.init(this.$refs.chart);
107 // 在 ECharts 实例中配置图表
108 this.chart.setOption(this.getOption());
109 }
110 })
111 },
112
99 setdata() { 113 setdata() {
100 for (let i = 0; i < this.data1.length; i++) { 114 this.chooseDateQuick(7)
101 let sum = (this.data2[i] / this.data1[i]) * 100; 115 this.tjtj()
102 this.data3.push(Number(sum).toFixed(0));
103 }
104 }, 116 },
105 // 导出 117 // 导出
106 // 导出 118 // 导出
107 derive() { 119 derive() {
108 this.exdata = [ 120 exportTjtj(this.selectDate).then(res => {
109 ['受理人员', '收件数','退件数','推荐率'] 121 const link=document.createElement("a");
110 ]; 122 let blob=new Blob([res], { type: "application/vnd.ms-excel" }); //类型excel
111 this.xAxisData.forEach((item,index) => { 123 link.style.display="none";
112 console.log("this.exdata[index+1]",this.exdata[index+1]); 124 link.href=URL.createObjectURL(blob);
113 this.exdata.push([]) 125 link.setAttribute("download", this.dateRange[0]+'~'+ this.dateRange[1] +'收件退件统计');
114 this.exdata[index+1].push(item) 126 document.body.appendChild(link);
115 this.exdata[index+1].push(this.data1[index]) 127 link.click();
116 this.exdata[index+1].push(this.data2[index]) 128 document.body.removeChild(link);
117 this.exdata[index+1].push(this.data3[index]) 129 })
118 })
119 console.log("this.exdata",this.exdata);
120 const ws = XLSX.utils.aoa_to_sheet(this.exdata);
121 const wb = XLSX.utils.book_new();
122 XLSX.utils.book_append_sheet(wb, ws, 'Sheet1');
123 XLSX.writeFile(wb, '收件与退件统计情况.xlsx');
124 }, 130 },
125 // 查询 131 // 查询
126 chchch() { 132 chchch() {
127 console.log("dateRange", this.dateRange); 133 console.log("dateRange", this.dateRange);
134 this.setdata()
128 }, 135 },
129 getOption() { 136 getOption() {
130 return { 137 return {
...@@ -148,11 +155,20 @@ console.log("this.exdata",this.exdata); ...@@ -148,11 +155,20 @@ console.log("this.exdata",this.exdata);
148 }, 155 },
149 // 如果需要自定义 tooltip样式，需要使用formatter 156 // 如果需要自定义 tooltip样式，需要使用formatter
150 formatter: (params) => { 157 formatter: (params) => {
158 if (params.seriesName == '退件率') {
159 return `<div font-size: 14px;line-height: 24px>
160 ${params.seriesName}
161 <br>
162 <span font-size: 16px; font-weight: 600;"> ${params.name}: ${
163 Number(params.value).toFixed(2) + "%"
164 } </span>
165 </div>`;
166 }
151 return `<div font-size: 14px;line-height: 24px> 167 return `<div font-size: 14px;line-height: 24px>
152 ${params.seriesName} 168 ${params.seriesName}
153 <br> 169 <br>
154 <span font-size: 16px; font-weight: 600;"> ${params.name}: ${ 170 <span font-size: 16px; font-weight: 600;"> ${params.name}: ${
155 Number(params.value).toFixed(2) + "%" 171 Number(params.value).toFixed(2) + "件"
156 } </span> 172 } </span>
157 </div>`; 173 </div>`;
158 }, 174 },
...@@ -284,6 +300,9 @@ console.log("this.exdata",this.exdata); ...@@ -284,6 +300,9 @@ console.log("this.exdata",this.exdata);
284 this.formatDate(new Date(year - 1, 11, 31)) 300 this.formatDate(new Date(year - 1, 11, 31))
285 ); 301 );
286 } 302 }
303 this.selectDate.startAt = this.dateRange[0] + " 00:00:00"
304 this.selectDate.endAt = this.dateRange[1] + " 00:00:00"
305 this.tjtj()
287 }, 306 },
288 // 日期范围选择器事件 307 // 日期范围选择器事件
289 chooseDateRange() { 308 chooseDateRange() {
......
1 <!-- 1 <!--
2 * @Description: 2 * @Description:
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-11-22 17:09:14 4 * @LastEditTime: 2023-11-22 17:09:14
5 --> 5 -->
...@@ -65,10 +65,18 @@ ...@@ -65,10 +65,18 @@
65 } 65 }
66 }) 66 })
67 } else { 67 } else {
68 getPrintTemplateByCode({ tmpno: Vue.prototype.BASE_API.adapter + '-2' }).then(res => { 68 // getPrintTemplateByCode({ tmpno: Vue.prototype.BASE_API.adapter + '-2' }).then(res => {
69 getPrintTemplateByCode({ tmpno: 'dysqs-bz-2' }).then(res => {
69 if (res.code === 200) { 70 if (res.code === 200) {
70 getPrintApplicationForm(this.formData.bsmSldy).then(infoRes => { 71 getPrintApplicationForm(this.formData.bsmSldy).then(infoRes => {
71 if (infoRes.code === 200) { 72 if (infoRes.code === 200) {
73 if (infoRes.result.fileList && infoRes.result.fileList.length > 0) {
74 infoRes.result.fileList.forEach((it, index) => {
75 let key = index + 1
76 this.$set(infoRes.result, "file" + key, it.sjmc)
77 })
78 }
79 console.log(infoRes.result)
72 let LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM')); 80 let LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM'));
73 81
74 // 装载第一个模板并设置数据 82 // 装载第一个模板并设置数据
...@@ -92,4 +100,4 @@ ...@@ -92,4 +100,4 @@
92 } 100 }
93 } 101 }
94 } 102 }
95 </script>
...\ No newline at end of file ...\ No newline at end of file
103 </script>
......
1 <!-- 1 <!--
2 * @Description: 2 * @Description:
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-12-29 16:35:50 4 * @LastEditTime: 2023-12-29 16:35:50
5 --> 5 -->
...@@ -113,6 +113,10 @@ ...@@ -113,6 +113,10 @@
113 label: "收费人员", 113 label: "收费人员",
114 }, 114 },
115 { 115 {
116 prop: "sfkmmc",
117 label: "收费科目名称",
118 },
119 {
116 prop: "sjffr", 120 prop: "sjffr",
117 label: "实际付费人", 121 label: "实际付费人",
118 }, 122 },
...@@ -227,4 +231,4 @@ ...@@ -227,4 +231,4 @@
227 margin-left: 10px; 231 margin-left: 10px;
228 } 232 }
229 } 233 }
230 </style>
...\ No newline at end of file ...\ No newline at end of file
234 </style>
......
...@@ -99,7 +99,7 @@ ...@@ -99,7 +99,7 @@
99 } 99 }
100 }; 100 };
101 import store from '@/store/index.js' 101 import store from '@/store/index.js'
102 import { addQy, update } from "@/api/xxba.js" 102 import { addQy, update, addYh } from "@/api/xxba.js"
103 import clxx from './clxx/index.vue' 103 import clxx from './clxx/index.vue'
104 export default { 104 export default {
105 props: { 105 props: {
...@@ -215,19 +215,36 @@ ...@@ -215,19 +215,36 @@
215 that.$refs['ruleForm'].validate((valid) => { 215 that.$refs['ruleForm'].validate((valid) => {
216 if (valid) { 216 if (valid) {
217 store.dispatch("user/refreshPage", false); 217 store.dispatch("user/refreshPage", false);
218 addQy(this.ruleForm).then(res => { 218 if (this.formData.QyYh == 1) {
219 if (res.code == 200) { 219 addQy(this.ruleForm).then(res => {
220 that.$message.success('保存成功') 220 if (res.code == 200) {
221 that.$emit("input", false); 221 that.$message.success('保存成功')
222 that.$refs['ruleForm'].resetFields(); 222 that.$emit("input", false);
223 that.resetTableFields(); 223 that.$refs['ruleForm'].resetFields();
224 that.closeDialog(); 224 that.resetTableFields();
225 //刷新列表 225 that.closeDialog();
226 store.dispatch("user/refreshPage", true); 226 //刷新列表
227 } else { 227 store.dispatch("user/refreshPage", true);
228 that.$message.error(res.message); 228 } else {
229 } 229 that.$message.error(res.message);
230 }) 230 }
231 })
232 } else {
233 addYh(this.ruleForm).then(res => {
234 if (res.code == 200) {
235 that.$message.success('保存成功')
236 that.$emit("input", false);
237 that.$refs['ruleForm'].resetFields();
238 that.resetTableFields();
239 that.closeDialog();
240 //刷新列表
241 store.dispatch("user/refreshPage", true);
242 } else {
243 that.$message.error(res.message);
244 }
245 })
246 }
247
231 } else { 248 } else {
232 this.$message.error('请完善表单'); 249 this.$message.error('请完善表单');
233 return false; 250 return false;
......
1 <!-- 1 <!--
2 * @Description: 2 * @Description:
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-09-15 15:41:36 4 * @LastEditTime: 2024-01-17 09:04:11
5 --> 5 -->
6 <template> 6 <template>
7 <div class="from-clues"> 7 <div class="from-clues">
...@@ -106,7 +106,7 @@ ...@@ -106,7 +106,7 @@
106 * @author: renchao 106 * @author: renchao
107 */ 107 */
108 handleAdd () { 108 handleAdd () {
109 this.$popupDialog("添加企业", "xxba/components/addDialog", { isAdd: 1 }, "75%") 109 this.$popupDialog("添加企业", "xxba/qyxxba/components/addDialog", { isAdd: 1, QyYh: 1 }, "75%")
110 }, 110 },
111 /** 111 /**
112 * @description: handleDelete 112 * @description: handleDelete
......
1 <template>
2 <div style="height:650px">
3 <el-tabs v-model="activeName" @tab-click="handleClick">
4 <el-tab-pane label="银行信息" name="1"></el-tab-pane>
5 <el-tab-pane label="材料信息" v-if="formData.isAdd==2" name="2"></el-tab-pane>
6 </el-tabs>
7 <el-form ref="ruleForm" :model="ruleForm" label-width="100px" style="height:90%" v-if="activeName==1" :rules="rules">
8 <div style="height:90%">
9 <el-row>
10 <el-col :span="12">
11 <el-form-item label="银行名称:" prop="qymc">
12 <el-input v-model="ruleForm.qymc"></el-input>
13 </el-form-item>
14 </el-col>
15 <el-col :span="12">
16 <el-form-item label="电话:" prop="dh">
17 <el-input v-model.number="ruleForm.dh" maxlength="11"></el-input>
18 </el-form-item>
19 </el-col>
20 </el-row>
21 <el-row>
22 <el-col :span="12">
23 <el-form-item label="证件种类:" prop="zjzl">
24 <el-select
25 clearable
26 v-model="ruleForm.zjzl"
27 class="width100"
28 placeholder="请选择">
29 <el-option
30 v-for="item in zjzlList"
31 :key="item.dcode"
32 :label="item.dname"
33 :value="item.dcode">
34 </el-option>
35 </el-select>
36 </el-form-item>
37 </el-col>
38 <el-col :span="12">
39 <el-form-item label="证件号:" prop="zjh">
40 <el-input v-model="ruleForm.zjh" maxlength="18"></el-input>
41 </el-form-item>
42 </el-col>
43 </el-row>
44
45 <el-row>
46 <el-col :span="12">
47 <el-form-item label="法人名称:" prop="frmc">
48 <el-input v-model="ruleForm.frmc"></el-input>
49 </el-form-item>
50 </el-col>
51 <el-col :span="12">
52 <el-form-item label="法人电话:" prop="frdh">
53 <el-input v-model="ruleForm.frdh" maxlength="11"></el-input>
54 </el-form-item>
55 </el-col>
56 </el-row>
57 <el-row>
58 <el-col :span="12">
59 <el-form-item label="单位地址:" prop="dwdz">
60 <el-input v-model="ruleForm.dwdz"></el-input>
61 </el-form-item>
62 </el-col>
63 <el-col :span="12">
64 <el-form-item label="邮编:" prop="yb">
65 <el-input v-model="ruleForm.yb"></el-input>
66 </el-form-item>
67 </el-col>
68 </el-row>
69 </div>
70 <el-form-item style="text-align:center">
71 <el-button @click="closeDialog">取消</el-button>
72 <el-button type="primary" @click="submitForm">保存</el-button>
73 </el-form-item>
74 </el-form>
75 <clxx v-if="activeName==2" :formData="formData" />
76 </div>
77 </template>
78
79 <script>
80 const checkPhone = (rule, value, callback) => {
81 let regPone = null
82 let mobile = /^(1[3456789]\d{9})$/ //手机号
83 let tel = /^((0\d{2,3}-\d{7,8})|(1[3584]\d{9}))$/ // 座机
84 if (value && value[0] === '0') {// 检查 value 是否存在并且不是 null 或者 undefined
85 regPone = tel
86 } else if (value && value[0] !== '0') {
87 regPone = mobile
88 }
89 if (regPone === null) {
90 return callback(
91 new Error('请输入电话')
92 )
93 } else if (!regPone.test(value)) {
94 return callback(
95 new Error("请输入正确的电话格式,其中座机格式'区号-座机号码'")
96 )
97 } else {
98 callback()
99 }
100 };
101 import store from '@/store/index.js'
102 import { addQy, update, addYh } from "@/api/xxba.js"
103 import clxx from './clxx/index.vue'
104 export default {
105 props: {
106 formData: {
107 type: Object,
108 default: () => { },
109 },
110 },
111 components: {
112 clxx
113 },
114 data () {
115 return {
116 zjzlList: store.getters.dictData['A30'],
117 activeName: "1",
118 DJJGLIST: store.getters.dictData['ywly'],
119 readOnly: false,
120 //表单提交数据
121 ruleForm: {
122 batchno: '',
123 djjg: '',
124 operationtime: '',
125 bz: '',
126 zsstarno: '',
127 zsendno: '',
128 zsnum: '',
129 zmstarno: '',
130 zmendno: '',
131 zmnum: ''
132 },
133 //表格数据
134 tableForm: [
135 {
136 name: '不动产权证书',
137 ksysxlh: '',
138 jsysxlh: '',
139 bs: 0,
140 zslx: 1
141 },
142 {
143 name: '不动产登记证明',
144 ksysxlh: '',
145 jsysxlh: '',
146 bs: 0,
147 zslx: 2
148 }
149 ],
150 rules: {
151 qymc: [
152 { required: true, message: '银行名称不能为空', trigger: 'blur' }
153 ],
154 dh: [
155 { required: true, validator: checkPhone, trigger: ["blur"] },
156 ],
157 zjzl: [
158 { required: true, message: '请选择证件种类', trigger: 'change' }
159 ],
160 zjh: [
161 { required: true, message: '请输入证件号', trigger: 'blur' }
162 ],
163 frmc: [
164 { required: true, message: '请输入法人名称', trigger: 'blur' }
165 ],
166 frdh: [
167 { required: true, validator: checkPhone, trigger: ["blur"] },
168 ],
169 dwdz: [
170 { required: true, message: '请输入单位地址', trigger: 'blur' }
171 ]
172 }
173 }
174 },
175 mounted () {
176 if (this.formData.bsmBatch) {
177 this.tableForm[0].bs = null;
178 this.tableForm[1].bs = null;
179 this.getDetailInfo(this.formData.bsmBatch)
180 }
181 let list = Object.keys(this.formData).length
182 if (list > 0) {
183 this.ruleForm = this.formData
184 }
185 },
186 methods: {
187 handleClick () { },
188 /**
189 * @description: 表单提交
190 * @author: renchao
191 */
192 submitForm () {
193 let that = this
194 this.tableForm.forEach((item, index) => {
195 if (item.bs < 0) {
196 return;
197 }
198 })
199 if (this.formData.isAdd != 1) {
200 store.dispatch("user/refreshPage", false);
201 update(this.ruleForm).then(res => {
202 if (res.code == 200) {
203 this.$message.success('保存成功')
204 this.$emit("input", false);
205 this.$refs['ruleForm'].resetFields();
206 this.resetTableFields();
207 this.closeDialog();
208 //刷新列表
209 store.dispatch("user/refreshPage", true);
210 } else {
211 this.$message.error(res.message);
212 }
213 })
214 } else {
215 that.$refs['ruleForm'].validate((valid) => {
216 if (valid) {
217 store.dispatch("user/refreshPage", false);
218 if (this.formData.QyYh == 1) {
219 addQy(this.ruleForm).then(res => {
220 if (res.code == 200) {
221 that.$message.success('保存成功')
222 that.$emit("input", false);
223 that.$refs['ruleForm'].resetFields();
224 that.resetTableFields();
225 that.closeDialog();
226 //刷新列表
227 store.dispatch("user/refreshPage", true);
228 } else {
229 that.$message.error(res.message);
230 }
231 })
232 } else {
233 addYh(this.ruleForm).then(res => {
234 if (res.code == 200) {
235 that.$message.success('保存成功')
236 that.$emit("input", false);
237 that.$refs['ruleForm'].resetFields();
238 that.resetTableFields();
239 that.closeDialog();
240 //刷新列表
241 store.dispatch("user/refreshPage", true);
242 } else {
243 that.$message.error(res.message);
244 }
245 })
246 }
247
248 } else {
249 this.$message.error('请完善表单');
250 return false;
251 }
252 })
253 }
254 },
255 /**
256 * @description: 获取详情信息
257 * @param {*} bsmBatch
258 * @author: renchao
259 */
260 getDetailInfo (bsmBatch) {
261 getZsglInfo({ "bsmBatch": bsmBatch }).then(res => {
262 if (res.code == 200) {
263 this.ruleForm = res.result;
264 this.readOnly = false;
265 this.tableForm[0].ksysxlh = res.result.zsstarno;
266 this.tableForm[0].jsysxlh = res.result.zsendno;
267 this.tableForm[0].bs = res.result.zsnum;
268 this.tableForm[1].ksysxlh = res.result.zmstarno;
269 this.tableForm[1].jsysxlh = res.result.zmendno;
270 this.tableForm[1].bs = res.result.zmnum;
271 }
272 })
273 },
274 /**
275 * @description: resetTableFields
276 * @author: renchao
277 */
278 resetTableFields () {
279 this.tableForm = [
280 {
281 name: '不动产权证书',
282 ksysxlh: '',
283 jsysxlh: '',
284 bs: 0,
285 zslx: 1
286 },
287 {
288 name: '不动产权登记证明',
289 ksysxlh: '',
290 jsysxlh: '',
291 bs: 0,
292 zslx: 2
293 }
294 ]
295 },
296 /**
297 * @description: closeDialog
298 * @author: renchao
299 */
300 closeDialog () {
301 this.$popupCacel()
302 this.$refs['ruleForm'].resetFields();
303 this.resetTableFields();
304 }
305 }
306 }
307 </script>
308 <style scoped lang="scss">
309 @import "~@/styles/mixin.scss";
310 @import "~@/styles/dialogBoxheader.scss";
311
312 .font-red {
313 color: red;
314 }
315
316 .middle-margin-bottom {
317 margin-top: 20px;
318 }
319 </style>
1 <!--
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-09-15 15:50:26
5 -->
6 <template>
7 <dialogBox title="新建材料信息" width="20%" isMain v-model="myValue" @closeDialog="closeDialog" @submitForm="handleSubmit"
8 :isFullscreen="false">
9 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="80px">
10 <el-row>
11 <el-col :span="24">
12 <el-form-item label="材料类型" prop="cllx">
13 <el-select v-model="ruleForm.cllx" class="width100" placeholder="请选择">
14 <el-option v-for="item in cllxList" :key="item.dcode" :label="item.dname" :value="item.dcode">
15 </el-option>
16 </el-select>
17 </el-form-item>
18 </el-col>
19 </el-row>
20 <el-row :gutter="20">
21 <el-col :span="24">
22 <el-form-item label="材料名称" prop="clmc">
23 <el-input v-model="ruleForm.clmc"></el-input>
24 </el-form-item>
25 </el-col>
26 </el-row>
27 <el-row :gutter="20">
28 <el-col :span="24">
29 <el-form-item label="材料编码" prop="clbm">
30 <el-input v-model="ruleForm.clbm"></el-input>
31 </el-form-item>
32 </el-col>
33 </el-row>
34 </el-form>
35 </dialogBox>
36 </template>
37 <script>
38 import store from '@/store/index.js'
39 export default {
40 props: {
41 value: { type: Boolean, default: false },
42 },
43 data () {
44 return {
45 cllxList: store.getters.dictData['A40'],
46 myValue: this.value,
47 ruleForm: {
48 cllx: "",
49 clmc: "",
50 clbm: ""
51 },
52 rules: {
53 cllx: [
54 { required: true, message: '请选择材料类型', trigger: 'change' }
55 ],
56 clmc: [
57 { required: true, message: '请输入材料名称', trigger: 'blur' }
58 ],
59 clbm: [
60 { required: true, message: '请输入材料编码', trigger: 'blur' }
61 ],
62 }
63 }
64 },
65 watch: {
66 value (val) {
67 this.myValue = val;
68 },
69 },
70 methods: {
71 /**
72 * @description: closeDialog
73 * @author: renchao
74 */
75 closeDialog () {
76 this.$emit("input", false);
77 this.ruleForm = {
78 cllx: "",
79 clmc: "",
80 }
81 },
82 /**
83 * @description: handleSubmit
84 * @author: renchao
85 */
86 handleSubmit () {
87 this.$refs['ruleForm'].validate((valid) => {
88 if (valid) {
89 this.$parent.addSave(this.ruleForm);
90 this.ruleForm = {
91 cllx: "",
92 clmc: "",
93 }
94 this.$emit("input", false);
95 } else {
96 return false;
97 }
98 })
99 }
100 }
101 };
102 </script>
103 <style scoped lang="scss">
104 .submit-button {
105 text-align: center;
106 height: 52px;
107 padding-top: 10px;
108 background-color: #fff;
109 }
110 </style>
1 <!--
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-09-15 15:38:53
5 -->
6 <template>
7 <div class="clmlmx-box">
8 <lb-table :column="column" :key="key" row-key="bsmMaterial" ref="listTable" :heightNumSetting="true" :calcHeight="500" :pagination="false"
9 :data="tableData">
10 </lb-table>
11 <div class="text-center">
12 <el-button @click="handleCancel">取消</el-button>
13 <el-button type="primary" @click="handleSubmit" :loading="loading">保存</el-button>
14 </div>
15 </div>
16 </template>
17 <script>
18 import store from '@/store/index.js'
19 import Sortable from 'sortablejs'
20 import { ywPopupCacel } from "@/utils/popup.js";
21 import { editCompanyMaterialList } from "@/api/company.js";
22 export default {
23 props: {
24 formData: {
25 type: Object,
26 default: () => {
27 return {}
28 }
29 }
30 },
31 data () {
32 return {
33 loading: false,
34 sortable: null,
35 column: [
36 {
37 label: "材料名称",
38 render: (h, scope) => {
39 return (
40 <el-input value={scope.row.clmc} onInput={(val) => { scope.row.clmc = val }}></el-input>
41 )
42 }
43 },
44 {
45 label: "材料编码",
46 render: (h, scope) => {
47 return (
48 <el-input value={scope.row.clbm} onInput={(val) => { scope.row.clbm = val }}></el-input>
49 )
50 }
51 },
52 {
53 label: "材料类型",
54 width: "110",
55 render: (h, scope) => {
56 return (
57 <el-select value={scope.row.cllx}
58 onChange={(val) => { scope.row.cllx = val }}>
59 {
60 store.getters.dictData['A40'].map(option => {
61 return (
62 <el-option label={option.dname} value={option.dcode}></el-option>
63 )
64 })
65 }
66 </el-select>
67 )
68 }
69 },
70 {
71 label: "页数",
72 width: "80",
73 render: (h, scope) => {
74 if (scope.row.count && scope.row.count > 0) {
75 return (
76 <div>
77 <span>{scope.row.count}</span>
78 </div>
79 );
80 } else {
81 return (
82 <div>
83 <span>0</span>
84 </div>
85 );
86 }
87 },
88 },
89 {
90 label: "操作",
91 width: "100",
92 render: (h, scope) => {
93 return (
94 <el-button
95 type="text"
96 icon="el-icon-delete"
97 disabled={scope.row.count != 0}
98 onClick={() => {
99 this.handleDelete(scope.$index, scope.row);
100 }}
101 >
102 删除
103 </el-button>
104 )
105 }
106 }
107 ],
108 key: 0,
109 tableData: []
110 }
111 },
112 mounted () {
113 this.initSort()
114 this.tableData = _.cloneDeep(this.formData.data)
115 },
116 beforeDestroy () {
117 if (this.sortable) {
118 this.sortable.destroy();
119 }
120 },
121 watch: {
122 'formData.data': {
123 handler: function (val, oldVal) {
124 this.tableData = _.cloneDeep(val)
125 },
126 immediate: true,
127 deep: true
128 }
129 },
130 methods: {
131 handleCancel () {
132 ywPopupCacel()
133 },
134 handleSubmit () {
135 this.loading = true
136 store.dispatch('user/reWorkFresh', false)
137 editCompanyMaterialList(this.tableData, this.formData.bsmCompany).then(res => {
138 this.loading = false
139 if (res.code == 200) {
140 this.$message({
141 message: '保存成功',
142 type: 'success'
143 })
144 store.dispatch('user/reWorkFresh', true)
145 ywPopupCacel()
146 }
147 }).catch(() => {
148 this.loading = false
149 })
150 },
151 /**
152 * @description: 材料目录删除
153 * @param {*} index
154 * @param {*} row
155 * @author: renchao
156 */
157 handleDelete (index, row) {
158 this.$confirm('此操作将永久删除该 是否继续?', '提示', {
159 confirmButtonText: '确定',
160 cancelButtonText: '取消',
161 type: 'warning'
162 }).then(() => {
163 this.tableData.splice(index, 1);
164 }).catch(() => {
165 this.$message({
166 type: 'info',
167 message: '已取消删除'
168 })
169 })
170 },
171 initSort () {
172 const el = this.$refs.listTable.$el.querySelectorAll('.el-table__body-wrapper > table > tbody')[0]
173 this.sortable = Sortable.create(el, {
174 ghostClass: 'sortable-ghost',
175 setData: function (dataTransfer) {
176 dataTransfer.setData('Text', '')
177 },
178 onEnd: evt => {
179 const targetRow = this.tableData.splice(evt.oldIndex, 1)[0];
180 this.tableData.splice(evt.newIndex, 0, targetRow);
181 }
182 })
183 }
184 }
185 }
186 </script>
187 <style scoped lang='scss'>
188 @import "~@/styles/mixin.scss";
189 .clmlmx-box {
190 margin: 0 auto;
191 .title {
192 text-align: center;
193 height: 60px;
194 line-height: 60px;
195 border: 1px solid #dfe6ec;
196 font-size: 20px;
197 background: #81d3f81a;
198 margin-bottom: -1px;
199 }
200 }
201 </style>
1 <!--
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-12-15 14:42:21
5 -->
6 <template>
7 <div class="rlPopup">
8 <div class="prev handle-btn" v-if="!isScan" @click="prev()">
9 <i class="el-icon-arrow-left"></i>
10 </div>
11 <div class="next handle-btn" v-if="!isScan" @click="next()">
12 <i class="el-icon-arrow-right"></i>
13 </div>
14 <div class="img-list-wrap" v-Loading="loading">
15 <img id="photo" src="" v-show="isScan && this.BASE_API.gaopaiyi=='jy'" alt="高拍仪捷宇">
16 <img src="http://127.0.0.1:38088/video=stream&camidx=0" v-if="isScan && this.BASE_API.gaopaiyi=='lt'" alt="高拍仪良田">
17 <div v-for="(img, i) in previewImg.imgList" :key="i" v-else>
18 <photo-zoom :url="img.fileurl" :bigWidth="165" v-if="i === previewImg.index" :scale="2"
19 overlayStyle="width: 100%;height:100%">
20 </photo-zoom>
21 </div>
22 </div>
23 <!--缩略图-->
24 <div class="thumb-wrap">
25 <div class="thumb-wrap-button">
26 <el-button type="primary" @click="clickImage" v-if="previewImg.imgList.length>0">（放大） 显示（缩小）</el-button>
27 <el-upload class="fileUpdate" ref="upload" :key="key" action="" :show-file-list="false" :multiple="true" :auto-upload="false"
28 :on-change="handleChange"
29 accept=".JPG, .PNG, .JPEG,.jpg, .png, .jpeg">
30 <el-button icon="el-icon-upload" type="primary" :loading="upDateloading" v-if="ableOperation">上传</el-button>
31 </el-upload>
32 <!-- 左移右移 -->
33 <el-button type="primary" @click="handleMove('left')" v-if="ableOperation && thumbnailImages.length>0">左移</el-button>
34 <el-button type="primary" @click="handleMove('right')" v-if="ableOperation && thumbnailImages.length>0">右移</el-button>
35 <el-button type="primary" icon="el-icon-delete-solid" @click="handleDelete"
36 v-if="thumbnailImages.length>0 && ableOperation">删除</el-button>
37 <div v-if="ableOperation" class="pl-5">
38 <el-button type="primary" @click="handleOpenScan" v-if="ableOperation" :loading="loading">{{scanTitle}}</el-button>
39 <el-button type="primary" @click="handleViewScan" v-if="isScan && ableOperation">拍照</el-button>
40 </div>
41 </div>
42 <ul>
43 <li v-for="(img, index) in thumbnailImages" :key="index" :class="{ active: previewImg.index === index }"
44 @click="showCurrent(index)">
45 <img :src="img.fileurl">
46 </li>
47 </ul>
48 </div>
49 <!-- 点开后的视图 -->
50 <publicPicture v-if="showViewer" :url-list="allLi" :initialIndex="initialIndex" @close-viewer="closeViewer">
51 </publicPicture>
52 </div>
53 </template>
54 <script>
55 import PhotoZoom from '@/components/PhotoZoom'
56 import { getAltimeterInfo, getUuid } from '@/utils/operation.js'
57 import { uploadBatch, deleteFile, move, uploadSjClmx } from "@/api/company.js"
58 import publicPicture from '@/components/publicPicture/index.vue'
59 export default {
60 name: 'PreviewImage',
61 props: {
62 previewImg: {
63 type: Object,
64 default: () => { }
65 },
66 ableOperation: {
67 type: Boolean,
68 default: true
69 }
70 },
71 components: {
72 PhotoZoom,
73 publicPicture
74 },
75 data () {
76 return {
77 upDateloading: false,
78 loading: false,
79 key: 0,
80 isScan: false,
81 // 打开高拍仪
82 scanTitle: '打开高拍仪',
83 transform: {
84 scale: 1,
85 degree: 0
86 },
87 maxFileLength: 0,
88 // 缩略图
89 thumbnailImages: [],
90 showViewer: false,
91 initialIndex: 0,
92 allLi: [],
93 webSocket: null
94 }
95 },
96 watch: {
97 previewImg: {
98 handler (newValue, oldValue) {
99 if (newValue.imgList && newValue.imgList.length > 0) {
100 this.allLi = _.cloneDeep(newValue.imgList).map(item => item.fileurl)
101 this.thumbnailImages = newValue.imgList
102 } else {
103 this.allLi = []
104 this.thumbnailImages = []
105 }
106 },
107 deep: true,
108 immediate: true
109 }
110 },
111 created () {
112 this.maxLength = 0;
113 this.allLi = _.cloneDeep(this.previewImg.imgList).map(item => item.fjurl)
114 this.thumbnailImages = this.previewImg.imgList
115 },
116 computed: {
117 isFirst () {
118 return this.previewImg.index === 0
119 },
120 isLast () {
121 return this.previewImg.index === this.previewImg.imgList.length - 1
122 }
123 },
124 methods: {
125 /**
126 * @description: 打开高拍仪
127 * @author: renchao
128 */
129 handleOpenScan () {
130 let that = this
131 this.isScan = !this.isScan
132 if (this.isScan) {
133 this.loading = true
134 this.$message({
135 message: '正在启动程序请稍等',
136 type: 'success'
137 })
138 setTimeout(() => {
139 this.scanTitle = '关闭高拍仪'
140 this.loading = false
141 }, 3000)
142 } else {
143 this.scanTitle = '打开高拍仪'
144 }
145 if (this.BASE_API.gaopaiyi == 'jy') {
146 let webSocket = new WebSocket('ws://localhost:1818');
147 this.webSocket = webSocket
148 webSocket.onopen = function (event) {
149 webSocket.send('bStartPlay')
150 webSocket.send('vSetPreviewRect(1600,1200)')
151 }
152 webSocket.onmessage = function (event) {
153 let begin_data = "data:image/jpeg;base64,";
154 document.getElementById('photo').src = begin_data + event.data;
155 if (event.data.indexOf('BeginsGetBase64') >= 0) {
156 let blob = that.dataURLtoBlob('data:image/png;base64,' + event.data.replace('BeginsGetBase64', '').replace('EndsGetBase64', ''));
157 let file = that.blobToFile(blob);
158 var formData = new FormData();
159 formData.append('file', file)
160 if (that.previewImg.imgList.length > 0) {
161 formData.append("index", that.previewImg.imgList[that.previewImg.index].sxh);
162 }
163 uploadSjClmx(formData, that.previewImg.bsmMaterial).then((res) => {
164 if (res.code == 200) {
165 that.$emit('updateList', { children: res.result, bsmMaterial: that.previewImg.bsmMaterial })
166 that.$message({
167 message: '上传成功!',
168 type: 'success'
169 })
170 }
171 })
172 }
173 }
174 }
175 },
176 /**
177 * @description: 左右移动
178 * @param {*} direction
179 * @author: renchao
180 */
181 handleMove (direction) {
182 move(this.previewImg.imgList[this.previewImg.index].bsmFile, direction).then(res => {
183 if (res.code == 200) {
184 if (direction == 'left') {
185 this.previewImg.index = this.previewImg.index - 1
186 } else {
187 this.previewImg.index = this.previewImg.index + 1
188 }
189 this.initialIndex = this.previewImg.index
190 this.$emit('updateList', { children: res.result, bsmMaterial: this.previewImg.bsmMaterial })
191 this.$message({
192 message: '移动成功!',
193 type: 'success'
194 })
195 } else {
196 this.$message.error(res.message);
197 }
198 })
199 },
200 /**
201 * @description: 拍照
202 * @author: renchao
203 */
204 dataURLtoBlob (base64String) {
205 const arr = base64String.split(',');
206 if (arr.length !== 2) {
207 throw new Error('Invalid Base64 format');
208 }
209 const mime = arr[0].match(/:(.*?);/)[1];
210 if (!mime) {
211 throw new Error('Cannot retrieve MIME type');
212 }
213 const bstr = atob(arr[1]);
214 const n = bstr.length;
215 const u8arr = new Uint8Array(n);
216 for (let i = 0; i < n; i++) {
217 u8arr[i] = bstr.charCodeAt(i);
218 }
219 return new Blob([u8arr], { type: mime });
220 },
221 blobToFile (blob) {
222 let name = getUuid(8) + '.jpg'
223 const file = new File([blob], name);
224 return file;
225 },
226 handleViewScan () {
227 if (this.BASE_API.gaopaiyi == 'jy') {
228 this.webSocket.send('sGetBase64');
229 return
230 }
231 getAltimeterInfo().then(res => {
232 let blob = dataURLtoBlob('data:image/png;base64,' + res.data.photoBase64);
233 let file = blobToFile(blob);
234 var formData = new FormData();
235 formData.append('file', file)
236 if (this.previewImg.imgList.length > 0) {
237 formData.append("index", this.previewImg.imgList[this.previewImg.index].sxh);
238 }
239 uploadSjClmx(formData, this.previewImg.bsmMaterial).then((res) => {
240 if (res.code == 200) {
241 this.$emit('updateList', { children: res.result, bsmMaterial: this.previewImg.bsmMaterial })
242 this.$message({
243 message: '上传成功!',
244 type: 'success'
245 })
246 }
247 })
248 })
249 },
250 /**
251 * @description: prev
252 * @author: renchao
253 */
254 prev () {
255 let len = this.previewImg.imgList.length
256 if (this.isFirst || len == 0) {
257 this.$emit('prevPriview')
258 } else {
259 this.$parent.previewImg.index = (this.$parent.previewImg.index - 1 + len) % len
260 }
261 },
262 /**
263 * @description: next
264 * @author: renchao
265 */
266 next () {
267 let len = this.previewImg.imgList.length
268 if (this.isLast || len == 0) {
269 this.$emit('nextPriview')
270 } else {
271 this.$parent.previewImg.index = (this.$parent.previewImg.index + 1) % len
272 }
273 },
274 /**
275 * @description: showCurrent
276 * @param {*} index
277 * @author: renchao
278 */
279 showCurrent (index) {
280 this.previewImg.index = index
281 this.initialIndex = index
282 },
283 /**
284 * @description: closeViewer
285 * @author: renchao
286 */
287 closeViewer () {
288 this.showViewer = false
289 },
290 /**
291 * @description: clickImage
292 * @author: renchao
293 */
294 clickImage () {
295 this.showViewer = true
296 },
297 /**
298 * @description: handleChange
299 * @param {*} file
300 * @param {*} files
301 * @author: renchao
302 */
303 async handleChange (file, fileList) {
304 let length = fileList.length;
305 this.maxFileLength = Math.max(length, this.maxFileLength)
306 var formData = new FormData();
307 setTimeout(() => {
308 if (this.maxFileLength !== length) {
309 return
310 }
311 let num = 0, max = 0;
312 const isLt5M = file.size / 1024 / 1024 < 5;
313 fileList.forEach(item => {
314 if (!isLt5M) {
315 max++
316 }
317 if (!['image/jpeg', 'image/png', 'image/jpg', 'image/gif'].includes(item.raw.type)) {
318 num++
319 } else {
320 formData.append('file', item.raw)
321 }
322 })
323 if (num >= 1) {
324 this.$message.error("请选择jpeg/png/jpg/bmp/gif格式的图片后重试")
325 // 移除不支持的文件类型
326 this.key++
327 return;
328 }
329 if (max >= 1) {
330 this.$message.error('上传图片大小不能超过 5MB!');
331 this.key++
332 return;
333 }
334 this.upDateloading = true
335 formData.append("bsmMaterial", this.previewImg.bsmMaterial);
336 if (this.previewImg.imgList.length > 0) {
337 formData.append("index", this.previewImg.imgList[this.previewImg.index].sxh);
338 }
339 uploadBatch(formData).then((res) => {
340 if (res.code == 200) {
341 this.$emit('updateList', { children: res.result, bsmMaterial: this.previewImg.bsmMaterial })
342 this.$message({
343 message: '上传成功!',
344 type: 'success'
345 })
346 this.upDateloading = false
347 this.$refs.upload.clearFiles();
348 this.maxFileLength = 0
349 }
350 })
351 }, 0)
352 },
353 /**
354 * @description: handleDelete
355 * @author: renchao
356 */
357 handleDelete () {
358 let that = this
359 this.$confirm('此操作将永久删除, 是否继续?', '提示', {
360 confirmButtonText: '确定',
361 cancelButtonText: '取消',
362 type: 'warning'
363 }).then(async () => {
364 let bsmFile = this.previewImg.imgList[this.previewImg.index].bsmFile
365 let bsmMaterial = this.previewImg.imgList[this.previewImg.index].bsmMaterial
366 this.previewImg.imgList = this.previewImg.imgList.filter(item => item.bsmFile != bsmFile)
367 deleteFile(bsmFile).then(res => {
368 if (res.code == 200) {
369 that.$emit('updateList', { children: this.previewImg.imgList, bsmMaterial: bsmMaterial })
370 that.initialIndex = that.previewImg.index
371 that.$message({
372 message: '删除成功!',
373 type: 'success'
374 })
375 }
376 })
377 }).catch(() => {
378 this.$message({
379 type: 'info',
380 message: '已取消删除'
381 })
382 })
383 }
384 }
385 }
386 </script>
387 <style lang="scss" scoped>
388 // 查看大图
389 .rlPopup {
390 position: relative;
391 width: 100%;
392 text-align: center;
393 height: 100%;
394
395 .handle-btn {
396 position: absolute;
397 top: 50%;
398 transform: translateY(-100%);
399 width: 66px;
400 height: 66px;
401 line-height: 75px;
402 color: #fff;
403 background-color: #ccc;
404 border-radius: 50%;
405 cursor: pointer;
406 text-align: center;
407 transition: all 0.3s;
408
409 i {
410 font-size: 24px;
411 }
412 }
413
414 .handle-btn:hover {
415 background-color: rgb(185, 183, 183);
416 }
417
418 .prev {
419 left: 1%;
420 }
421
422 .next {
423 right: 1%;
424 }
425
426 .img-list-wrap {
427 width: 100%;
428 display: flex;
429 justify-content: center;
430 height: calc(100% - 80px);
431 align-items: center;
432 background: rgba(194, 190, 190, 0.1);
433 overflow: scroll;
434
435 img {
436 display: block;
437 object-fit: scale-down;
438 transition: all 0.3s;
439 width: 100%;
440 height: 100%;
441 }
442 }
443
444 .thumb-wrap {
445 &-button {
446 display: flex;
447 justify-content: center;
448
449 .fileUpdate {
450 margin: 0 10px;
451 }
452 }
453
454 li {
455 float: left;
456 width: 60px;
457 height: 45px;
458 border: solid 1px #ececec;
459 position: relative;
460 margin-right: 5px;
461 cursor: pointer;
462
463 &:last-child {
464 margin-right: 0;
465 }
466
467 img {
468 max-width: 57px;
469 max-height: 42px;
470 display: block;
471 object-fit: scale-down;
472 position: absolute;
473 top: 50%;
474 left: 50%;
475 transform: translate(-50%, -50%);
476 }
477 }
478
479 .active {
480 border-color: #409eff;
481 }
482 }
483 }
484 </style>
485 <style>
486 .zoom-on-hover {
487 position: relative;
488 overflow: hidden;
489 }
490
491 .zoom-on-hover .normal {
492 width: 100%;
493 }
494
495 .zoom-on-hover .zoom {
496 position: absolute;
497 opacity: 0;
498 transform-origin: top left;
499 }
500
501 .zoom-on-hover.zoomed .zoom {
502 opacity: 1;
503 }
504
505 .zoom-on-hover.zoomed .normal {
506 opacity: 0;
507 }
508 </style>
1 <!--
2 * @Description:
3 * @Autor: renchao
4 * @LastEditTime: 2023-10-24 17:18:02
5 -->
6 <template>
7 <div class="clxx">
8 <div class="right">
9 <!-- 材料预览 -->
10 <div class="clyl-box">
11 <div class="menu-tree">
12 <el-button
13 type="primary"
14 native-type="submit"
15 @click="viewDetail"
16 style="width: 100%; margin-top: 10px" v-if="tableData.length > 0">申请材料目录</el-button>
17 <div class="item">
18 材料目录({{ tableData.length }})
19 <div style="margin-top: 10px">
20 <div
21 style="
22 text-align: center;
23 line-height: 20px;
24 color: black;
25 font-size: 14px;
26 "
27 v-if="tableData.length == 0">
28 暂无数据
29 </div>
30 <div
31 v-for="(item, index) in tableData"
32 :key="item.bsmMaterial"
33 :class="['child', treeCheckId == item.bsmMaterial ? 'checked' : '']"
34 @click="treeClick(item, index)">
35 {{ item.clmc }}
36 <span class="cl_number" :key="key" v-if="item.count">({{ item.count }})</span>
37 <span class="cl_number" :key="key" v-else>(0)</span>
38 </div>
39 </div>
40 </div>
41 <el-button
42 type="primary"
43 native-type="submit"
44 style="width: 100%"
45 @click="handleAdd()">新增</el-button>
46 </div>
47 <image-preview
48 ref="imageRef"
49 :key="imgKey"
50 v-if="tableData.length > 0"
51 :previewImg="previewImg"
52 @updateList="updateList"
53 @nextPriview="nextPriview"
54 @prevPriview="prevPriview" />
55 </div>
56 </div>
57 <clxxAddDialog v-model="isDialog" />
58 </div>
59 </template>
60 <script>
61 import store from '@/store/index.js'
62 import { ywPopupDialog } from "@/utils/popup.js";
63 import imagePreview from "./dialog/imagePreview.vue";
64 import clxxAddDialog from "./dialog/clxxAddDialog.vue";
65 import clxxDetailDialog from "./dialog/clxxDetailDialog.vue";
66 import { getCompanyMaterialList, addCompanyMaterial, getFileListByBsmMaterial } from "@/api/company.js";
67 export default {
68 components: { clxxAddDialog, imagePreview, clxxDetailDialog },
69 props: {
70 formData: {
71 type: Object,
72 default: () => {
73 return {}
74 }
75 }
76 },
77 data () {
78 return {
79 imgKey: 0,
80 isDialog: false,
81 iclass: "",
82 // 材料目录选中
83 treeCheckIndex: 0,
84 treeCheckId: "",
85 key: 0,
86 tableData: [],
87 previewImg: {
88 bsmMaterial: "",
89 index: 0,
90 selectedIndex: 0,
91 imgList: []
92 }
93 }
94 },
95 computed: {
96 workFresh () {
97 return store.state.user.workFresh
98 }
99 },
100 watch: {
101 workFresh: {
102 handler (newValue, oldValue) {
103 this.clmlInitList(1)
104 },
105 deep: true,
106 immediate: true
107 }
108 },
109 created () {
110 this.clmlInitList(1)
111 },
112 methods: {
113 /**
114 * @description: 自动预览
115 * @author: renchao
116 */
117 nextPriview () {
118 if (this.treeCheckIndex < this.tableData.length) {
119 this.treeCheckIndex++;
120 if (this.tableData[this.treeCheckIndex]) {
121 this.treeCheckId = this.tableData[this.treeCheckIndex].bsmMaterial;
122 // 判断页数
123 let ys = this.tableData[this.treeCheckIndex].ys
124 this.previewImg.index = 0;
125 // 获取材料明细
126 if (ys > 0) {
127 getFileListByBsmMaterial(this.treeCheckId).then(res => {
128 this.previewImg.imgList = res.result ? res.result : []
129 })
130 } else {
131 this.previewImg.imgList = []
132 }
133 this.previewImg.bsmMaterial = this.tableData[this.treeCheckIndex].bsmMaterial;
134 } else {
135 this.$message.error('没有最后一张了');
136 }
137 }
138 },
139 /**
140 * @description: prevPriview
141 * @author: renchao
142 */
143 prevPriview () {
144 if (this.treeCheckIndex >= 1) {
145 this.treeCheckIndex--;
146 this.treeCheckId = this.tableData[this.treeCheckIndex].bsmMaterial;
147 // 判断页数
148 let ys = this.tableData[this.treeCheckIndex].ys
149 if (ys > 0) {
150 getFileListByBsmMaterial(this.treeCheckId).then(res => {
151 this.previewImg.imgList = res.result ? res.result : []
152 this.previewImg.index = this.previewImg.imgList.length - 1;
153 })
154 } else {
155 this.previewImg.imgList = [];
156 this.previewImg.index = 0
157 }
158 this.previewImg.bsmMaterial = this.tableData[this.treeCheckIndex].bsmMaterial;
159 } else {
160 this.$message.error('没有第一张了');
161 }
162 },
163 /**
164 * @description: 材料目录明细初始化
165 * @param {*} type
166 * @author: renchao
167 */
168 clmlInitList (type) {
169 // 1：列表初始化 2：新增材料
170 return new Promise((resolve) => {
171 getCompanyMaterialList(this.formData.bsmCompany).then((res) => {
172 if (res.code == 200) {
173 resolve(res.code);
174 if (res.result && res.result.length > 0) {
175 this.tableData = res.result;
176 if (type == 1) {
177 this.treeClick(this.tableData[0], 0);
178 } else if (type == 2) {
179 //新增材料后刷新列表焦点置于新增的对象上
180 this.treeClick(
181 this.tableData[this.tableData.length - 1],
182 this.tableData.length - 1
183 );
184 }
185 }
186 } else {
187 this.$message.error(res.message);
188 }
189 })
190 })
191 },
192 /**
193 * @description: setChecked
194 * @param {*} item
195 * @author: renchao
196 */
197 setChecked (item) {
198 this.treeCheckId = item.bsmMaterial;
199 this.title = item.sjmc;
200 this.titleYs = 1;
201 this.titleNum = item.children.length;
202 this.previewImg.imgList = item.children;
203 this.previewImg.bsmMaterial = item.bsmMaterial;
204 },
205 /**
206 * @description: updateList
207 * @param {*} val
208 * @author: renchao
209 */
210 updateList (val) {
211 let that = this;
212 if (val.children.length != 0) {
213 //删除最后一张图片时 val=null
214 this.tableData.forEach((item) => {
215 if (item.bsmMaterial == val.bsmMaterial) {
216 item.count = val.children.length
217 }
218 });
219 this.previewImg.imgList = _.cloneDeep(val.children);
220 if (this.previewImg.index == this.previewImg.imgList.length) {
221 this.previewImg.index = this.previewImg.index - 1;
222 }
223 this.key++
224 } else {
225 this.previewImg.imgList = [];
226 this.tableData.forEach((item, index) => {
227 if (this.treeCheckId == item.bsmMaterial) {
228 item.count = 0;
229 that.treeCheckIndex = index;
230 }
231 })
232 }
233 },
234 /**
235 * @description: 添加材料目录
236 * @author: renchao
237 */
238 handleAdd () {
239 this.isDialog = true;
240 },
241 /**
242 * @description: 新增弹窗保存
243 * @param {*} data
244 * @author: renchao
245 */
246 addSave (data) {
247 let obj = {
248 bsmCompany: this.formData.bsmCompany,
249 clmc: data.clmc,
250 cllx: data.cllx
251 };
252 addCompanyMaterial(obj).then(async (res) => {
253 if (res.code == 200) {
254 let res = await this.clmlInitList(2);
255 if (res == 200)
256 this.$message({
257 message: "新增成功",
258 type: "success"
259 })
260 }
261 })
262 },
263 /**
264 * @description: 材料目录点击选中
265 * @param {*} item
266 * @param {*} index
267 * @author: renchao
268 */
269 treeClick (item, index) {
270 this.previewImg.index = 0;
271 this.treeCheckId = item?.bsmMaterial;
272 this.treeCheckIndex = index;
273 getFileListByBsmMaterial(item.bsmMaterial).then(res => {
274 this.previewImg.imgList = res.result ? res.result : []
275 })
276 this.previewImg.bsmMaterial = item?.bsmMaterial;
277 if (this.$refs.imageRef) {
278 this.$refs.imageRef.initialIndex = 0
279 }
280 this.imgKey++
281 },
282 /**
283 * @description: 小图片点击
284 * @param {*} item
285 * @param {*} index
286 * @author: renchao
287 */
288 imgClick (item, index) {
289 this.showImg = item;
290 this.titleYs = index + 1;
291 },
292 //查看明细
293 async viewDetail () {
294 await this.clmlInitList();
295 store.dispatch("user/reWorkFresh", false);
296 ywPopupDialog("申请材料目录", "xxba/components/clxx/dialog/clxxDetailDialog", {
297 data: this.tableData,
298 bsmCompany: this.formData.bsmCompany
299 }, "60%", true, false)
300 },
301 //设置tableData
302 setTableData (tableData) {
303 this.$nextTick((res) => {
304 this.tableData = tableData;
305 })
306 }
307 }
308 }
309 </script>
310 <style scoped lang="scss">
311 @import "~@/styles/mixin.scss";
312 .active {
313 background: $light-blue !important;
314 color: #fff;
315 }
316
317 .required {
318 font-size: 12px;
319 color: $pink;
320 float: left;
321 }
322
323 .cl_number {
324 float: right;
325 }
326
327 .clxx {
328 width: 100%;
329 height: 94%;
330 display: flex;
331 padding-left: 5px;
332 .left {
333 display: flex;
334 flex-direction: column;
335 justify-content: space-between;
336
337 .item {
338 width: 28px;
339 height: 49%;
340 @include flex-center;
341 background-color: #e4e7ed;
342 border-bottom-right-radius: 10px;
343 padding: 5px;
344 cursor: pointer;
345 transition: all 0.3s;
346
347 &:hover {
348 @extend .active;
349 }
350 }
351 }
352
353 .right {
354 width: 100%;
355 height: 100%;
356
357 .clmlmx-box {
358 margin: 0 auto;
359
360 .title {
361 text-align: center;
362 height: 60px;
363 line-height: 60px;
364 border: 1px solid #dfe6ec;
365 font-size: 20px;
366 background: #81d3f81a;
367 margin-bottom: -1px;
368 }
369 }
370
371 .clyl-box {
372 width: 100%;
373 height: 100%;
374 display: flex;
375
376 .menu-tree {
377 width: 20%;
378 min-width: 160px;
379 height: 100%;
380 margin-right: 10px;
381 border-right: 1px dotted #d9d9d9;
382 padding: 0 15px;
383
384 .item {
385 line-height: 30px;
386 padding-top: 5px;
387 border-bottom: 1px solid #e8e8e8;
388 font-size: 16px;
389 text-align: center;
390 color: $light-blue;
391
392 .itemIcon {
393 float: right;
394 line-height: 60px;
395 cursor: pointer;
396 }
397
398 .child {
399 line-height: 32px;
400 border-bottom: 1px solid #e8e8e8;
401 padding-left: 10px;
402 color: #6b6b6b;
403 cursor: pointer;
404 box-sizing: border-box;
405 border-radius: 6px;
406 line-height: 20px;
407 transition: all 0.3s;
408 padding: 8px 0;
409 }
410
411 .child:hover {
412 color: $light-blue;
413 transform: scale(1.1);
414 }
415
416 .checked {
417 border: 1px solid $light-blue;
418 color: $light-blue;
419 }
420 }
421 }
422
423 .clyl-img {
424 width: 75%;
425 height: 100%;
426 background: #f3f4f7;
427 margin: 0 auto;
428 position: relative;
429 }
430 }
431 }
432 }
433 </style>
1 <!-- 1 <!--
2 * @Description: 2 * @Description:
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-11-10 13:43:21 4 * @LastEditTime: 2024-01-17 09:03:56
5 --> 5 -->
6 <template> 6 <template>
7 <div class="from-clues"> 7 <div class="from-clues">
...@@ -54,13 +54,14 @@ ...@@ -54,13 +54,14 @@
54 this.queryClick() 54 this.queryClick()
55 }, 55 },
56 computed: { 56 computed: {
57 ...mapGetters(['workFresh']) 57 ...mapGetters(['isRefresh'])
58 }, 58 },
59 watch: { 59 watch: {
60 workFresh: { 60 isRefresh: {
61 handler (newVal, oldVal) { 61 handler (newVal, oldVal) {
62 if (newVal) this.queryClick() 62 if (newVal) this.queryClick()
63 } 63 },
64 immediate: true
64 } 65 }
65 }, 66 },
66 data () { 67 data () {
...@@ -105,7 +106,7 @@ ...@@ -105,7 +106,7 @@
105 * @author: renchao 106 * @author: renchao
106 */ 107 */
107 handleAdd () { 108 handleAdd () {
108 this.$popupDialog("添加银行", "xxba/components/addDialog", { isAdd: 1 }, "75%") 109 this.$popupDialog("添加银行", "xxba/yhjgba/components/addDialog", { isAdd: 1, QyYh: 2 }, "75%")
109 }, 110 },
110 /** 111 /**
111 * @description: handleDelete 112 * @description: handleDelete
......
1 <!-- 1 <!--
2 * @Description: 2 * @Description:
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-10-24 15:00:35 4 * @LastEditTime: 2024-01-17 08:43:05
5 --> 5 -->
6 <template> 6 <template>
7 <div class="from-clues"> 7 <div class="from-clues">
...@@ -183,6 +183,17 @@ ...@@ -183,6 +183,17 @@
183 } 183 }
184 }, 184 },
185 methods: { 185 methods: {
186 resetForm () {
187 this.queryzrzForm = {
188 zddm: '',
189 bdcqzh: '',
190 zl: '',
191 zrzh: '',
192 xmmc: '',
193 jzwmc: ''
194 }
195 this.queryClick()
196 },
186 /** 197 /**
187 * @description: queryClick 198 * @description: queryClick
188 * @author: renchao 199 * @author: renchao
......