Merge branch 'master-500-dev-lushangqing' into 'master-500-dev'
忙时配置功能迁移 #1 See merge request !665
Showing
5 changed files
with
380 additions
and
0 deletions
@@ -143,6 +143,12 @@ const routes = [{ | @@ -143,6 +143,12 @@ const routes = [{ | ||
143 | name: 'logoConfig', | 143 | name: 'logoConfig', |
144 | component: () => myImport('views/logoConfig/index') | 144 | component: () => myImport('views/logoConfig/index') |
145 | }, | 145 | }, |
146 | + //忙时配置 | ||
147 | + { | ||
148 | + path: '/vue3/busyConfig', | ||
149 | + name: 'busyConfig', | ||
150 | + component: () => myImport('views/busyConfig/index') | ||
151 | + }, | ||
146 | ]; | 152 | ]; |
147 | 153 | ||
148 | // hash模式: createWebHashHistory | 154 | // hash模式: createWebHashHistory |
1 | +<div class="container" :style="{'height':height+'px','max-height':height+'px'}"> | ||
2 | + <div class="cm-card" :style="{'min-height':height+'px','max-height':height+'px','height':'100%'}"> | ||
3 | + <div class="search" style="margin:6px 0;"> | ||
4 | + <div class="condition"> | ||
5 | + <el-input :size="$global.elementConfig.size.input" style="width:180px;" v-model="search.keyWords" placeholder="请输入关键字"></el-input> | ||
6 | + <el-button :size="$global.elementConfig.size.button" type="primary" style="margin-left: 6px;" @click="getDataList">查询</el-button> | ||
7 | + <el-button :size="$global.elementConfig.size.button" type="primary" @click="addConfig">新增</el-button> | ||
8 | + <el-button :size="$global.elementConfig.size.button" type="primary" @click="delConfig">删除</el-button> | ||
9 | + </div> | ||
10 | + | ||
11 | + </div> | ||
12 | + | ||
13 | + <div class="search-table"> | ||
14 | + <cm-table-page :columns="tableData.columns" :dataList="tableData.dataList" | ||
15 | + :showIndex="true" | ||
16 | + :total="tableData.count" | ||
17 | + @loaddata = "loaddata" | ||
18 | + :showSelection="true" | ||
19 | + @selectionChange="selectionChange" | ||
20 | + :showBorder="true" | ||
21 | + :loading="false" | ||
22 | + :pageSize="pageSize" | ||
23 | + :showPage="true" | ||
24 | + :showTools="true" | ||
25 | + :height="height - 110"> | ||
26 | + <template #default="{row,prop,column}"> | ||
27 | + <div> | ||
28 | + <el-tag style="margin:5px;" v-if="prop=='years'" v-for="(item,index) in row.years">{{item}}</el-tag> | ||
29 | + <el-tag style="margin:5px;" v-if="prop=='months'" type="success" v-for="(item,index) in row.months">{{item}}</el-tag> | ||
30 | + <el-tag style="margin:5px;" v-if="prop=='days'" type="info" v-for="(item,index) in row.days">{{item}}</el-tag> | ||
31 | + <el-tag style="margin:5px;" v-if="prop=='hours'" type="warning" v-for="(item,index) in row.hours">{{item}}</el-tag> | ||
32 | + </div> | ||
33 | + </template> | ||
34 | + <template #tools="{scope}"> | ||
35 | + <div class="list-handle"> | ||
36 | + <i class="el-icon-delete" title="删除" style="cursor: pointer;" @click="handleDelete(scope.row)"></i> | ||
37 | + <i style="margin-left:6px;cursor: pointer;" class="el-icon-edit" title="修改" @click="handleEdit(scope.row)"></i> | ||
38 | + </div> | ||
39 | + </template> | ||
40 | + </cm-table-page> | ||
41 | + </div> | ||
42 | + </div> | ||
43 | +</div> | ||
44 | + | ||
45 | +<!--弹框--> | ||
46 | +<cm-dialog :title="dialog.title" width="60%" :showDialogVisible="dialog.show" @okfunc="saveConfig" @hidedialog="hideDialog" :showFooter="true"> | ||
47 | + <template v-slot> | ||
48 | + <div class="add-container" style="height:500px;padding:0 10px;"> | ||
49 | + <el-row> | ||
50 | + <el-col :span="24" style="display: flex;align-items: center; | ||
51 | + border-bottom:1px solid #1e9fff;padding:10px;margin-bottom: 10px;"> | ||
52 | + <span style="margin-right: 10px;display: flex;align-items: center;"><i style="display:inline-block;padding:5px;"></i>年:</span> | ||
53 | + <el-checkbox-group style="display: flex;flex-wrap: wrap;" v-model="yearCheckList"> | ||
54 | + <el-checkbox v-for="(item,index) in yearData" :label="item+''" >{{item}}年</el-checkbox> | ||
55 | + </el-checkbox-group> | ||
56 | + </el-col> | ||
57 | + </el-row> | ||
58 | + <el-row> | ||
59 | + <el-col :span="24" style="display: flex;align-items: center; | ||
60 | + border-bottom:1px solid #1e9fff;padding:10px;margin-bottom: 10px;"> | ||
61 | + <span style="margin-right: 10px;display: flex;align-items: center;"><i style="display:inline-block;padding:5px;"></i>月:</span> | ||
62 | + <el-checkbox-group style="display: flex;flex-wrap: wrap;" v-model="monthCheckList"> | ||
63 | + <el-checkbox v-for="(item,index) in 12" :label="item+''" >{{item}}月</el-checkbox> | ||
64 | + </el-checkbox-group> | ||
65 | + </el-col> | ||
66 | + </el-row> | ||
67 | + <el-row> | ||
68 | + <el-col :span="24" style="display: flex;align-items: center; | ||
69 | + border-bottom:1px solid #1e9fff;padding:10px;margin-bottom: 10px;"> | ||
70 | + <span style="margin-right: 10px;display: flex;align-items: center;"><i style="display:inline-block;padding:5px;"></i>日:</span> | ||
71 | + <el-checkbox-group style="display: flex;flex-wrap: wrap;" v-model="dayCheckList"> | ||
72 | + <el-checkbox v-for="(item,index) in 31" :label="item+''" >{{item}}日</el-checkbox> | ||
73 | + </el-checkbox-group> | ||
74 | + </el-col> | ||
75 | + </el-row> | ||
76 | + <el-row> | ||
77 | + <el-col :span="24" style="display: flex;align-items: center; | ||
78 | + border-bottom:1px solid #1e9fff;padding:10px;margin-bottom: 10px;"> | ||
79 | + <span style="margin-right: 10px;display: flex;align-items: center;"><i style="color:#ff0000;padding:5px;">*</i>时:</span> | ||
80 | + <el-checkbox-group style="display: flex;flex-wrap: wrap;" v-model="hourCheckList"> | ||
81 | + <el-checkbox v-for="(item,index) in 24" :label="item+''" >{{item}}时</el-checkbox> | ||
82 | + </el-checkbox-group> | ||
83 | + </el-col> | ||
84 | + </el-row> | ||
85 | + </div> | ||
86 | + | ||
87 | + </template> | ||
88 | +</cm-dialog> | ||
89 | + |
1 | +export default { | ||
2 | + name: 'busyConfig', | ||
3 | + template: '', | ||
4 | + components: { | ||
5 | + }, | ||
6 | + props: [], | ||
7 | + setup(props, {attrs, slots, emit}) { | ||
8 | + const {proxy} = Vue.getCurrentInstance(); | ||
9 | + let height = Vue.ref(window.innerHeight); | ||
10 | + let yearCheckList=Vue.ref([]);//年选择数据 | ||
11 | + let monthCheckList=Vue.ref([]);//月选择数据 | ||
12 | + let dayCheckList=Vue.ref([]);//日选择数据 | ||
13 | + let hourCheckList=Vue.ref([]);//时选择数据 | ||
14 | + let dialog=Vue.ref({ | ||
15 | + title:'忙时配置', | ||
16 | + show:false, | ||
17 | + id:'' | ||
18 | + }); | ||
19 | + let search = Vue.ref({ | ||
20 | + status: 0, | ||
21 | + keyWords: '', | ||
22 | + page: 1, | ||
23 | + limit: 50, | ||
24 | + }); | ||
25 | + | ||
26 | + //表格字段 | ||
27 | + let tableData = Vue.ref({ | ||
28 | + count:0, | ||
29 | + dataList: [], | ||
30 | + columns: [ | ||
31 | + { | ||
32 | + prop: 'years', | ||
33 | + label: '年', | ||
34 | + sortable: true, | ||
35 | + align: 'center', | ||
36 | + width: '200', | ||
37 | + }, | ||
38 | + { | ||
39 | + prop: 'months', | ||
40 | + label: '月', | ||
41 | + sortable: true, | ||
42 | + align: '200', | ||
43 | + }, | ||
44 | + { | ||
45 | + prop: 'days', | ||
46 | + label: '日', | ||
47 | + sortable: true, | ||
48 | + align: 'center', | ||
49 | + }, { | ||
50 | + prop: 'hours', | ||
51 | + label: '时', | ||
52 | + sortable: true, | ||
53 | + align: 'center', | ||
54 | + width: '200' | ||
55 | + } | ||
56 | + ] | ||
57 | + }) | ||
58 | + // 表格全选事件 | ||
59 | + let checkData=Vue.ref([]); | ||
60 | + let selectionChange = (val) => { | ||
61 | + let checkArr = []; | ||
62 | + val.map(item => { | ||
63 | + checkArr.push(item.id) | ||
64 | + }) | ||
65 | + checkData.value = checkArr; | ||
66 | + | ||
67 | + } | ||
68 | + // 获取列表 | ||
69 | + let getDataList = () => { | ||
70 | + proxy.$http.get(`/api-analysis/busyAnalysis/getList?keyWords=`+search.value.keyWords, { | ||
71 | + page: search.value.page, | ||
72 | + limit: search.value.limit, | ||
73 | + }, function (res) { | ||
74 | + if (res && res.data) { | ||
75 | + tableData.value.dataList = res.data; | ||
76 | + tableData.value.count = res.count; | ||
77 | + tableData.value.dataList.map(item=>{ | ||
78 | + if(item.year){ | ||
79 | + item.years=item.year.split(","); | ||
80 | + } | ||
81 | + if(item.month){ | ||
82 | + item.months=item.month.split(","); | ||
83 | + } | ||
84 | + if(item.day){ | ||
85 | + item.days=item.day.split(","); | ||
86 | + } | ||
87 | + if(item.hour){ | ||
88 | + item.hours=item.hour.split(","); | ||
89 | + } | ||
90 | + | ||
91 | + }) | ||
92 | + } else { | ||
93 | + tableData.value.dataList = []; | ||
94 | + tableData.value.count = 0; | ||
95 | + } | ||
96 | + }); | ||
97 | + | ||
98 | + } | ||
99 | + | ||
100 | + let loaddata = ({page, limit}) => { | ||
101 | + search.value.page = page; | ||
102 | + search.value.limit = limit; | ||
103 | + } | ||
104 | + | ||
105 | + let hideDialog = (flg) => { | ||
106 | + dialog.value.show = flg; | ||
107 | + if(!flg){ | ||
108 | + dialog.value.id=''; | ||
109 | + yearCheckList.value=[]; | ||
110 | + monthCheckList.value=[]; | ||
111 | + dayCheckList.value=[]; | ||
112 | + hourCheckList.value=[]; | ||
113 | + } | ||
114 | + } | ||
115 | + | ||
116 | + // 处理弹框 | ||
117 | + let handle = (row) =>{ | ||
118 | + dialog.value.id = row.id; | ||
119 | + yearCheckList.value=row.years?row.years:[]; | ||
120 | + monthCheckList.value=row.months?row.months:[]; | ||
121 | + dayCheckList.value=row.days?row.days:[]; | ||
122 | + hourCheckList.value=row.hours?row.hours:[]; | ||
123 | + console.log("////",yearCheckList.value,monthCheckList.value,dayCheckList.value,hourCheckList.value) | ||
124 | + hideDialog(true); | ||
125 | + } | ||
126 | + | ||
127 | + //修改详情 | ||
128 | + let handleEdit = (row) =>{ | ||
129 | + handle(row); | ||
130 | + } | ||
131 | + //删除数据 | ||
132 | + let handleDelete=(row)=>{ | ||
133 | + deletData(row); | ||
134 | + } | ||
135 | + //获取当前年的前后三年 | ||
136 | + let yearData=Vue.ref([]) | ||
137 | + let getYearData=()=>{ | ||
138 | + let date=new Date(); | ||
139 | + let arr=[]; | ||
140 | + for(let i=0;i<=3;i++){ | ||
141 | + arr.push(date.getFullYear()-i); | ||
142 | + if(i!=0){ | ||
143 | + arr.push(date.getFullYear()+i) | ||
144 | + } | ||
145 | + } | ||
146 | + arr.sort((a, b) => { | ||
147 | + return a - b | ||
148 | + }); | ||
149 | + yearData.value=arr; | ||
150 | + } | ||
151 | + //新增配置 | ||
152 | + let addConfig=()=>{ | ||
153 | + hideDialog(true); | ||
154 | + } | ||
155 | + //批量删除配置 | ||
156 | + let delConfig=()=>{ | ||
157 | + if(checkData.value.length<1){ | ||
158 | + proxy.$global.showMsg('请至少选择一项','warning'); | ||
159 | + return; | ||
160 | + } | ||
161 | + deletData(); | ||
162 | + } | ||
163 | + //删除操作 | ||
164 | + let deletData=(row)=>{ | ||
165 | + let idList=''; | ||
166 | + if(row){ | ||
167 | + idList=row.id; | ||
168 | + }else{ | ||
169 | + if(checkData.value.length>0){ | ||
170 | + idList=checkData.value.join(',') | ||
171 | + } | ||
172 | + } | ||
173 | + | ||
174 | + proxy.$global.confirm("确认删除数据吗?", function () { | ||
175 | + proxy.$http.get(`/api-analysis/busyAnalysis/remove`, { | ||
176 | + idList: idList | ||
177 | + }, function (res) { | ||
178 | + if(res && res.success){ | ||
179 | + proxy.$global.showMsg('删除成功'); | ||
180 | + }else{ | ||
181 | + proxy.$global.showMsg('删除失败','error'); | ||
182 | + } | ||
183 | + getDataList(); | ||
184 | + }) | ||
185 | + }) | ||
186 | + } | ||
187 | + //保存配置 | ||
188 | + let saveConfig=()=>{ | ||
189 | + if(hourCheckList.value.length<1){ | ||
190 | + proxy.$global.showMsg('请至少选择一个时间','warning'); | ||
191 | + return; | ||
192 | + } | ||
193 | + let year=''; | ||
194 | + if(yearCheckList.value.length>0){ | ||
195 | + year=yearCheckList.value.join(","); | ||
196 | + } | ||
197 | + let month=''; | ||
198 | + if(monthCheckList.value.length>0){ | ||
199 | + month=monthCheckList.value.join(","); | ||
200 | + } | ||
201 | + let day=''; | ||
202 | + if(dayCheckList.value.length>0){ | ||
203 | + day=dayCheckList.value.join(","); | ||
204 | + } | ||
205 | + let hour=''; | ||
206 | + if(hourCheckList.value.length>0){ | ||
207 | + hour=hourCheckList.value.join(","); | ||
208 | + } | ||
209 | + if(dialog.value.id){ | ||
210 | + proxy.$http.post(`/api-analysis/busyAnalysis/update`, { | ||
211 | + year: year, | ||
212 | + month: month, | ||
213 | + day: day, | ||
214 | + hour: hour, | ||
215 | + id:dialog.value.id | ||
216 | + }, function (res) { | ||
217 | + if(res && res.success){ | ||
218 | + proxy.$global.showMsg('修改成功'); | ||
219 | + }else{ | ||
220 | + proxy.$global.showMsg('修改失败','error'); | ||
221 | + } | ||
222 | + hideDialog(false); | ||
223 | + getDataList(); | ||
224 | + }) | ||
225 | + }else{ | ||
226 | + proxy.$http.post(`/api-analysis/busyAnalysis/add`, { | ||
227 | + year: year, | ||
228 | + month: month, | ||
229 | + day: day, | ||
230 | + hour: hour | ||
231 | + }, function (res) { | ||
232 | + if(res && res.success){ | ||
233 | + proxy.$global.showMsg('保存成功'); | ||
234 | + }else{ | ||
235 | + proxy.$global.showMsg('保存失败','error'); | ||
236 | + } | ||
237 | + hideDialog(false); | ||
238 | + getDataList(); | ||
239 | + }) | ||
240 | + } | ||
241 | + | ||
242 | + | ||
243 | + | ||
244 | + } | ||
245 | + // 挂载完 | ||
246 | + Vue.onMounted(() => { | ||
247 | + getYearData(); | ||
248 | + getDataList(); | ||
249 | + }) | ||
250 | + | ||
251 | + | ||
252 | + return { | ||
253 | + saveConfig, | ||
254 | + delConfig, | ||
255 | + addConfig, | ||
256 | + selectionChange, | ||
257 | + handleDelete, | ||
258 | + checkData, | ||
259 | + yearData, | ||
260 | + dialog, | ||
261 | + getYearData, | ||
262 | + height, | ||
263 | + search, | ||
264 | + hideDialog, | ||
265 | + handle, | ||
266 | + loaddata, | ||
267 | + tableData, | ||
268 | + getDataList, | ||
269 | + handleEdit, | ||
270 | + yearCheckList, | ||
271 | + monthCheckList, | ||
272 | + dayCheckList, | ||
273 | + hourCheckList | ||
274 | + } | ||
275 | + } | ||
276 | + | ||
277 | +} |
@@ -238,6 +238,12 @@ const routes = [{ | @@ -238,6 +238,12 @@ const routes = [{ | ||
238 | name: 'logoConfig', | 238 | name: 'logoConfig', |
239 | component: () => myImport('views/logoConfig/index') | 239 | component: () => myImport('views/logoConfig/index') |
240 | }, | 240 | }, |
241 | + //忙时配置 | ||
242 | + { | ||
243 | + path: '/vue3/busyConfig', | ||
244 | + name: 'busyConfig', | ||
245 | + component: () => myImport('views/busyConfig/index') | ||
246 | + }, | ||
241 | ]; | 247 | ]; |
242 | 248 | ||
243 | // hash模式: createWebHashHistory | 249 | // hash模式: createWebHashHistory |
-
Please register or login to post a comment