openatc-components 0.1.170 → 0.1.171

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.
Files changed (20) hide show
  1. package/package/kisscomps/components/Channelization/Channelization.vue +28 -1
  2. package/package/kisscomps/components/DrawChannelization/drawsvg/iconSvg/motorwayIconSvg.vue +26 -14
  3. package/package/kisscomps/components/DrawChannelization/drawsvg/iconSvg/pedroadIconSvg.vue +23 -12
  4. package/package/kisscomps/components/IntersectionMap/crossDirection/baseImg/SidewalkSvg.vue +43 -31
  5. package/package/kisscomps/components/IntersectionMap/crossDirection/crossDiagram.vue +24 -1
  6. package/package/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/LphaseIconSvg.vue +36 -25
  7. package/package/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/phaseIconSvg.vue +29 -22
  8. package/package/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/rampPhaseIconSvg.vue +29 -18
  9. package/package/kissui.min.js +1 -1
  10. package/package.json +1 -1
  11. package/src/kisscomps/components/Channelization/Channelization.vue +28 -1
  12. package/src/kisscomps/components/DrawChannelization/drawsvg/iconSvg/motorwayIconSvg.vue +26 -14
  13. package/src/kisscomps/components/DrawChannelization/drawsvg/iconSvg/pedroadIconSvg.vue +23 -12
  14. package/src/kisscomps/components/IntersectionMap/crossDirection/baseImg/SidewalkSvg.vue +43 -31
  15. package/src/kisscomps/components/IntersectionMap/crossDirection/crossDiagram.vue +24 -1
  16. package/src/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/LphaseIconSvg.vue +36 -25
  17. package/src/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/phaseIconSvg.vue +29 -22
  18. package/src/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/rampPhaseIconSvg.vue +29 -18
  19. package/src/views/intersection.vue +1 -1
  20. package/src/views/overView.vue +2 -2
package/package/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/phaseIconSvg.vue CHANGED
@@ -16,20 +16,20 @@
16
16
  viewBox="0 0 36 26" style="enable-background:new 0 0 36 26;" xml:space="preserve" :width="IconLengh" :height="IconWdith">
17
17
  <!-- 东相位 -->
18
18
  <path id="东左转" :class="Data.name === '东左转' ? '' : 'invisible'" d="M11,7.1h24v-3H10.9c-3.1,0-5.7,2.6-5.8,5.7l-0.4,2.9L1,12.2l3.9,9.7l6.5-8.2l-3.7-0.5l0.5-3.3
19
- C8.2,8.4,9.4,7.1,11,7.1L11,7.1z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
19
+ C8.2,8.4,9.4,7.1,11,7.1L11,7.1z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
20
20
  <path id="东右转" :class="Data.name === '东右转' ? '' : 'invisible'" d="M8.1,15.8l-0.4-3l3.7-0.5L4.9,4.1L1,13.8l3.7-0.5l0.4,2.9c0,3.2,2.6,5.7,5.8,5.7H35v-3H10.9
21
- c-1.5,0-2.8-1.3-2.8-2.8V15.8z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
22
- <polygon id="东直行" :class="Data.name === '东直行' ? '' : 'invisible'" points="35,11.5 10.1,11.5 10.1,7.8 0.9,13 10.1,18.2 10.1,14.5 35,14.5 " :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
21
+ c-1.5,0-2.8-1.3-2.8-2.8V15.8z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
22
+ <polygon id="东直行" :class="Data.name === '东直行' ? '' : 'invisible'" points="35,11.5 10.1,11.5 10.1,7.8 0.9,13 10.1,18.2 10.1,14.5 35,14.5 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
23
23
  <path id="东掉头" :class="Data.name === '东掉头' ? '' : 'invisible'" d="M19.4,17.5h4.3v3.7l9.1-5.2l-9.1-5.2v3.7h-4.3c-1.5,0-2.8-1.7-2.8-3.7s1.3-3.7,2.8-3.7H35v-3H19.4
24
- c-3.2,0-5.8,3-5.8,6.7C13.6,14.5,16.2,17.5,19.4,17.5z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
24
+ c-3.2,0-5.8,3-5.8,6.7C13.6,14.5,16.2,17.5,19.4,17.5z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
25
25
  <!-- 西相位 -->
26
26
  <path id="西左转" :class="Data.name === '西左转' ? '' : 'invisible'" d="M25,18.9H1v3h24.1c3.1,0,5.7-2.6,5.8-5.7l0.4-2.9l3.7,0.5l-3.9-9.7l-6.5,8.2l3.7,0.5l-0.5,3.3
27
- C27.8,17.6,26.6,18.9,25,18.9L25,18.9z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
27
+ C27.8,17.6,26.6,18.9,25,18.9L25,18.9z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
28
28
  <path id="西右转" :class="Data.name === '西右转' ? '' : 'invisible'" d="M27.9,10.2l0.4,3l-3.7,0.5l6.5,8.2l3.9-9.7l-3.7,0.5l-0.4-2.9c0-3.2-2.6-5.7-5.8-5.7H1v3h24.1
29
- c1.5,0,2.8,1.3,2.8,2.8V10.2z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
30
- <polygon id="西直行" :class="Data.name === '西直行' ? '' : 'invisible'" points="1,14.5 26,14.5 26,18.2 35.1,13 26,7.8 26,11.5 1,11.5 " :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
29
+ c1.5,0,2.8,1.3,2.8,2.8V10.2z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
30
+ <polygon id="西直行" :class="Data.name === '西直行' ? '' : 'invisible'" points="1,14.5 26,14.5 26,18.2 35.1,13 26,7.8 26,11.5 1,11.5 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
31
31
  <path id="西掉头" :class="Data.name === '西掉头' ? '' : 'invisible'" d="M16.6,8.5h-4.3V4.7L3.3,10l9.1,5.2v-3.7h4.3c1.5,0,2.8,1.7,2.8,3.7s-1.3,3.7-2.8,3.7H1v3h15.6
32
- c3.2,0,5.8-3,5.8-6.7C22.4,11.5,19.8,8.5,16.6,8.5z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
32
+ c3.2,0,5.8-3,5.8-6.7C22.4,11.5,19.8,8.5,16.6,8.5z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
33
33
  </svg>
34
34
  </div>
35
35
  <div :class="Data.id >= 9 ? '' : 'hide'">
@@ -37,20 +37,20 @@
37
37
  viewBox="0 0 26 36" style="enable-background:new 0 0 26 36;" xml:space="preserve" :width="IconWdith" :height="IconLengh">
38
38
  <!-- 南相位 -->
39
39
  <path id="南左转" :class="Data.name === '南左转' ? '' : 'invisible'" d="M18.9,11v24h3V10.9c0-3.1-2.6-5.7-5.7-5.8l-2.9-0.4L13.8,1L4.1,4.9l8.2,6.5l0.5-3.7l3.3,0.5
40
- C17.6,8.2,18.9,9.4,18.9,11L18.9,11z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
40
+ C17.6,8.2,18.9,9.4,18.9,11L18.9,11z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
41
41
  <path id="南右转" :class="Data.name === '南右转' ? '' : 'invisible'" d="M10.2,8.1l3-0.4l0.5,3.7l8.2-6.5L12.2,1l0.5,3.7L9.8,5.1c-3.2,0-5.7,2.6-5.7,5.8V35h3V10.9
42
- c0-1.5,1.3-2.8,2.8-2.8H10.2z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
43
- <polygon id="南直行" :class="Data.name === '南直行' ? '' : 'invisible'" points="14.5,35 14.5,10.1 18.2,10.1 13,0.9 7.8,10.1 11.5,10.1 11.5,35 " :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
42
+ c0-1.5,1.3-2.8,2.8-2.8H10.2z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
43
+ <polygon id="南直行" :class="Data.name === '南直行' ? '' : 'invisible'" points="14.5,35 14.5,10.1 18.2,10.1 13,0.9 7.8,10.1 11.5,10.1 11.5,35 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
44
44
  <path id="南掉头" :class="Data.name === '南掉头' ? '' : 'invisible'" d="M8.5,19.4v4.3H4.7l5.2,9.1l5.2-9.1h-3.7v-4.3c0-1.5,1.7-2.8,3.7-2.8s3.7,1.3,3.7,2.8V35h3V19.4
45
- c0-3.2-3-5.8-6.7-5.8C11.5,13.6,8.5,16.2,8.5,19.4z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
45
+ c0-3.2-3-5.8-6.7-5.8C11.5,13.6,8.5,16.2,8.5,19.4z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
46
46
  <!-- 北相位 -->
47
47
  <path id="北左转" :class="Data.name === '北左转' ? '' : 'invisible'" d="M7.1,25V1h-3v24.1c0,3.1,2.6,5.7,5.7,5.8l2.9,0.4L12.2,35l9.7-3.9l-8.2-6.5l-0.5,3.7l-3.3-0.5
48
- C8.4,27.8,7.1,26.6,7.1,25L7.1,25z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
48
+ C8.4,27.8,7.1,26.6,7.1,25L7.1,25z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
49
49
  <path id="北右转" :class="Data.name === '北右转' ? '' : 'invisible'" d="M15.8,27.9l-3,0.4l-0.5-3.7l-8.2,6.5l9.7,3.9l-0.5-3.7l2.9-0.4c3.2,0,5.7-2.6,5.7-5.8V1h-3v24.1
50
- c0,1.5-1.3,2.8-2.8,2.8H15.8z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
51
- <polygon id="北直行" :class="Data.name === '北直行' ? '' : 'invisible'" points="11.5,0.9 11.5,25.9 7.8,25.9 13,35 18.2,25.9 14.5,25.9 14.5,0.9 " :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
50
+ c0,1.5-1.3,2.8-2.8,2.8H15.8z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
51
+ <polygon id="北直行" :class="Data.name === '北直行' ? '' : 'invisible'" points="11.5,0.9 11.5,25.9 7.8,25.9 13,35 18.2,25.9 14.5,25.9 14.5,0.9 " :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
52
52
  <path id="北掉头" :class="Data.name === '北掉头' ? '' : 'invisible'" d="M17.5,16.6v-4.3h3.7L16,3.3l-5.2,9.1h3.7v4.3c0,1.5-1.7,2.8-3.7,2.8s-3.7-1.3-3.7-2.8V1h-3v15.6
53
- c0,3.2,3,5.8,6.7,5.8C14.5,22.4,17.5,19.8,17.5,16.6z" :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)"/>
53
+ c0,3.2,3,5.8,6.7,5.8C14.5,22.4,17.5,19.8,17.5,16.6z" :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)"/>
54
54
  </svg>
55
55
  </div>
56
56
  </div>
@@ -61,7 +61,7 @@ export default {
61
61
  data () {
62
62
  return {
63
63
  defaultColor: '#fff', // 默认状态颜色
64
- GreenFlashColor: undefined,
64
+ FlashColor: undefined,
65
65
  GreenColor: '#77fb65',
66
66
  YellowColor: '#f7b500',
67
67
  lastType: ''
@@ -71,18 +71,25 @@ export default {
71
71
  Data: {
72
72
  handler: function (val) {
73
73
  if (this.lastType === '') {
74
- if (val.type === 4 || val.type === '黄闪') {
74
+ if (val.type === 4 || val.control === 1) {
75
75
  // 绿闪：绿-》灰-》绿 循环效果
76
- this.GreenFlashColor = val.type === 4 ? this.GreenColor : this.YellowColor
76
+ let highlightColor = ''
77
+ if (val.type === 4) {
78
+ highlightColor = this.GreenColor
79
+ }
80
+ if (val.control === 1) {
81
+ highlightColor = this.YellowColor
82
+ }
83
+ this.FlashColor = highlightColor
77
84
  this.GreenIntervalId = setInterval(() => {
78
- this.GreenFlashColor = !this.GreenFlashColor || this.GreenFlashColor === '#828282' ? (val.type === 4 ? this.GreenColor : this.YellowColor) : '#828282'
85
+ this.FlashColor = !this.FlashColor || this.FlashColor === '#828282' ? highlightColor : '#828282'
79
86
  }, 500)
80
87
  this.lastType = val.type
81
88
  }
82
89
  }
83
- if (this.GreenIntervalId && val.type !== 4 && val.type !== '黄闪' && val.type !== this.lastType) {
90
+ if (this.GreenIntervalId && val.type !== 4 && val.control !== 1 && val.type !== this.lastType) {
84
91
  clearInterval(this.GreenIntervalId)
85
- this.GreenFlashColor = undefined
92
+ this.FlashColor = undefined
86
93
  this.lastType = ''
87
94
  }
88
95
  },
package/package/kisscomps/components/IntersectionMap/crossDirection/phaseIcon/rampPhaseIconSvg.vue CHANGED
@@ -15,19 +15,19 @@
15
15
  <svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
16
16
  viewBox="0 0 61.6 61.6" style="enable-background:new 0 0 61.6 61.6;" xml:space="preserve" :width="IconLengh" :height="IconWdith">
17
17
  <g id="西向支路" :class="Data.name === '西支路' ? '' : 'invisible'">
18
- <polygon :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)" points="3.1,43.9 45.5,29 47.8,35.4 60.3,20.9 41.5,17.7 43.7,23.9 1.3,38.8"/>
18
+ <polygon :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" points="3.1,43.9 45.5,29 47.8,35.4 60.3,20.9 41.5,17.7 43.7,23.9 1.3,38.8"/>
19
19
  </g>
20
20
 
21
21
  <g id="东向支路" :class="Data.name === '东支路' ? '' : 'invisible'">
22
- <polygon :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)" points="58.5,17.7 16.1,32.6 13.8,26.2 1.3,40.7 20.1,43.9 17.9,37.7 60.3,22.8"/>
22
+ <polygon :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" points="58.5,17.7 16.1,32.6 13.8,26.2 1.3,40.7 20.1,43.9 17.9,37.7 60.3,22.8"/>
23
23
  </g>
24
24
 
25
25
  <g id="北向支路" :class="Data.name === '北支路' ? '' : 'invisible'">
26
- <polygon :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)" points="17.7,3.1 32.6,45.5 26.2,47.8 40.7,60.3 43.9,41.5 37.7,43.7 22.8,1.3"/>
26
+ <polygon :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" points="17.7,3.1 32.6,45.5 26.2,47.8 40.7,60.3 43.9,41.5 37.7,43.7 22.8,1.3"/>
27
27
  </g>
28
28
 
29
29
  <g id="南向支路" :class="Data.name === '南支路' ? '' : 'invisible'">
30
- <polygon :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)" points="43.9,58.5 29,16.1 35.4,13.8 20.9,1.3 17.7,20.1 23.9,17.9 38.8,60.3"/>
30
+ <polygon :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" points="43.9,58.5 29,16.1 35.4,13.8 20.9,1.3 17.7,20.1 23.9,17.9 38.8,60.3"/>
31
31
  </g>
32
32
 
33
33
  </svg>
@@ -36,19 +36,19 @@
36
36
  <svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
37
37
  viewBox="0 0 61.6 61.6" style="enable-background:new 0 0 61.6 61.6;" xml:space="preserve" :width="IconWdith" :height="IconLengh">
38
38
  <g id="西直行" :class="Data.name === '西直行' ? '' : 'invisible'">
39
- <polygon :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)" points="0,33.4 45,33.4 45,40.2 61.6,30.7 45,21.4 45,28 0,28"/>
39
+ <polygon :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" points="0,33.4 45,33.4 45,40.2 61.6,30.7 45,21.4 45,28 0,28"/>
40
40
  </g>
41
41
 
42
42
  <g id="东直行" :class="Data.name === '东直行' ? '' : 'invisible'">
43
- <polygon :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)" points="61.6,28.2 16.6,28.2 16.6,21.4 0,30.9 16.6,40.2 16.6,33.6 61.6,33.6"/>
43
+ <polygon :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" points="61.6,28.2 16.6,28.2 16.6,21.4 0,30.9 16.6,40.2 16.6,33.6 61.6,33.6"/>
44
44
  </g>
45
45
 
46
46
  <g id="北直行" :class="Data.name === '北直行' ? '' : 'invisible'">
47
- <polygon :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)" points="28.2,0 28.2,45 21.4,45 30.9,61.6 40.2,45 33.6,45 33.6,0"/>
47
+ <polygon :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" points="28.2,0 28.2,45 21.4,45 30.9,61.6 40.2,45 33.6,45 33.6,0"/>
48
48
  </g>
49
49
 
50
50
  <g id="南直行" :class="Data.name === '南直行' ? '' : 'invisible'">
51
- <polygon :fill="this.GreenFlashColor ? this.GreenFlashColor : (Data.color ? Data.color : defaultColor)" points="33.4,61.6 33.4,16.6 40.2,16.6 30.7,0 21.4,16.6 28,16.6 28,61.6"/>
51
+ <polygon :fill="this.FlashColor ? this.FlashColor : (Data.color ? Data.color : defaultColor)" points="33.4,61.6 33.4,16.6 40.2,16.6 30.7,0 21.4,16.6 28,16.6 28,61.6"/>
52
52
  </g>
53
53
  </svg>
54
54
  </div>
@@ -60,24 +60,35 @@ export default {
60
60
  data () {
61
61
  return {
62
62
  defaultColor: '#fff', // 默认状态颜色
63
- GreenFlashColor: undefined,
63
+ FlashColor: undefined,
64
+ GreenColor: '#77fb65',
65
+ YellowColor: '#f7b500',
64
66
  lastType: ''
65
67
  }
66
68
  },
67
69
  watch: {
68
70
  Data: {
69
71
  handler: function (val) {
70
- if (val.type === 4 && this.lastType === '') {
71
- // 绿闪：绿-》灰-》绿 循环效果
72
- this.GreenFlashColor = '#77fb65'
73
- this.GreenIntervalId = setInterval(() => {
74
- this.GreenFlashColor = !this.GreenFlashColor || this.GreenFlashColor === '#828282' ? '#77fb65' : '#828282'
75
- }, 500)
76
- this.lastType = val.type
72
+ if (this.lastType === '') {
73
+ if (val.type === 4 || val.control === 1) {
74
+ // 绿闪：绿-》灰-》绿 循环效果
75
+ let highlightColor = ''
76
+ if (val.type === 4) {
77
+ highlightColor = this.GreenColor
78
+ }
79
+ if (val.control === 1) {
80
+ highlightColor = this.YellowColor
81
+ }
82
+ this.FlashColor = highlightColor
83
+ this.GreenIntervalId = setInterval(() => {
84
+ this.FlashColor = !this.FlashColor || this.FlashColor === '#828282' ? highlightColor : '#828282'
85
+ }, 500)
86
+ this.lastType = val.type
87
+ }
77
88
  }
78
- if (this.GreenIntervalId && val.type !== 4 && val.type !== this.lastType) {
89
+ if (this.GreenIntervalId && val.type !== 4 && val.control !== 1 && val.type !== this.lastType) {
79
90
  clearInterval(this.GreenIntervalId)
80
- this.GreenFlashColor = undefined
91
+ this.FlashColor = undefined
81
92
  this.lastType = ''
82
93
  }
83
94
  },