Browse Source

feat:修复输入框部分样式失效问题

liu.shiyi 1 year ago
parent
commit
1947faba5f

+ 22 - 13
data-room-ui/packages/BasicComponents/Input/index.vue

@@ -48,26 +48,33 @@ export default {
   data () {
     return { }
   },
+  watch: {
+    'config.customize.value': {
+      handler (val) {
+        this.$store.commit('bigScreen/changeActiveItemConfig', { ...this.config, customize: { ...this.config.customize, value: this.config.customize.value } })
+      }
+    }
+  },
   mounted () {
     this.chartInit()
-    this.updateComponent()
+    // this.changeStyle()
   },
   methods: {
-    updateComponent () {
-      const input = document.querySelector(`#el-input-${this.config.code}`)
+    changeStyle (config) {
+      const input = document.querySelector(`#el-input-${config.code}`)
 
       // const inputIcon = input.querySelector(`.${this.config.customize.icon.name}`)
-      input.style.backgroundColor = this.config.customize.backgroundStyle.backgroundColor
-      input.style.fontSize = this.config.customize.inputStyle.fontSize + 'px'
-      input.style.color = this.config.customize.inputStyle.color
-      input.style.borderColor = this.config.customize.borderStyle.borderColor
-      input.style.borderWidth = this.config.customize.borderStyle.borderWidth + 'px'
-      input.style.borderStyle = this.config.customize.borderStyle.borderStyle
-      input.style.borderRadius = this.config.customize.borderStyle.borderRadius + 'px'
+      input.style.backgroundColor = config.customize.backgroundStyle.backgroundColor
+      input.style.fontSize = config.customize.inputStyle.fontSize + 'px'
+      input.style.color = config.customize.inputStyle.color
+      input.style.borderColor = config.customize.borderStyle.borderColor
+      input.style.borderWidth = config.customize.borderStyle.borderWidth + 'px'
+      input.style.borderStyle = config.customize.borderStyle.borderStyle
+      input.style.borderRadius = config.customize.borderStyle.borderRadius + 'px'
       // inputIcon.style.fontSize = this.config.customize.inputStyle.fontSize + 'px'
-      if (this.config.customize.icon.name) {
-        const inputIcon = document.querySelector(`.${this.config.customize.icon.name}`)
-        inputIcon.style.fontSize = this.config.customize.inputStyle.fontSize + 'px'
+      if (config.customize.icon.name) {
+        const inputIcon = document.querySelector(`.${config.customize.icon.name}`)
+        inputIcon.style.fontSize = config.customize.inputStyle.fontSize + 'px'
       }
     }
   }
@@ -96,6 +103,8 @@ export default {
     ::v-deep .el-input__inner {
       height: 100%;
       width: 100%;
+      background-color:#151a26;
+      border: 1px solid #DCDFE6;
     }
   }
 

+ 7 - 7
data-room-ui/packages/BigScreenDesign/RightSetting/G2CustomSetting.vue

@@ -231,15 +231,15 @@ export default {
       // 1、原数组,2、修改后的数组只包含custom,3、合并的时候xy的配置必须放在最前面
       handler (val) {
         const setList = [].concat(...val.map(item => item.list))
-        const newSetList =  [...this.config.setting,...setList]
-        let newArr = []; //存新数组
-        let hash={}
-        newArr=  newSetList.reduce(function (acc, cru,index) {
-          if (!hash[cru['field']]) {
-            hash[cru['field']] = { index: index }
+        const newSetList = [...this.config.setting, ...setList]
+        let newArr = [] // 存新数组
+        const hash = {}
+        newArr = newSetList.reduce(function (acc, cru, index) {
+          if (!hash[cru.field]) {
+            hash[cru.field] = { index: index }
             acc.push(cru)
           } else {
-            acc.splice(hash[cru['field']]['index'], 1, cru)
+            acc.splice(hash[cru.field].index, 1, cru)
           }
           return acc
         }, [])