system-clients 3.2.22 → 3.2.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,715 +1,715 @@
1
- <template>
2
- <div @click="hindsetting1()" :class="{'with-watermark':showwatermakeflag}">
3
- <span class="newTip" transition="newTip" @click="tipClick" v-if="newTipShow">
4
- <span>您有一条新提醒</span>
5
- </span>
6
- <div class='flex-row system-main' id="box" v-el:box v-if="!isManger">
7
- <div class="auto login-operator1" style="padding-top: 0 !important;">
8
- <!-- <span>-->
9
- <!-- <img-->
10
- <!-- src="../../assets/people.png" height="15" width="15">-->
11
- <!-- 登录人:</span>-->
12
- <!-- <label>{{ orgpathnames }}</label>-->
13
- </div>
14
- <div class="system-left tree-flex" :class="{'tree-flex-icon': !treeOrIcon}" id="top" v-el:top>
15
- <div class="system-left-chi" :class="{'system-left-icon': !treeOrIcon}">
16
- <div class="span system-left-tree " style="height:85%">
17
- <!-- <h3>{{ systemname }}</h3>-->
18
- <!-- <div class="span" style="margin-bottom:10px;padding-bottom:5px;padding-top:5px;flex: 1;border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;">-->
19
- <left-tree :functions='functions.functions' :userid='userid' @isnodo="isnodo" v-show="treeOrIcon"
20
- :tabs="tabs" v-ref:tree></left-tree>
21
- <!--&lt;!&ndash; <icon-tree :functions='functions.functions' :userid='userid' v-show="!treeOrIcon"></icon-tree>&ndash;&gt;-->
22
- </div>
23
-
24
- <div class="tree-flex-footer">
25
- <!-- <a @click="changeShow()"><img :src="imgs.open" alt=""><span v-if="treeOrIcon">菜单伸缩</span></a>-->
26
- <!-- <a><img src="../../../static/treeset.png" alt="">系统设置</a> -->
27
- <dropdown class="auto">
28
- <button type="button" data-toggle="dropdown">
29
- <img :src="imgs.set" alt=""><span v-if="treeOrIcon">系统设置</span>
30
- </button>
31
- <ul slot="dropdown-menu" class="dropdown-menu dropdown-menu-up">
32
- <li>系统信息及设置</li>
33
- <!-- <li>{{name}}</li> -->
34
- <li>{{ date }}</li>
35
- <li @click="openUrl()">售后服务</li>
36
- <li @click="show=true">修改密码</li>
37
- <li @click="AddChangeMsgShow=true">系统版本:V3.0</li>
38
- </ul>
39
-
40
- </dropdown>
41
- <a href="index.html" @click.prevent="logOut">
42
- <img :src="imgs.out" alt=""><span v-if="treeOrIcon">退出系统</span>
43
- </a>
44
- </div>
45
- </div>
46
- </div>
47
- <!-- <div class="line" id="line" v-show="treeOrIcon" v-el:line></div> -->
48
-
49
- <div class="flex right-bg system-right" id="bottom" v-el:bottom>
50
- <!-- <operator-badge></operator-badge> -->
51
- <div class="span">
52
- <echarts-box v-if="$refs.mic.tabs.length === 0"></echarts-box>
53
- <dynamic :comps='[]' name='main' :selecttab.sync="selecttab" :orgpathnames="orgpathnames" :closekeep="true" :closeall="true"
54
- @tab-changed="tabChange" @tabscg="tabcg" v-ref:mic v-show="!($refs.mic.tabs.length === 0)"></dynamic>
55
- </div>
56
- </div>
57
- </div>
58
- <div v-show="isManger">
59
- <route v-ref:route></route>
60
- </div>
61
- <modal v-if="newTipContextShow" :show.sync="newTipContextShow" :backdrop="false">
62
- <header slot="modal-header" style="display:none"> </header>
63
- <article slot="modal-body" class="modal-body">
64
- <form class="form-horizontal">
65
- <div class="row">
66
- <div class="col-sm-12 " v-if="AppDaiBan !==''">
67
- <label class="col-sm-2">报装待办:</label>
68
- <span style="font-weight:normal">{{AppDaiBan}}</span>
69
- </div>
70
- <div class="col-sm-12 " v-if="OrderDaiBan !==''">
71
- <label class="col-sm-2">预约待办:</label>
72
- <span style="font-weight:normal">{{OrderDaiBan}}</span>
73
- </div>
74
- </div>
75
- </form>
76
- </article>
77
- <footer slot="modal-footer" style="height: 8vh" class="modal-footer">
78
- <button class="button_search" @click="newTipContextShow = false">确认</button>
79
- </footer>
80
- </modal>
81
-
82
- <!-- 变更录入 模态框 -->
83
- <add-changemsg :show="AddChangeMsgShow" v-on:toggle="AddChangeMsgShow = false"></add-changemsg>
84
- <!-- 修改密码组件 -->
85
- <modify-pw :show.sync="show" v-if="show"></modify-pw>
86
- <!-- 修改密码模态框 -->
87
- </div>
88
- </template>
89
-
90
- <script>
91
- import vue from 'vue'
92
- import co from 'co'
93
- import {HttpResetClass} from "vue-client";
94
-
95
- let getwartermakr = async function (self) {
96
- let param = {
97
- tablename: 't_singlevalue',
98
- condition: " 1=1 and name=\'水印内容\'"
99
- };
100
- let result = await self.$resetpost('rs/sql/saleSingleTable', {data: param}, {resolveMsg: null, rejectMsg: null});
101
- if (result && result.data.length > 0) {
102
- self.showwatermakeflag = true;
103
- createWaterMark(result.data[0].value);
104
- } else {
105
- self.showwatermakeflag = false;
106
- }
107
- }
108
-
109
- let createWaterMark = function (userName) {
110
- let style;
111
- if (style) style.remove();
112
- let width = window.parseInt(document.body.clientWidth);
113
- let canvasWidth = width / window.parseInt(width / 320);
114
- let fontFamily = window.getComputedStyle(document.body)["font-family"];
115
- let canvas = document.createElement("canvas");
116
- canvas.width = canvasWidth;
117
- canvas.height = 200;
118
- let ctx = canvas.getContext("2d");
119
- ctx.rotate((-20 * Math.PI) / 180);
120
- ctx.font = `20px ${fontFamily}`;
121
- ctx.fillStyle = "rgba(8,8,8,.1)";
122
- ctx.fillText(userName, 50, 200);
123
- let imgSrc = canvas.toDataURL("image/png");
124
- style = document.createElement("style");
125
- style.innerHTML = `.with-watermark:before{
126
- content: "";
127
- width: 100%;
128
- height: 100%;
129
- display: block;
130
- position: absolute;
131
- background-image: url("${imgSrc}");
132
- }`;
133
- (document.head.append || document.head.appendChild).apply(document.head, [style]);
134
- }
135
-
136
- window.onunload = () => {
137
- vue.http({url: `rs/user/update/${this.$login.f.ename}`, method: 'GET'})
138
- }
139
- window.onbeforeunload = () => {
140
- vue.http({url: `rs/user/update/${this.$login.f.ename}`, method: 'GET'})
141
- }
142
- export default {
143
- title: '主界面',
144
- props: ['functions', 'userid', 'config'],
145
- data() {
146
- return {
147
- // 页面提示信息定时器
148
- interval: null,
149
- newTipShow: false,
150
- newTipContextShow: false,
151
- AppDaiBan: '',
152
- OrderDaiBan: '',
153
- // 左侧树下部三个小图标
154
- imgs: {
155
- open: '/images/lefticon/菜单伸缩.png',
156
- set: '/images/lefticon/系统设置.png',
157
- out: '/images/lefticon/退出系统.png',
158
- img1: '/images/newStyle/login-user.png',
159
- logoimg: '/static/newStyle/fife.png'
160
- // img2: '/images/lefticon/退出系统.png',
161
- },
162
- treeOrIcon: false,
163
- isManger: false,
164
- show: false,
165
- orgpathnames: `${this.$login.f.orgs}-${this.$login.f.deps}-${this.$login.f.name}`,
166
- systemname: '客服系统',
167
- date: this.$login.toStandardDateString(),
168
- tabs: [], //已初始化页签数组
169
- selecttab: '',
170
- setting: true,
171
- srcsetting: '../../static/newStyle/setting.png',
172
- showwatermakeflag: false,
173
- // headerHint: true, // 右侧顶部提示信息
174
- // value: 25645.26,
175
- // AddChangeMsgShow: false,
176
- // showsum: false
177
- }
178
- },
179
- ready() {
180
- getwartermakr(this);
181
- let component = this.$login.getUrlCompileParames('component')
182
- if (component) {
183
- this.isManger = true
184
- this.$refs.route.init(component, {data: this.functions.functions})
185
- }
186
- if (this.$login.f.password == '1') {
187
- this.$showMessage('本地登录系统为此账户的初始密码,请确认修改密码!!!', ['confirm', 'cancel']).then((res) => {
188
- if (res == 'confirm')
189
- this.show = true
190
- })
191
- }
192
- console.log("系统名称", this.$appdata.getSingleValue("系统名称"))
193
- this.systemname = this.$appdata.getSingleValue("系统名称") ? this.$appdata.getSingleValue("系统名称") : '客服系统'
194
- // let oBox = this.getElement("box")
195
- // let oTop = this.getElement("top")
196
- // let oBottom = this.getElement("bottom")
197
- // let oLine = this.getElement("line")
198
- // let that = this
199
- // oLine.onmousedown = function(e) {
200
- // let disX = (e || event).clientX
201
- // oLine.left = oLine.offsetLeft
202
- // document.onmousemove = function(e) {
203
- // let iT = oLine.left + ((e || event).clientX - disX)
204
- // var e = e || window.event
205
- // let tarnameb = e.target || e.srcElement
206
- // let maxT = oBox.clientWight - oLine.offsetWidth
207
- // oLine.style.margin = 0
208
- // iT < 0 && (iT = 0)
209
- // iT > maxT && (iT = maxT)
210
- // oLine.style.left = oTop.style.width = iT + "px"
211
- // oBottom.style.width = oBox.clientWidth - iT + "px"
212
- // that.$set('treeWidth', iT)
213
- // return false
214
- // }
215
- // document.onmouseup = function() {
216
- // document.onmousemove = null
217
- // document.onmouseup = null
218
- // oLine.releaseCapture && oLine.releaseCapture()
219
- // }
220
- // oLine.setCapture && oLine.setCapture()
221
- // return false
222
- // }
223
- this.changeShow()
224
- this.gotoWorkOrderSite()
225
- // 获取预约列表
226
- this.functions.f_role_name && this.functions.f_role_name.includes(this.config.msgRole) && this.config.isTip && this.getOrderList()
227
- },
228
- methods: {
229
- getOrderList(){
230
- let times = this.config.times * 60 * 1000
231
- console.log("=定时提示间隔=", times)
232
- try {
233
- this.interval = setInterval(() => {
234
- this.getDaiBan()
235
- }, times)
236
- } catch (error) {
237
- console.log('捕获到异常', error)
238
- }
239
- },
240
- async getDaiBan(){
241
- this.OrderDaiBan = ''
242
- this.AppDaiBan = ''
243
- let http = new HttpResetClass()
244
- await http.load('POST', '/rs/sql/singleTable', {data: {
245
- tablename:'t_order_center',
246
- condition:` (f_orderstate != '预约成功' and f_orgstr ='${this.$login.f.orgid}' and f_orderstate != '预约失败' ) or f_orderstate is null`
247
- }}, {
248
- resolveMsg: null,
249
- rejectMsg: null
250
- }).then((res) => {
251
- let OrderDaiBan = {}
252
- res.data.forEach(item=>{
253
- OrderDaiBan[item.f_ordertype] = OrderDaiBan[item.f_ordertype] || []
254
- OrderDaiBan[item.f_ordertype].push(item)
255
- })
256
- if (res.data.length> 0){
257
- this.OrderDaiBan = `您有${res.data.length}条需要处理的微信预约业务!`
258
- this.OrderDaiBan += `其中 ${Object.keys(OrderDaiBan).map(key=>`${key}:${OrderDaiBan[key].length}条`).join(', ')}`
259
- }
260
- })
261
- let data = {
262
- condition: '1 = 1',
263
- data: {
264
- orgid: this.$login.f.orgid,
265
- id: this.$login.f.id
266
- }
267
- }
268
- await http.load('POST', '/rs/sql/checkuser', {data: data}, {
269
- resolveMsg: null,
270
- rejectMsg: null
271
- }).then((res) => {
272
- let AppDaiBan = {}
273
- res.data.forEach(item=>{
274
- AppDaiBan[item.defname] = AppDaiBan[item.defname] || []
275
- AppDaiBan[item.defname].push(item)
276
- })
277
- if (res.data.length> 0){
278
- this.AppDaiBan = `您有${res.data.length}条需要处理的报建待办业务!`
279
- this.AppDaiBan += `其中 ${Object.keys(AppDaiBan).map(key=>`${key}:${AppDaiBan[key].length}条`).join(', ')}`
280
- }
281
- }).catch((e)=>{
282
- console.error(e)
283
- })
284
- if(this.AppDaiBan || this.OrderDaiBan){
285
- this.newTipShow = true
286
- }
287
- },
288
- // 提醒框被点击
289
- tipClick(){
290
- this.newTipShow = false
291
- this.newTipContextShow = true
292
- },
293
- gotoWorkOrderSite(){
294
- const isRemind =this.$appdata.getSingleValue("站点工单提醒")
295
- console.log('站点工单是否提醒',isRemind)
296
- if(isRemind && isRemind !== '是'){
297
- return
298
- }
299
- if(this.functions && this.functions.f_role_name && this.functions.f_role_name.indexOf('派单员') !== -1){
300
- const data = {
301
- "condition":
302
- {
303
- "condition":" 1=1 ",
304
- "sign":"1=1"
305
- },
306
- "userid":this.functions.name
307
- }
308
- new HttpResetClass().load('POST','rs/path/operatorService/n', {data}, {resolveMsg: null, rejectMsg: null}).then(res=>{
309
- if(res.data && res.data.n !== 0){
310
- this.$showMessage('你有'+res.data.n+'个工单待处理,请尽快前往站点工单页面进行处理')
311
- }
312
- })
313
- }
314
- },
315
- openUrl() {
316
- var url = `http://123.60.214.109:8406/submitTicket?personName=${this.$login.f.name}&orgName=${this.$login.f.orgs}`
317
- window.open(url, '_blank')
318
- },
319
- hindsetting() {
320
- this.setting = !this.setting
321
- if (this.setting) {
322
- this.srcsetting = '../../static/newStyle/setting.png'
323
- } else {
324
- this.srcsetting = '../../static/newStyle/setting1.png'
325
- }
326
-
327
- },
328
- hindsetting1() {
329
-
330
- if (!this.setting) {
331
- this.srcsetting = '../../static/newStyle/setting.png'
332
- this.setting = true
333
- }
334
-
335
- },
336
- isnodo(val) {
337
- console.log(val, 'ss')
338
- this.selecttab = val
339
- },
340
- unfurl() {
341
- if (this.showsum) {
342
- this.showsum = false
343
- } else {
344
- this.showsum = true
345
- }
346
- },
347
- // getElement(id) {
348
- // return document.getElementById(id)
349
- // },
350
- changeShow() {
351
- // this.treeOrIcon = !this.treeOrIcon
352
- // let oBox = this.getElement("box")
353
- // let oTop = this.getElement("top")
354
- // let oBottom = this.getElement("bottom")
355
- // let oLine = this.getElement("line")
356
- // if (this.treeOrIcon) {
357
- // // oLine.style.left = oTop.style.width = 300 + "px"
358
- // oTop.style.width = 150 + "px"
359
- // oBottom.style.width = oBox.clientWidth - 150 + "px"
360
- // }else {
361
- // oLine.style.left = oTop.style.width = 50 + "px"
362
- // oBottom.style.width = oBox.clientWidth - 50 + "px"
363
- // }
364
- // }
365
- this.treeOrIcon = !this.treeOrIcon
366
- // if (this.treeOrIcon) {
367
- // this.$els.top.style.width = 14 + "%"
368
- // this.$els.bottom.style.width = this.$els.box.clientWidth - 14 + "%"
369
- // }else {
370
- // this.$els.top.style.width = 8 + "%"
371
- // this.$els.bottom.style.width = this.$els.box.clientWidth - 8 + "%"
372
- // }
373
- },
374
- changeMain(userid) {
375
- this.$goto('res-main', {userid: this.userid}, 'self')
376
- },
377
- tabChange(name) {
378
- console.log(name, 'tabchanage')
379
- this.selecttab = name
380
- this.$refs.tree.changeSelect(name)
381
- },
382
- tabcg(val) {
383
- console.log(val)
384
- this.tabs = val
385
- },
386
- logOut() {
387
- console.log(this.$login.f)
388
- this.$showMessage('您确定要退出系统吗?', ['confirm', 'cancel']).then(async (res) => {
389
- if (res == 'confirm') {
390
- let data = {
391
- userid: this.$login.f.id,
392
- username: this.$login.f.name,
393
- usertelephone: this.$login.f.f_user_telephone
394
- }
395
- await this.$resetpost('rs/logic/logOut', data, {resolveMsg: '退出成功', rejectMsg: null})
396
- window.location.reload()
397
- }
398
- })
399
- }
400
- },
401
- computed: {
402
- nowDate() {
403
- return this.$login.getNowDate()
404
- }
405
- }
406
- }
407
- </script>
408
- <style lang="less">
409
- .newTip-transition {
410
- transition: all .4s ease;
411
- }
412
- .newTip-enter, .newTip-leave {
413
- height: 0;
414
- padding: 0 10px;
415
- opacity: 0;
416
- }
417
- .newTip a {
418
- color: #333;
419
- }
420
- .newTip {
421
- cursor: pointer;
422
- text-align: center;
423
- position: absolute;
424
- top: 3em;
425
- margin: 0 auto;
426
- width: 200px;
427
- left: 48%;
428
- line-height: 2;
429
- z-index: 10010;
430
- box-shadow: 0 4px 12px rgba(0,0,0,0.38);
431
- pointer-events: all;
432
- border-radius: 4px;
433
- background-color: whitesmoke;
434
- }
435
- /* 组件内通用样式 */
436
- .select-error {
437
- button {
438
- border-bottom: 1px solid #a94442 !important;
439
- }
440
- }
441
-
442
- // input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
443
- // -webkit-appearance:textfield;
444
- // }
445
- /* 表单输入框组 */
446
- .form-input-group {
447
- display: flex;
448
-
449
- label {
450
- width: 100px;
451
- text-align: right;
452
-
453
- + * {
454
- flex: 1;
455
- }
456
- }
457
- }
458
-
459
- // 日期组件在表单中沾满
460
- .form-horizontal .datepicker {
461
- width: 100%;
462
- }
463
-
464
- // 下拉选择框占据剩余全部空间
465
- .select-overspread {
466
- .form-group {
467
- // margin: 0px 5px 10px 0px;
468
- .form-control {
469
- margin-right: 0px;
470
- }
471
- }
472
-
473
- .btn-group, .btn-group-vertical {
474
- width: 100%;
475
- // padding-right: 5px;
476
- button {
477
- width: 100%;
478
- display: flex;
479
- justify-content: space-between;
480
- align-items: center;
481
- }
482
- }
483
-
484
- .dropdown-menu {
485
- width: 100%
486
- }
487
- }
488
-
489
- // 需要特定宽度的的样式
490
- .width-60 {
491
- width: 60px;
492
- }
493
-
494
- .userpanel {
495
- font-weight: 300;
496
- color: #333;
497
- position: fixed;
498
- right: 30px;
499
- top: 45px;
500
- background-color: white;
501
- box-shadow: darkgrey 0.5px 0.5px 0.5px 0.5px;
502
- padding: 4px 10px 4px 10px;
503
- border-radius: 2px;
504
- }
505
-
506
- .width-80 {
507
- width: 80px;
508
- }
509
-
510
- .width-100 {
511
- width: 100px;
512
- }
513
-
514
-
515
- /*右侧区域的背景*/
516
- .right-bg {
517
- width: 100%;
518
- flex: 1;
519
- color: #304A66;
520
- }
521
-
522
- .tree-flex {
523
- height: 100%;
524
- // width: 150px;
525
- /*width: 60px;*/
526
- background: #4a7cae;
527
- color: #fff;
528
-
529
- }
530
-
531
- .tree-flex-icon {
532
- width: 50px;
533
- /*transition: 0.5s;*/
534
-
535
- > .span {
536
- overflow-x: visible;
537
- }
538
- }
539
-
540
- .tree-flex h3 {
541
- text-align: center;
542
- margin: 1em 0;
543
- }
544
-
545
- .tree-flex-footer {
546
- height: 50px;
547
- display: flex;
548
- flex-direction: column;
549
- color: #fff;
550
- }
551
-
552
- .tree-flex-footer a, .tree-flex-footer button {
553
- flex: 1;
554
- padding: 8px 5px;
555
- font-size: 1.2em;
556
- // border-top: 1px solid #697D93;
557
- border-top: 1px solid #4a7cae;
558
- text-decoration: none;
559
- color: #fff;
560
- cursor: pointer;
561
- }
562
-
563
- .tree-flex-footer button {
564
- height: auto;
565
- width: 100%;
566
- border-radius: 0px;
567
- background-color: rgba(255, 255, 255, 0);
568
- border: none;
569
- border-top: 1px solid #4a7cae;
570
- // border-top: 1px solid #697D93;
571
- text-align: left;
572
- }
573
-
574
- .tree-flex-footer button:hover {
575
- outline: none;
576
- background-color: rgba(255, 255, 255, 0.2);
577
- }
578
-
579
- .tree-flex-footer button:focus {
580
- outline: none;
581
- background-color: rgba(255, 255, 255, 0.5);
582
- }
583
-
584
- .tree-flex-footer a:hover {
585
- color: #FFF;
586
- background-color: rgba(255, 255, 255, 0.2);
587
- }
588
-
589
- .tree-flex .btn-group {
590
- height: 50px !important;
591
- }
592
-
593
- .tree-flex .dropdown-menu {
594
- /* 控制显示列表的样式 */
595
- background: #4a7cae;
596
- border-radius: 0px;
597
- color: #fff;
598
- width: auto;
599
- margin: 0px;
600
- padding: 0px;
601
- }
602
-
603
- .tree-flex .dropdown-menu-up {
604
- /* bottom,top控制上下,left和right控制左右*/
605
- left: 100% !important;
606
- top: auto !important;
607
- bottom: 0;
608
- }
609
-
610
- .tree-flex .dropdown-menu-down {
611
- /* bottom,top控制上下,left和right控制左右*/
612
- left: 100% !important;
613
- top: 0 !important;
614
- }
615
-
616
- .tree-flex .dropdown-menu li {
617
- text-align: center;
618
- line-height: 50px;
619
- border-bottom: 1px solid #697D93;
620
- font-size: 1.2em;
621
- width: auto;
622
- white-space: nowrap;
623
- cursor: default;
624
-
625
- }
626
-
627
- .tree-flex .dropdown-menu li + li {
628
- text-align: left;
629
- border: 0;
630
- line-height: 40px;
631
- padding-left: 15px;
632
- padding-right: 15px;
633
- font-size: 1em;
634
- cursor: pointer;
635
- }
636
-
637
- .tree-flex .dropdown-menu li + li:hover {
638
- background-color: rgba(255, 255, 255, 0.2);
639
- }
640
-
641
- .tree-flex .dropdown-menu li a {
642
- border: none;
643
- color: #fff;
644
- height: 40px;
645
- line-height: 40px;
646
- font-size: 1em;
647
- padding: 0px;
648
- }
649
-
650
- .tree-flex .dropdown-menu li a:hover {
651
- color: #fff;
652
- background-color: rgba(255, 255, 255, 0);
653
- }
654
-
655
- .tree-flex img {
656
- height: 1.2em;
657
- width: 1.2em;
658
- margin-right: 15px;
659
- margin-left: 5px;
660
- }
661
-
662
- .line {
663
- height: 100%;
664
- width: 5px;
665
- background: #4C637B;
666
- cursor: e-resize;
667
- }
668
-
669
- /*为树(tree)组件写的样式*/
670
- .tree-img {
671
- font-size: 1.2em;
672
- }
673
-
674
- /*将较长信息截断显示,鼠标悬停显示全部信息*/
675
- .cutout50 {
676
- max-width: 50px;
677
- overflow: hidden;
678
- text-overflow: ellipsis;
679
- white-space: nowrap;
680
- }
681
-
682
- /* 滚动条样式 */
683
- /*---滚动条默认显示样式--*/
684
- ::-webkit-scrollbar-thumb {
685
- // display: none;
686
- background-color: rgba(0, 0, 0, 0.4);
687
- /*background-color:red;*/
688
- height: 50px;
689
- outline-offset: -2px;
690
- /*outline:2px solid #fff;*/
691
- -webkit-border-radius: 4px;
692
- /*border: 2px solid #fff;*/
693
- }
694
-
695
- /*---鼠标点击滚动条显示样式--*/
696
- ::-webkit-scrollbar-thumb:hover {
697
- // display: inherit;
698
- background-color: rgba(0, 0, 0, 0.4);
699
- height: 50px;
700
- -webkit-border-radius: 4px;
701
- }
702
-
703
- /*---滚动条大小--*/
704
- ::-webkit-scrollbar {
705
- width: 8px;
706
- height: 8px;
707
- }
708
-
709
- /*---滚动框背景样式--*/
710
- ::-webkit-scrollbar-track-piece {
711
- /* 全透明,不显示 */
712
- background-color: rgba(255, 255, 255, 0);
713
- -webkit-border-radius: 0;
714
- }
715
- </style>
1
+ <template>
2
+ <div @click="hindsetting1()" :class="{'with-watermark':showwatermakeflag}">
3
+ <span class="newTip" transition="newTip" @click="tipClick" v-if="newTipShow">
4
+ <span>您有一条新提醒</span>
5
+ </span>
6
+ <div class='flex-row system-main' id="box" v-el:box v-if="!isManger">
7
+ <div class="auto login-operator1" style="padding-top: 0 !important;">
8
+ <!-- <span>-->
9
+ <!-- <img-->
10
+ <!-- src="../../assets/people.png" height="15" width="15">-->
11
+ <!-- 登录人:</span>-->
12
+ <!-- <label>{{ orgpathnames }}</label>-->
13
+ </div>
14
+ <div class="system-left tree-flex" :class="{'tree-flex-icon': !treeOrIcon}" id="top" v-el:top>
15
+ <div class="system-left-chi" :class="{'system-left-icon': !treeOrIcon}">
16
+ <div class="span system-left-tree " style="height:85%">
17
+ <!-- <h3>{{ systemname }}</h3>-->
18
+ <!-- <div class="span" style="margin-bottom:10px;padding-bottom:5px;padding-top:5px;flex: 1;border-top: 1px solid #e5e5e5;border-bottom: 1px solid #e5e5e5;">-->
19
+ <left-tree :functions='functions.functions' :userid='userid' @isnodo="isnodo" v-show="treeOrIcon"
20
+ :tabs="tabs" v-ref:tree></left-tree>
21
+ <!--&lt;!&ndash; <icon-tree :functions='functions.functions' :userid='userid' v-show="!treeOrIcon"></icon-tree>&ndash;&gt;-->
22
+ </div>
23
+
24
+ <div class="tree-flex-footer">
25
+ <!-- <a @click="changeShow()"><img :src="imgs.open" alt=""><span v-if="treeOrIcon">菜单伸缩</span></a>-->
26
+ <!-- <a><img src="../../../static/treeset.png" alt="">系统设置</a> -->
27
+ <dropdown class="auto">
28
+ <button type="button" data-toggle="dropdown">
29
+ <img :src="imgs.set" alt=""><span v-if="treeOrIcon">系统设置</span>
30
+ </button>
31
+ <ul slot="dropdown-menu" class="dropdown-menu dropdown-menu-up">
32
+ <li>系统信息及设置</li>
33
+ <!-- <li>{{name}}</li> -->
34
+ <li>{{ date }}</li>
35
+ <li @click="openUrl()">售后服务</li>
36
+ <li @click="show=true">修改密码</li>
37
+ <li @click="AddChangeMsgShow=true">系统版本:V3.0</li>
38
+ </ul>
39
+
40
+ </dropdown>
41
+ <a href="index.html" @click.prevent="logOut">
42
+ <img :src="imgs.out" alt=""><span v-if="treeOrIcon">退出系统</span>
43
+ </a>
44
+ </div>
45
+ </div>
46
+ </div>
47
+ <!-- <div class="line" id="line" v-show="treeOrIcon" v-el:line></div> -->
48
+
49
+ <div class="flex right-bg system-right" id="bottom" v-el:bottom>
50
+ <!-- <operator-badge></operator-badge> -->
51
+ <div class="span">
52
+ <echarts-box v-if="$refs.mic.tabs.length === 0"></echarts-box>
53
+ <dynamic :comps='[]' name='main' :selecttab.sync="selecttab" :orgpathnames="orgpathnames" :closekeep="true" :closeall="true"
54
+ @tab-changed="tabChange" @tabscg="tabcg" v-ref:mic v-show="!($refs.mic.tabs.length === 0)"></dynamic>
55
+ </div>
56
+ </div>
57
+ </div>
58
+ <div v-show="isManger">
59
+ <route v-ref:route></route>
60
+ </div>
61
+ <modal v-if="newTipContextShow" :show.sync="newTipContextShow" :backdrop="false">
62
+ <header slot="modal-header" style="display:none"> </header>
63
+ <article slot="modal-body" class="modal-body">
64
+ <form class="form-horizontal">
65
+ <div class="row">
66
+ <div class="col-sm-12 " v-if="AppDaiBan !==''">
67
+ <label class="col-sm-2">报装待办:</label>
68
+ <span style="font-weight:normal">{{AppDaiBan}}</span>
69
+ </div>
70
+ <div class="col-sm-12 " v-if="OrderDaiBan !==''">
71
+ <label class="col-sm-2">预约待办:</label>
72
+ <span style="font-weight:normal">{{OrderDaiBan}}</span>
73
+ </div>
74
+ </div>
75
+ </form>
76
+ </article>
77
+ <footer slot="modal-footer" style="height: 8vh" class="modal-footer">
78
+ <button class="button_search" @click="newTipContextShow = false">确认</button>
79
+ </footer>
80
+ </modal>
81
+
82
+ <!-- 变更录入 模态框 -->
83
+ <add-changemsg :show="AddChangeMsgShow" v-on:toggle="AddChangeMsgShow = false"></add-changemsg>
84
+ <!-- 修改密码组件 -->
85
+ <modify-pw :show.sync="show" v-if="show"></modify-pw>
86
+ <!-- 修改密码模态框 -->
87
+ </div>
88
+ </template>
89
+
90
+ <script>
91
+ import vue from 'vue'
92
+ import co from 'co'
93
+ import {HttpResetClass} from "vue-client";
94
+
95
+ let getwartermakr = async function (self) {
96
+ let param = {
97
+ tablename: 't_singlevalue',
98
+ condition: " 1=1 and name=\'水印内容\'"
99
+ };
100
+ let result = await self.$resetpost('rs/sql/saleSingleTable', {data: param}, {resolveMsg: null, rejectMsg: null});
101
+ if (result && result.data.length > 0) {
102
+ self.showwatermakeflag = true;
103
+ createWaterMark(result.data[0].value);
104
+ } else {
105
+ self.showwatermakeflag = false;
106
+ }
107
+ }
108
+
109
+ let createWaterMark = function (userName) {
110
+ let style;
111
+ if (style) style.remove();
112
+ let width = window.parseInt(document.body.clientWidth);
113
+ let canvasWidth = width / window.parseInt(width / 320);
114
+ let fontFamily = window.getComputedStyle(document.body)["font-family"];
115
+ let canvas = document.createElement("canvas");
116
+ canvas.width = canvasWidth;
117
+ canvas.height = 200;
118
+ let ctx = canvas.getContext("2d");
119
+ ctx.rotate((-20 * Math.PI) / 180);
120
+ ctx.font = `20px ${fontFamily}`;
121
+ ctx.fillStyle = "rgba(8,8,8,.1)";
122
+ ctx.fillText(userName, 50, 200);
123
+ let imgSrc = canvas.toDataURL("image/png");
124
+ style = document.createElement("style");
125
+ style.innerHTML = `.with-watermark:before{
126
+ content: "";
127
+ width: 100%;
128
+ height: 100%;
129
+ display: block;
130
+ position: absolute;
131
+ background-image: url("${imgSrc}");
132
+ }`;
133
+ (document.head.append || document.head.appendChild).apply(document.head, [style]);
134
+ }
135
+
136
+ window.onunload = () => {
137
+ vue.http({url: `rs/user/update/${this.$login.f.ename}`, method: 'GET'})
138
+ }
139
+ window.onbeforeunload = () => {
140
+ vue.http({url: `rs/user/update/${this.$login.f.ename}`, method: 'GET'})
141
+ }
142
+ export default {
143
+ title: '主界面',
144
+ props: ['functions', 'userid', 'config'],
145
+ data() {
146
+ return {
147
+ // 页面提示信息定时器
148
+ interval: null,
149
+ newTipShow: false,
150
+ newTipContextShow: false,
151
+ AppDaiBan: '',
152
+ OrderDaiBan: '',
153
+ // 左侧树下部三个小图标
154
+ imgs: {
155
+ open: '/images/lefticon/菜单伸缩.png',
156
+ set: '/images/lefticon/系统设置.png',
157
+ out: '/images/lefticon/退出系统.png',
158
+ img1: '/images/newStyle/login-user.png',
159
+ logoimg: '/static/newStyle/fife.png'
160
+ // img2: '/images/lefticon/退出系统.png',
161
+ },
162
+ treeOrIcon: false,
163
+ isManger: false,
164
+ show: false,
165
+ orgpathnames: `${this.$login.f.orgs}-${this.$login.f.deps}-${this.$login.f.name}`,
166
+ systemname: '客服系统',
167
+ date: this.$login.toStandardDateString(),
168
+ tabs: [], //已初始化页签数组
169
+ selecttab: '',
170
+ setting: true,
171
+ srcsetting: '../../static/newStyle/setting.png',
172
+ showwatermakeflag: false,
173
+ // headerHint: true, // 右侧顶部提示信息
174
+ // value: 25645.26,
175
+ // AddChangeMsgShow: false,
176
+ // showsum: false
177
+ }
178
+ },
179
+ ready() {
180
+ getwartermakr(this);
181
+ let component = this.$login.getUrlCompileParames('component')
182
+ if (component) {
183
+ this.isManger = true
184
+ this.$refs.route.init(component, {data: this.functions.functions})
185
+ }
186
+ if (this.$login.f.password == '1') {
187
+ this.$showMessage('本地登录系统为此账户的初始密码,请确认修改密码!!!', ['confirm', 'cancel']).then((res) => {
188
+ if (res == 'confirm')
189
+ this.show = true
190
+ })
191
+ }
192
+ console.log("系统名称", this.$appdata.getSingleValue("系统名称"))
193
+ this.systemname = this.$appdata.getSingleValue("系统名称") ? this.$appdata.getSingleValue("系统名称") : '客服系统'
194
+ // let oBox = this.getElement("box")
195
+ // let oTop = this.getElement("top")
196
+ // let oBottom = this.getElement("bottom")
197
+ // let oLine = this.getElement("line")
198
+ // let that = this
199
+ // oLine.onmousedown = function(e) {
200
+ // let disX = (e || event).clientX
201
+ // oLine.left = oLine.offsetLeft
202
+ // document.onmousemove = function(e) {
203
+ // let iT = oLine.left + ((e || event).clientX - disX)
204
+ // var e = e || window.event
205
+ // let tarnameb = e.target || e.srcElement
206
+ // let maxT = oBox.clientWight - oLine.offsetWidth
207
+ // oLine.style.margin = 0
208
+ // iT < 0 && (iT = 0)
209
+ // iT > maxT && (iT = maxT)
210
+ // oLine.style.left = oTop.style.width = iT + "px"
211
+ // oBottom.style.width = oBox.clientWidth - iT + "px"
212
+ // that.$set('treeWidth', iT)
213
+ // return false
214
+ // }
215
+ // document.onmouseup = function() {
216
+ // document.onmousemove = null
217
+ // document.onmouseup = null
218
+ // oLine.releaseCapture && oLine.releaseCapture()
219
+ // }
220
+ // oLine.setCapture && oLine.setCapture()
221
+ // return false
222
+ // }
223
+ this.changeShow()
224
+ this.gotoWorkOrderSite()
225
+ // 获取预约列表
226
+ this.functions.f_role_name && this.functions.f_role_name.includes(this.config.msgRole) && this.config.isTip && this.getOrderList()
227
+ },
228
+ methods: {
229
+ getOrderList(){
230
+ let times = this.config.times * 60 * 1000
231
+ console.log("=定时提示间隔=", times)
232
+ try {
233
+ this.interval = setInterval(() => {
234
+ this.getDaiBan()
235
+ }, times)
236
+ } catch (error) {
237
+ console.log('捕获到异常', error)
238
+ }
239
+ },
240
+ async getDaiBan(){
241
+ this.OrderDaiBan = ''
242
+ this.AppDaiBan = ''
243
+ let http = new HttpResetClass()
244
+ await http.load('POST', '/rs/sql/singleTable', {data: {
245
+ tablename:'t_order_center',
246
+ condition:` (f_orderstate != '预约成功' and f_orgstr ='${this.$login.f.orgid}' and f_orderstate != '预约失败' ) or f_orderstate is null`
247
+ }}, {
248
+ resolveMsg: null,
249
+ rejectMsg: null
250
+ }).then((res) => {
251
+ let OrderDaiBan = {}
252
+ res.data.forEach(item=>{
253
+ OrderDaiBan[item.f_ordertype] = OrderDaiBan[item.f_ordertype] || []
254
+ OrderDaiBan[item.f_ordertype].push(item)
255
+ })
256
+ if (res.data.length> 0){
257
+ this.OrderDaiBan = `您有${res.data.length}条需要处理的微信预约业务!`
258
+ this.OrderDaiBan += `其中 ${Object.keys(OrderDaiBan).map(key=>`${key}:${OrderDaiBan[key].length}条`).join(', ')}`
259
+ }
260
+ })
261
+ let data = {
262
+ condition: '1 = 1',
263
+ data: {
264
+ orgid: this.$login.f.orgid,
265
+ id: this.$login.f.id
266
+ }
267
+ }
268
+ await http.load('POST', '/rs/sql/checkuser', {data: data}, {
269
+ resolveMsg: null,
270
+ rejectMsg: null
271
+ }).then((res) => {
272
+ let AppDaiBan = {}
273
+ res.data.forEach(item=>{
274
+ AppDaiBan[item.defname] = AppDaiBan[item.defname] || []
275
+ AppDaiBan[item.defname].push(item)
276
+ })
277
+ if (res.data.length> 0){
278
+ this.AppDaiBan = `您有${res.data.length}条需要处理的报建待办业务!`
279
+ this.AppDaiBan += `其中 ${Object.keys(AppDaiBan).map(key=>`${key}:${AppDaiBan[key].length}条`).join(', ')}`
280
+ }
281
+ }).catch((e)=>{
282
+ console.error(e)
283
+ })
284
+ if(this.AppDaiBan || this.OrderDaiBan){
285
+ this.newTipShow = true
286
+ }
287
+ },
288
+ // 提醒框被点击
289
+ tipClick(){
290
+ this.newTipShow = false
291
+ this.newTipContextShow = true
292
+ },
293
+ gotoWorkOrderSite(){
294
+ const isRemind =this.$appdata.getSingleValue("站点工单提醒")
295
+ console.log('站点工单是否提醒',isRemind)
296
+ if(isRemind && isRemind !== '是'){
297
+ return
298
+ }
299
+ if(this.functions && this.functions.f_role_name && this.functions.f_role_name.indexOf('派单员') !== -1){
300
+ const data = {
301
+ "condition":
302
+ {
303
+ "condition":" 1=1 ",
304
+ "sign":"1=1"
305
+ },
306
+ "userid":this.functions.name
307
+ }
308
+ new HttpResetClass().load('POST','rs/path/operatorService/n', {data}, {resolveMsg: null, rejectMsg: null}).then(res=>{
309
+ if(res.data && res.data.n !== 0){
310
+ this.$showMessage('你有'+res.data.n+'个工单待处理,请尽快前往站点工单页面进行处理')
311
+ }
312
+ })
313
+ }
314
+ },
315
+ openUrl() {
316
+ var url = `http://123.60.214.109:8406/submitTicket?personName=${this.$login.f.name}&orgName=${this.$login.f.orgs}`
317
+ window.open(url, '_blank')
318
+ },
319
+ hindsetting() {
320
+ this.setting = !this.setting
321
+ if (this.setting) {
322
+ this.srcsetting = '../../static/newStyle/setting.png'
323
+ } else {
324
+ this.srcsetting = '../../static/newStyle/setting1.png'
325
+ }
326
+
327
+ },
328
+ hindsetting1() {
329
+
330
+ if (!this.setting) {
331
+ this.srcsetting = '../../static/newStyle/setting.png'
332
+ this.setting = true
333
+ }
334
+
335
+ },
336
+ isnodo(val) {
337
+ console.log(val, 'ss')
338
+ this.selecttab = val
339
+ },
340
+ unfurl() {
341
+ if (this.showsum) {
342
+ this.showsum = false
343
+ } else {
344
+ this.showsum = true
345
+ }
346
+ },
347
+ // getElement(id) {
348
+ // return document.getElementById(id)
349
+ // },
350
+ changeShow() {
351
+ // this.treeOrIcon = !this.treeOrIcon
352
+ // let oBox = this.getElement("box")
353
+ // let oTop = this.getElement("top")
354
+ // let oBottom = this.getElement("bottom")
355
+ // let oLine = this.getElement("line")
356
+ // if (this.treeOrIcon) {
357
+ // // oLine.style.left = oTop.style.width = 300 + "px"
358
+ // oTop.style.width = 150 + "px"
359
+ // oBottom.style.width = oBox.clientWidth - 150 + "px"
360
+ // }else {
361
+ // oLine.style.left = oTop.style.width = 50 + "px"
362
+ // oBottom.style.width = oBox.clientWidth - 50 + "px"
363
+ // }
364
+ // }
365
+ this.treeOrIcon = !this.treeOrIcon
366
+ // if (this.treeOrIcon) {
367
+ // this.$els.top.style.width = 14 + "%"
368
+ // this.$els.bottom.style.width = this.$els.box.clientWidth - 14 + "%"
369
+ // }else {
370
+ // this.$els.top.style.width = 8 + "%"
371
+ // this.$els.bottom.style.width = this.$els.box.clientWidth - 8 + "%"
372
+ // }
373
+ },
374
+ changeMain(userid) {
375
+ this.$goto('res-main', {userid: this.userid}, 'self')
376
+ },
377
+ tabChange(name) {
378
+ console.log(name, 'tabchanage')
379
+ this.selecttab = name
380
+ this.$refs.tree.changeSelect(name)
381
+ },
382
+ tabcg(val) {
383
+ console.log(val)
384
+ this.tabs = val
385
+ },
386
+ logOut() {
387
+ console.log(this.$login.f)
388
+ this.$showMessage('您确定要退出系统吗?', ['confirm', 'cancel']).then(async (res) => {
389
+ if (res == 'confirm') {
390
+ let data = {
391
+ userid: this.$login.f.id,
392
+ username: this.$login.f.name,
393
+ usertelephone: this.$login.f.f_user_telephone
394
+ }
395
+ await this.$resetpost('rs/logic/logOut', data, {resolveMsg: '退出成功', rejectMsg: null})
396
+ window.location.reload()
397
+ }
398
+ })
399
+ }
400
+ },
401
+ computed: {
402
+ nowDate() {
403
+ return this.$login.getNowDate()
404
+ }
405
+ }
406
+ }
407
+ </script>
408
+ <style lang="less">
409
+ .newTip-transition {
410
+ transition: all .4s ease;
411
+ }
412
+ .newTip-enter, .newTip-leave {
413
+ height: 0;
414
+ padding: 0 10px;
415
+ opacity: 0;
416
+ }
417
+ .newTip a {
418
+ color: #333;
419
+ }
420
+ .newTip {
421
+ cursor: pointer;
422
+ text-align: center;
423
+ position: absolute;
424
+ top: 3em;
425
+ margin: 0 auto;
426
+ width: 200px;
427
+ left: 48%;
428
+ line-height: 2;
429
+ z-index: 10010;
430
+ box-shadow: 0 4px 12px rgba(0,0,0,0.38);
431
+ pointer-events: all;
432
+ border-radius: 4px;
433
+ background-color: whitesmoke;
434
+ }
435
+ /* 组件内通用样式 */
436
+ .select-error {
437
+ button {
438
+ border-bottom: 1px solid #a94442 !important;
439
+ }
440
+ }
441
+
442
+ // input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
443
+ // -webkit-appearance:textfield;
444
+ // }
445
+ /* 表单输入框组 */
446
+ .form-input-group {
447
+ display: flex;
448
+
449
+ label {
450
+ width: 100px;
451
+ text-align: right;
452
+
453
+ + * {
454
+ flex: 1;
455
+ }
456
+ }
457
+ }
458
+
459
+ // 日期组件在表单中沾满
460
+ .form-horizontal .datepicker {
461
+ width: 100%;
462
+ }
463
+
464
+ // 下拉选择框占据剩余全部空间
465
+ .select-overspread {
466
+ .form-group {
467
+ // margin: 0px 5px 10px 0px;
468
+ .form-control {
469
+ margin-right: 0px;
470
+ }
471
+ }
472
+
473
+ .btn-group, .btn-group-vertical {
474
+ width: 100%;
475
+ // padding-right: 5px;
476
+ button {
477
+ width: 100%;
478
+ display: flex;
479
+ justify-content: space-between;
480
+ align-items: center;
481
+ }
482
+ }
483
+
484
+ .dropdown-menu {
485
+ width: 100%
486
+ }
487
+ }
488
+
489
+ // 需要特定宽度的的样式
490
+ .width-60 {
491
+ width: 60px;
492
+ }
493
+
494
+ .userpanel {
495
+ font-weight: 300;
496
+ color: #333;
497
+ position: fixed;
498
+ right: 30px;
499
+ top: 45px;
500
+ background-color: white;
501
+ box-shadow: darkgrey 0.5px 0.5px 0.5px 0.5px;
502
+ padding: 4px 10px 4px 10px;
503
+ border-radius: 2px;
504
+ }
505
+
506
+ .width-80 {
507
+ width: 80px;
508
+ }
509
+
510
+ .width-100 {
511
+ width: 100px;
512
+ }
513
+
514
+
515
+ /*右侧区域的背景*/
516
+ .right-bg {
517
+ width: 100%;
518
+ flex: 1;
519
+ color: #304A66;
520
+ }
521
+
522
+ .tree-flex {
523
+ height: 100%;
524
+ // width: 150px;
525
+ /*width: 60px;*/
526
+ background: #4a7cae;
527
+ color: #fff;
528
+
529
+ }
530
+
531
+ .tree-flex-icon {
532
+ width: 50px;
533
+ /*transition: 0.5s;*/
534
+
535
+ > .span {
536
+ overflow-x: visible;
537
+ }
538
+ }
539
+
540
+ .tree-flex h3 {
541
+ text-align: center;
542
+ margin: 1em 0;
543
+ }
544
+
545
+ .tree-flex-footer {
546
+ height: 50px;
547
+ display: flex;
548
+ flex-direction: column;
549
+ color: #fff;
550
+ }
551
+
552
+ .tree-flex-footer a, .tree-flex-footer button {
553
+ flex: 1;
554
+ padding: 8px 5px;
555
+ font-size: 1.2em;
556
+ // border-top: 1px solid #697D93;
557
+ border-top: 1px solid #4a7cae;
558
+ text-decoration: none;
559
+ color: #fff;
560
+ cursor: pointer;
561
+ }
562
+
563
+ .tree-flex-footer button {
564
+ height: auto;
565
+ width: 100%;
566
+ border-radius: 0px;
567
+ background-color: rgba(255, 255, 255, 0);
568
+ border: none;
569
+ border-top: 1px solid #4a7cae;
570
+ // border-top: 1px solid #697D93;
571
+ text-align: left;
572
+ }
573
+
574
+ .tree-flex-footer button:hover {
575
+ outline: none;
576
+ background-color: rgba(255, 255, 255, 0.2);
577
+ }
578
+
579
+ .tree-flex-footer button:focus {
580
+ outline: none;
581
+ background-color: rgba(255, 255, 255, 0.5);
582
+ }
583
+
584
+ .tree-flex-footer a:hover {
585
+ color: #FFF;
586
+ background-color: rgba(255, 255, 255, 0.2);
587
+ }
588
+
589
+ .tree-flex .btn-group {
590
+ height: 50px !important;
591
+ }
592
+
593
+ .tree-flex .dropdown-menu {
594
+ /* 控制显示列表的样式 */
595
+ background: #4a7cae;
596
+ border-radius: 0px;
597
+ color: #fff;
598
+ width: auto;
599
+ margin: 0px;
600
+ padding: 0px;
601
+ }
602
+
603
+ .tree-flex .dropdown-menu-up {
604
+ /* bottom,top控制上下,left和right控制左右*/
605
+ left: 100% !important;
606
+ top: auto !important;
607
+ bottom: 0;
608
+ }
609
+
610
+ .tree-flex .dropdown-menu-down {
611
+ /* bottom,top控制上下,left和right控制左右*/
612
+ left: 100% !important;
613
+ top: 0 !important;
614
+ }
615
+
616
+ .tree-flex .dropdown-menu li {
617
+ text-align: center;
618
+ line-height: 50px;
619
+ border-bottom: 1px solid #697D93;
620
+ font-size: 1.2em;
621
+ width: auto;
622
+ white-space: nowrap;
623
+ cursor: default;
624
+
625
+ }
626
+
627
+ .tree-flex .dropdown-menu li + li {
628
+ text-align: left;
629
+ border: 0;
630
+ line-height: 40px;
631
+ padding-left: 15px;
632
+ padding-right: 15px;
633
+ font-size: 1em;
634
+ cursor: pointer;
635
+ }
636
+
637
+ .tree-flex .dropdown-menu li + li:hover {
638
+ background-color: rgba(255, 255, 255, 0.2);
639
+ }
640
+
641
+ .tree-flex .dropdown-menu li a {
642
+ border: none;
643
+ color: #fff;
644
+ height: 40px;
645
+ line-height: 40px;
646
+ font-size: 1em;
647
+ padding: 0px;
648
+ }
649
+
650
+ .tree-flex .dropdown-menu li a:hover {
651
+ color: #fff;
652
+ background-color: rgba(255, 255, 255, 0);
653
+ }
654
+
655
+ .tree-flex img {
656
+ height: 1.2em;
657
+ width: 1.2em;
658
+ margin-right: 15px;
659
+ margin-left: 5px;
660
+ }
661
+
662
+ .line {
663
+ height: 100%;
664
+ width: 5px;
665
+ background: #4C637B;
666
+ cursor: e-resize;
667
+ }
668
+
669
+ /*为树(tree)组件写的样式*/
670
+ .tree-img {
671
+ font-size: 1.2em;
672
+ }
673
+
674
+ /*将较长信息截断显示,鼠标悬停显示全部信息*/
675
+ .cutout50 {
676
+ max-width: 50px;
677
+ overflow: hidden;
678
+ text-overflow: ellipsis;
679
+ white-space: nowrap;
680
+ }
681
+
682
+ /* 滚动条样式 */
683
+ /*---滚动条默认显示样式--*/
684
+ ::-webkit-scrollbar-thumb {
685
+ // display: none;
686
+ background-color: rgba(0, 0, 0, 0.4);
687
+ /*background-color:red;*/
688
+ height: 50px;
689
+ outline-offset: -2px;
690
+ /*outline:2px solid #fff;*/
691
+ -webkit-border-radius: 4px;
692
+ /*border: 2px solid #fff;*/
693
+ }
694
+
695
+ /*---鼠标点击滚动条显示样式--*/
696
+ ::-webkit-scrollbar-thumb:hover {
697
+ // display: inherit;
698
+ background-color: rgba(0, 0, 0, 0.4);
699
+ height: 50px;
700
+ -webkit-border-radius: 4px;
701
+ }
702
+
703
+ /*---滚动条大小--*/
704
+ ::-webkit-scrollbar {
705
+ width: 8px;
706
+ height: 8px;
707
+ }
708
+
709
+ /*---滚动框背景样式--*/
710
+ ::-webkit-scrollbar-track-piece {
711
+ /* 全透明,不显示 */
712
+ background-color: rgba(255, 255, 255, 0);
713
+ -webkit-border-radius: 0;
714
+ }
715
+ </style>