openatc-components 0.5.72 → 0.5.74

package/package/kisscomps/components/SchemeConfig/manualControlModalNew/controlModelGroup.vue

@@ -1,131 +1,131 @@
-/**
- * Copyright (c) 2020 kedacom
- * OpenATC is licensed under Mulan PSL v2.
- * You can use this software according to the terms and conditions of the Mulan PSL v2.
- * You may obtain a copy of Mulan PSL v2 at:
- * http://license.coscl.org.cn/MulanPSL2
- * THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
- * EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
- * MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
- * See the Mulan PSL v2 for more details.
- **/
-<template>
-  <div class="control-model-group">
-    <div :class="className" class="group-control">
-      <div class="control-model" v-for="(item, index) in controllist" :key="index">
-
-        <template v-if="othersControl && specialControl.indexOf(item.id) !== -1">
-          <div class="single-model-new"
-            :style="{'backgroundColor': item.bgcolor}"
-            @click="selectModel(item)"
-            v-if="isHasPermission(item.permission) && (funcSort === 'allFunc' || (funcSort === 'thirdPartyFunc'&& thirdPartyControl.indexOf(item.id) !== -1))">
-            <div class="closephase-icon">
-              <OthersIconSvg :type="item.type" />
-            </div>
-            <div class="single-model-name-theme">{{item.iconName}}</div>
-          </div>
-        </template>
-
-        <template v-else>
-          <div class="single-model-new"
-          :style="{'backgroundColor': item.bgcolor}"
-          @click="selectModel(item)"
-          :class="preselecttype == item.type? 'single-model-select' : ''"
-          v-if="isHasPermission(item.permission) && (funcSort === 'allFunc' || (funcSort === 'thirdPartyFunc'&& thirdPartyControl.indexOf(item.id) !== -1))">
-          <!-- <svg-icon :icon-class="item.iconClass" className="model-icon"></svg-icon> -->
-          <div class="model-icon">
-            <IconSvg :type="item.type" />
-          </div>
-          <div class="single-model-name-theme">{{item.iconName}}</div>
-        </div>
-        </template>
-      </div>
-    </div>
-  </div>
-</template>
-
-<script>
-import { hasPermission, getTheme } from '../../../../utils/auth'
-
-import IconSvg from './icon.vue'
-import OthersIconSvg from './othersIcon.vue'
-
-export default {
-  name: 'ControlModelGroup',
-  components: {
-    IconSvg,
-    OthersIconSvg
-  },
-  props: {
-    className: {
-      type: String
-    },
-    controlList: {
-      type: Array
-    },
-    funcSort: {
-      type: String,
-      default: 'allFunc'
-    },
-    othersControl: {
-      type: Boolean,
-      default: false
-    },
-    thirdPartyControl: {
-      type: Array
-    }
-  },
-  data () {
-    return {
-      preselecttype: '',
-      controllist: [],
-      specialControl: [23, 24, 100]
-    }
-  },
-  computed: {
-  },
-  watch: {
-    controlList: {
-      handler (newVal, oldVal) {
-        this.controllist = JSON.parse(JSON.stringify(newVal))
-      },
-      deep: true
-    }
-  },
-  methods: {
-    isHasPermission (path) {
-      let res = hasPermission(path)
-      return res
-    },
-    selectModel (item) {
-      this.preselecttype = item.type
-      this.clickType(item)
-      if (this.specialControl.indexOf(item.id) !== -1) {
-        this.$emit('selectSpecialModel')
-      }
-      this.$emit('selectModel', item)
-    },
-    init () {
-      this.selectModel(this.controllist[0])
-    },
-    clickType (item) {
-      this.curTypeItem = item
-      for (let i = 0; i < this.controllist.length; i++) {
-        if (this.controllist[i].clicked) {
-          delete this.controllist[i].clicked
-          this.controllist[i].bgcolor = getTheme() === 'light' ? '#edf6ff' : '#243d59'
-        }
-      }
-      for (let i = 0; i < this.controllist.length; i++) {
-        if (this.controllist[i].type === item.type) {
-          this.controllist[i].clicked = true
-          this.controllist[i].bgcolor = getTheme() === 'light' ? '#c1e0ff' : '#0082ac'
-        }
-      }
-    }
-  },
-  mounted () {
-    this.controllist = JSON.parse(JSON.stringify(this.controlList))
-  }
-}
-</script>
+/**
+ * Copyright (c) 2020 kedacom
+ * OpenATC is licensed under Mulan PSL v2.
+ * You can use this software according to the terms and conditions of the Mulan PSL v2.
+ * You may obtain a copy of Mulan PSL v2 at:
+ * http://license.coscl.org.cn/MulanPSL2
+ * THIS SOFTWARE IS PROVIDED ON AN "AS IS" BASIS, WITHOUT WARRANTIES OF ANY KIND,
+ * EITHER EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO NON-INFRINGEMENT,
+ * MERCHANTABILITY OR FIT FOR A PARTICULAR PURPOSE.
+ * See the Mulan PSL v2 for more details.
+ **/
+<template>
+  <div class="control-model-group">
+    <div :class="className" class="group-control">
+      <div class="control-model" v-for="(item, index) in controllist" :key="index">
+
+        <template v-if="othersControl && specialControl.indexOf(item.id) !== -1">
+          <div class="single-model-new"
+            :style="{'backgroundColor': item.bgcolor}"
+            @click="selectModel(item)"
+            v-if="isHasPermission(item.permission) && (funcSort === 'allFunc' || (funcSort === 'thirdPartyFunc'&& thirdPartyControl.indexOf(item.id) !== -1))">
+            <div class="closephase-icon">
+              <OthersIconSvg :type="item.type" />
+            </div>
+            <div class="single-model-name-theme">{{item.iconName}}</div>
+          </div>
+        </template>
+
+        <template v-else>
+          <div class="single-model-new"
+          :style="{'backgroundColor': item.bgcolor}"
+          @click="selectModel(item)"
+          :class="preselecttype == item.type? 'single-model-select' : ''"
+          v-if="isHasPermission(item.permission) && (funcSort === 'allFunc' || (funcSort === 'thirdPartyFunc'&& thirdPartyControl.indexOf(item.id) !== -1))">
+          <!-- <svg-icon :icon-class="item.iconClass" className="model-icon"></svg-icon> -->
+          <div class="model-icon">
+            <IconSvg :type="item.type" />
+          </div>
+          <div class="single-model-name-theme">{{item.iconName}}</div>
+        </div>
+        </template>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { hasPermission, getTheme } from '../../../../utils/auth'
+
+import IconSvg from './icon.vue'
+import OthersIconSvg from './othersIcon.vue'
+
+export default {
+  name: 'ControlModelGroup',
+  components: {
+    IconSvg,
+    OthersIconSvg
+  },
+  props: {
+    className: {
+      type: String
+    },
+    controlList: {
+      type: Array
+    },
+    funcSort: {
+      type: String,
+      default: 'allFunc'
+    },
+    othersControl: {
+      type: Boolean,
+      default: false
+    },
+    thirdPartyControl: {
+      type: Array
+    }
+  },
+  data () {
+    return {
+      preselecttype: '',
+      controllist: [],
+      specialControl: [23, 24, 100]
+    }
+  },
+  computed: {
+  },
+  watch: {
+    controlList: {
+      handler (newVal, oldVal) {
+        this.controllist = JSON.parse(JSON.stringify(newVal))
+      },
+      deep: true
+    }
+  },
+  methods: {
+    isHasPermission (path) {
+      let res = hasPermission(path)
+      return res
+    },
+    selectModel (item) {
+      this.preselecttype = item.type
+      this.clickType(item)
+      if (this.specialControl.indexOf(item.id) !== -1) {
+        this.$emit('selectSpecialModel')
+      }
+      this.$emit('selectModel', item)
+    },
+    init () {
+      this.selectModel(this.controllist[0])
+    },
+    clickType (item) {
+      this.curTypeItem = item
+      for (let i = 0; i < this.controllist.length; i++) {
+        if (this.controllist[i].clicked) {
+          delete this.controllist[i].clicked
+          this.controllist[i].bgcolor = getTheme() === 'light' ? '#edf6ff' : '#243d59'
+        }
+      }
+      for (let i = 0; i < this.controllist.length; i++) {
+        if (this.controllist[i].type === item.type) {
+          this.controllist[i].clicked = true
+          this.controllist[i].bgcolor = getTheme() === 'light' ? '#c1e0ff' : '#0082ac'
+        }
+      }
+    }
+  },
+  mounted () {
+    this.controllist = JSON.parse(JSON.stringify(this.controlList))
+  }
+}
+</script>

package/package/kisscomps/components/SchemeConfig/manualControlModalNew/index.vue

@@ -41,13 +41,19 @@
 
         <div class="stage-part" v-if="preselecttype === '阶段锁定'">
           <div class="stage-label">{{$t('openatccomponents.overview.stage')}}</div>
-          <div style="width: 100%; height: auto;overflow: hidden;" v-if="isHasPermission('configer:manual:dwell')">
-            <Stages :crossStatusData="manuals?manualsStage:realtimeStage"
-                    :phaseList="phaseList"
-                    :preselectStages="preselectStages"
-                    :preselectModel="preselectModel"
-                    :isShowCurrentStage="false"
-                    @onSelectStages="selectStages"></Stages>
+          <div style="width: 100%; height: auto;overflow: hidden;display: flex;align-items: center;" v-if="isHasPermission('configer:manual:dwell')">
+            <div style="flex: 1;">
+              <Stages :crossStatusData="manuals?manualsStage:realtimeStage"
+                      :phaseList="phaseList"
+                      :preselectStages="preselectStages"
+                      :preselectModel="preselectModel"
+                      :isShowCurrentStage="false"
+                      @onSelectStages="selectStages"></Stages>
+            </div>
+            <div style="display: flex;gap: 10px;margin-left: 15px;">
+              <div class="single-model stage-btn stage-btn-extend" @click="selectStages(998)" :class="preselectStages === 998 ? 'stage-btn-active' : ''">延长</div>
+              <div class="single-model stage-btn stage-btn-shorten" @click="selectStages(999)" :class="preselectStages === 999 ? 'stage-btn-active' : ''">缩短</div>
+            </div>
           </div>
         </div>
 

package/package/kisscomps/components/SchemeConfig/manualControlModalNew/othersIcon.vue

@@ -1,151 +1,151 @@
-<!-- eslint-disable vue/valid-v-bind -->
-<!-- eslint-disable no-mixed-spaces-and-tabs -->
-<!-- eslint-disable no-tabs -->
-/** * Copyright (c) 2020 kedacom * OpenATC is licensed under Mulan PSL v2. * You
-can use this software according to the terms and conditions of the Mulan PSL v2.
-* You may obtain a copy of Mulan PSL v2 at: *
-http://license.coscl.org.cn/MulanPSL2 * THIS SOFTWARE IS PROVIDED ON AN "AS IS"
-BASIS, WITHOUT WARRANTIES OF ANY KIND, * EITHER EXPRESS OR IMPLIED, INCLUDING
-BUT NOT LIMITED TO NON-INFRINGEMENT, * MERCHANTABILITY OR FIT FOR A PARTICULAR
-PURPOSE. * See the Mulan PSL v2 for more details. **/
-<template>
-  <span class="others-icon-svg">
-    <svg
-      v-if="type === '相位关断'"
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 54 29.1"
-      :width="iconWidth"
-      :height="iconHeight"
-    >
-    <g :class="themeColor">
-      <rect y="15.8" class="st0" width="32.4" height="9"/>
-      <rect x="32.3" y="15.8" class="st3" width="21.7" height="9"/>
-      <rect x="32.3" y="11.3" class="st3" width="1.7" height="17.7"/>
-      <g>
-        <path class="st4" d="M29.2,0.4l8,8L29.2,0.4z"/>
-        <path class="st4" d="M37.2,0.4l-8,8L37.2,0.4z"/>
-      </g>
-    </g>
-    </svg>
-    <svg
-      v-if="type === '临时方案'"
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 54 29.1"
-      :width="iconWidth"
-      :height="iconHeight"
-    >
-    <g :class="themeColor">
-      <rect id="矩形_683_拷贝_3" x="0" y="15.8" class="st0" width="39" height="9"/>
-      <rect id="矩形_683_拷贝_3-2" x="39" y="15.8" class="st1" width="8" height="9"/>
-      <rect id="矩形_686_拷贝_4" x="37" y="15.8" class="st2" width="1" height="9"/>
-      <rect id="矩形_686_拷贝_4-2" x="35" y="15.8" class="st2" width="1" height="9"/>
-      <rect id="矩形_686_拷贝_4-3" x="33" y="15.8" class="st2" width="1" height="9"/>
-      <rect id="矩形_686_拷贝_4-4" x="31" y="15.8" class="st2" width="1" height="9"/>
-      <rect id="矩形_683_拷贝_3-3" x="46" y="15.8" class="st3" width="8" height="9"/>
-    </g>
-    </svg>
-    <svg
-      v-if="type === '优先控制'"
-      xmlns="http://www.w3.org/2000/svg"
-      viewBox="0 0 54 29.12"
-      :width="iconWidth"
-      :height="iconHeight"
-    >
-      <g id="图层_2" data-name="图层 2">
-        <g id="图层_3" data-name="图层 3" :class="themeColor">
-          <rect
-            id="矩形_3708_拷贝_8"
-            data-name="矩形 3708 拷贝 8"
-            class="cls-1"
-            x="20.6"
-            y="15.81"
-            width="33.4"
-            height="9"
-          />
-          <rect
-            id="矩形_3708_拷贝_8-2"
-            data-name="矩形 3708 拷贝 8"
-            class="cls-2"
-            y="15.81"
-            width="20.78"
-            height="9"
-          />
-          <path
-            id="形状_3710_拷贝_4"
-            data-name="形状 3710 拷贝 4"
-            class="cls-4"
-            d="M2441.42,1012.4h1.8v17.71h-1.8V1012.4Z"
-            transform="translate(-2421.31 -1001)"
-          />
-          <path
-            id="形状_2767_拷贝_5"
-            data-name="形状 2767 拷贝 5"
-            class="cls-4"
-            d="M2434,1007.87a1.582,1.582,0,1,0,1.39,1.57A1.491,1.491,0,0,0,2434,1007.87Zm0,2.67a1.109,1.109,0,1,1,.97-1.1A1.037,1.037,0,0,1,2434,1010.54Zm13.69-2.67a1.58,1.58,0,1,0,1.4,1.57A1.491,1.491,0,0,0,2447.69,1007.87Zm0,2.67a1.107,1.107,0,1,1,.98-1.1A1.043,1.043,0,0,1,2447.69,1010.54Zm4.59-9.55h-22.21a1.517,1.517,0,0,0-1.42,1.6v2.77l-0.65.33v3.14a0.494,0.494,0,0,0,.46.52h3.67a1.876,1.876,0,1,1,3.74,0h9.95a1.88,1.88,0,1,1,3.75,0h1.24c1.19-.32,3.23-0.87,4.19-1.11v-4.2A2.9,2.9,0,0,0,2452.28,1000.99Zm-20.84,6.96a0.571,0.571,0,0,1-.53.6h-0.82a0.572,0.572,0,0,1-.54-0.6v-5.09a0.575,0.575,0,0,1,.54-0.61h0.82a0.574,0.574,0,0,1,.53.61v5.09Zm5.69-3.41a0.381,0.381,0,0,1-.36.4h-3.96a0.38,0.38,0,0,1-.35-0.4v-1.91a0.38,0.38,0,0,1,.35-0.4h3.96a0.381,0.381,0,0,1,.36.4v1.91Zm5.38,0a0.381,0.381,0,0,1-.36.4h-3.96a0.38,0.38,0,0,1-.35-0.4v-1.91a0.38,0.38,0,0,1,.35-0.4h3.96a0.381,0.381,0,0,1,.36.4v1.91Zm5.38,0a0.38,0.38,0,0,1-.35.4h-3.96a0.381,0.381,0,0,1-.36-0.4v-1.91a0.381,0.381,0,0,1,.36-0.4h3.96a0.38,0.38,0,0,1,.35.4v1.91Zm5.38,0a0.38,0.38,0,0,1-.35.4h-3.96a0.381,0.381,0,0,1-.36-0.4v-1.91a0.381,0.381,0,0,1,.36-0.4h3.96a0.38,0.38,0,0,1,.35.4v1.91Z"
-            transform="translate(-2421.31 -1001)"
-          />
-        </g>
-      </g>
-    </svg>
-  </span>
-</template>
-
-<script>
-import { getTheme } from '../../../../utils/auth.js'
-
-export default {
-  name: 'OthersIconSvg',
-  data () {
-    return {
-      themeColor: '',
-      iconWidth: '56',
-      iconHeight: '24'
-    }
-  },
-  components: {},
-  props: {
-    type: {
-      type: String
-    }
-  },
-  watch: {},
-  methods: {},
-  mounted () {
-    this.themeColor = getTheme() === 'dark' ? 'darkBorder' : 'lightBorder'
-  }
-}
-</script>
-
-<style lang="scss" rel="stylesheet/scss" scoped>
-.lightBorder {
-  fill: #515151;
-}
-.darkBorder {
-  fill: #e6f9ff;
-}
-.cls-1, .cls-4 {
-  fill: #7ccc66;
-}
-.cls-2 {
-  fill: #f27979;
-}
-.cls-3 {
-  fill: none;
-  stroke: #f27979;
-  stroke-miterlimit: 10;
-}
-.cls-4 {
-  fill-rule: evenodd;
-}
-.cls-5 {
-        fill: #f9dc6a;
-      }
-      .cls-6 {
-        fill: #fff;
-      }
-.st0{fill:#7CCC66;}
-.st1{fill:#F9DC6A;}
-.st2{fill:#FFFFFF;}
-.st3{fill:#F27979;}
-.st4{fill:none;stroke:#F27979;stroke-width:1.1979;stroke-miterlimit:10;}
-</style>
+<!-- eslint-disable vue/valid-v-bind -->
+<!-- eslint-disable no-mixed-spaces-and-tabs -->
+<!-- eslint-disable no-tabs -->
+/** * Copyright (c) 2020 kedacom * OpenATC is licensed under Mulan PSL v2. * You
+can use this software according to the terms and conditions of the Mulan PSL v2.
+* You may obtain a copy of Mulan PSL v2 at: *
+http://license.coscl.org.cn/MulanPSL2 * THIS SOFTWARE IS PROVIDED ON AN "AS IS"
+BASIS, WITHOUT WARRANTIES OF ANY KIND, * EITHER EXPRESS OR IMPLIED, INCLUDING
+BUT NOT LIMITED TO NON-INFRINGEMENT, * MERCHANTABILITY OR FIT FOR A PARTICULAR
+PURPOSE. * See the Mulan PSL v2 for more details. **/
+<template>
+  <span class="others-icon-svg">
+    <svg
+      v-if="type === '相位关断'"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 54 29.1"
+      :width="iconWidth"
+      :height="iconHeight"
+    >
+    <g :class="themeColor">
+      <rect y="15.8" class="st0" width="32.4" height="9"/>
+      <rect x="32.3" y="15.8" class="st3" width="21.7" height="9"/>
+      <rect x="32.3" y="11.3" class="st3" width="1.7" height="17.7"/>
+      <g>
+        <path class="st4" d="M29.2,0.4l8,8L29.2,0.4z"/>
+        <path class="st4" d="M37.2,0.4l-8,8L37.2,0.4z"/>
+      </g>
+    </g>
+    </svg>
+    <svg
+      v-if="type === '临时方案'"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 54 29.1"
+      :width="iconWidth"
+      :height="iconHeight"
+    >
+    <g :class="themeColor">
+      <rect id="矩形_683_拷贝_3" x="0" y="15.8" class="st0" width="39" height="9"/>
+      <rect id="矩形_683_拷贝_3-2" x="39" y="15.8" class="st1" width="8" height="9"/>
+      <rect id="矩形_686_拷贝_4" x="37" y="15.8" class="st2" width="1" height="9"/>
+      <rect id="矩形_686_拷贝_4-2" x="35" y="15.8" class="st2" width="1" height="9"/>
+      <rect id="矩形_686_拷贝_4-3" x="33" y="15.8" class="st2" width="1" height="9"/>
+      <rect id="矩形_686_拷贝_4-4" x="31" y="15.8" class="st2" width="1" height="9"/>
+      <rect id="矩形_683_拷贝_3-3" x="46" y="15.8" class="st3" width="8" height="9"/>
+    </g>
+    </svg>
+    <svg
+      v-if="type === '优先控制'"
+      xmlns="http://www.w3.org/2000/svg"
+      viewBox="0 0 54 29.12"
+      :width="iconWidth"
+      :height="iconHeight"
+    >
+      <g id="图层_2" data-name="图层 2">
+        <g id="图层_3" data-name="图层 3" :class="themeColor">
+          <rect
+            id="矩形_3708_拷贝_8"
+            data-name="矩形 3708 拷贝 8"
+            class="cls-1"
+            x="20.6"
+            y="15.81"
+            width="33.4"
+            height="9"
+          />
+          <rect
+            id="矩形_3708_拷贝_8-2"
+            data-name="矩形 3708 拷贝 8"
+            class="cls-2"
+            y="15.81"
+            width="20.78"
+            height="9"
+          />
+          <path
+            id="形状_3710_拷贝_4"
+            data-name="形状 3710 拷贝 4"
+            class="cls-4"
+            d="M2441.42,1012.4h1.8v17.71h-1.8V1012.4Z"
+            transform="translate(-2421.31 -1001)"
+          />
+          <path
+            id="形状_2767_拷贝_5"
+            data-name="形状 2767 拷贝 5"
+            class="cls-4"
+            d="M2434,1007.87a1.582,1.582,0,1,0,1.39,1.57A1.491,1.491,0,0,0,2434,1007.87Zm0,2.67a1.109,1.109,0,1,1,.97-1.1A1.037,1.037,0,0,1,2434,1010.54Zm13.69-2.67a1.58,1.58,0,1,0,1.4,1.57A1.491,1.491,0,0,0,2447.69,1007.87Zm0,2.67a1.107,1.107,0,1,1,.98-1.1A1.043,1.043,0,0,1,2447.69,1010.54Zm4.59-9.55h-22.21a1.517,1.517,0,0,0-1.42,1.6v2.77l-0.65.33v3.14a0.494,0.494,0,0,0,.46.52h3.67a1.876,1.876,0,1,1,3.74,0h9.95a1.88,1.88,0,1,1,3.75,0h1.24c1.19-.32,3.23-0.87,4.19-1.11v-4.2A2.9,2.9,0,0,0,2452.28,1000.99Zm-20.84,6.96a0.571,0.571,0,0,1-.53.6h-0.82a0.572,0.572,0,0,1-.54-0.6v-5.09a0.575,0.575,0,0,1,.54-0.61h0.82a0.574,0.574,0,0,1,.53.61v5.09Zm5.69-3.41a0.381,0.381,0,0,1-.36.4h-3.96a0.38,0.38,0,0,1-.35-0.4v-1.91a0.38,0.38,0,0,1,.35-0.4h3.96a0.381,0.381,0,0,1,.36.4v1.91Zm5.38,0a0.381,0.381,0,0,1-.36.4h-3.96a0.38,0.38,0,0,1-.35-0.4v-1.91a0.38,0.38,0,0,1,.35-0.4h3.96a0.381,0.381,0,0,1,.36.4v1.91Zm5.38,0a0.38,0.38,0,0,1-.35.4h-3.96a0.381,0.381,0,0,1-.36-0.4v-1.91a0.381,0.381,0,0,1,.36-0.4h3.96a0.38,0.38,0,0,1,.35.4v1.91Zm5.38,0a0.38,0.38,0,0,1-.35.4h-3.96a0.381,0.381,0,0,1-.36-0.4v-1.91a0.381,0.381,0,0,1,.36-0.4h3.96a0.38,0.38,0,0,1,.35.4v1.91Z"
+            transform="translate(-2421.31 -1001)"
+          />
+        </g>
+      </g>
+    </svg>
+  </span>
+</template>
+
+<script>
+import { getTheme } from '../../../../utils/auth.js'
+
+export default {
+  name: 'OthersIconSvg',
+  data () {
+    return {
+      themeColor: '',
+      iconWidth: '56',
+      iconHeight: '24'
+    }
+  },
+  components: {},
+  props: {
+    type: {
+      type: String
+    }
+  },
+  watch: {},
+  methods: {},
+  mounted () {
+    this.themeColor = getTheme() === 'dark' ? 'darkBorder' : 'lightBorder'
+  }
+}
+</script>
+
+<style lang="scss" rel="stylesheet/scss" scoped>
+.lightBorder {
+  fill: #515151;
+}
+.darkBorder {
+  fill: #e6f9ff;
+}
+.cls-1, .cls-4 {
+  fill: #7ccc66;
+}
+.cls-2 {
+  fill: #f27979;
+}
+.cls-3 {
+  fill: none;
+  stroke: #f27979;
+  stroke-miterlimit: 10;
+}
+.cls-4 {
+  fill-rule: evenodd;
+}
+.cls-5 {
+        fill: #f9dc6a;
+      }
+      .cls-6 {
+        fill: #fff;
+      }
+.st0{fill:#7CCC66;}
+.st1{fill:#F9DC6A;}
+.st2{fill:#FFFFFF;}
+.st3{fill:#F27979;}
+.st4{fill:none;stroke:#F27979;stroke-width:1.1979;stroke-miterlimit:10;}
+</style>