Browse Source

单选维护bug修改

zhouna 6 năm trước cách đây
mục cha
commit
082c912073
2 tập tin đã thay đổi với 47 bổ sung67 xóa
  1. 8 14
      src/api/utils.js
  2. 39 53
      src/components/icss/SingleSelect.vue

+ 8 - 14
src/api/utils.js

@@ -151,21 +151,15 @@ export default {
    * 单选数据转换提交
    * **/
   simpleOptionData(data){
-    const {options,defaultCheckeds,sameToNones,sameToBans} = data;
-    let defaultSelect = '0';
-    let arr=[];
-    options.forEach((it,i)=>{
-      if(it){
-        let code='';
-        defaultSelect = +defaultCheckeds[0]===i?'1':'0';
-        if(+sameToNones[0]===i){
-          code='2';
-        }
-        if(+sameToBans[0] === i){
-          code = '1';
-        }
-        arr.push({name:it,defaultSelect,code,remark:'单选'});
+    let arr = data.map((it,i)=>{
+      let code = '';
+      if(it.isNone){
+        code = '2';
+      }
+      if(it.isBan){
+        code = '1';
       }
+      return {name:it.name,defaultSelect:it.defaultSelect?'1':'0',code,remark:'单选项-'+it.name}
     });
     return arr;
   }

+ 39 - 53
src/components/icss/SingleSelect.vue

@@ -1,22 +1,22 @@
 <template>
     <div class="single-container">
-        <el-form :model="form">
+        <el-form>
             <div class="operation-row">
-                <el-checkbox-group size="small" v-model="form.defaultCheckeds" @change="emitValues">
-                    <el-checkbox-button v-for="(it,i) in rows" v-if="focusOn==i||(focusOn==-1&&i==0)" :key="i" :label="i" :disabled="(form.defaultCheckeds[0]!=undefined&&form.defaultCheckeds[0]!=i)||form.sameToNones[0]==i||form.sameToBans[0]==i">默认选中</el-checkbox-button>
+                <el-checkbox-group size="small" v-for="(it,i) in rows" v-if="focusOn==i||(focusOn==-1&&i==0)" :key="1+i" v-model="rows[i].defaultSelect" @change="emitValues(i,'hasDefault',rows[i].defaultSelect)">
+                    <el-checkbox-button :label="i" :disabled="hasNone==i||hasBan==i||(hasDefault!=-1&&hasDefault!=i)">默认选中</el-checkbox-button>
                 </el-checkbox-group>
-                <el-checkbox-group size="small" v-model="form.sameToNones" @change="emitValues">
-                    <el-checkbox-button v-for="(it,i) in rows" v-if="focusOn==i||(focusOn==-1&&i==0)" :key="i" :label="i" :disabled="(form.sameToNones[0]!=undefined&&form.sameToNones[0]!=i)||form.defaultCheckeds[0]==i||form.sameToBans[0]==i">同“无”类型</el-checkbox-button>
+                <el-checkbox-group size="small" v-for="(it,i) in rows" v-if="focusOn==i||(focusOn==-1&&i==0)" :key="2+i" v-model="rows[i].isNone" @change="emitValues(i,'hasNone',rows[i].isNone)">
+                    <el-checkbox-button :label="i" :disabled="hasDefault==i||hasBan==i||(hasNone!=-1&&hasNone!=i)">同“无”类型</el-checkbox-button>
                 </el-checkbox-group>
-                <el-checkbox-group size="small" v-model="form.sameToBans" @change="emitValues">
-                    <el-checkbox-button v-for="(it,i) in rows" v-if="focusOn==i||(focusOn==-1&&i==0)" :key="i" :label="i" :disabled="(form.sameToBans[0]!=undefined&&form.sameToBans[0]!=i)||form.sameToNones[0]==i||form.defaultCheckeds[0]==i">同“伴”类型</el-checkbox-button>
+                <el-checkbox-group size="small" v-for="(it,i) in rows" v-if="focusOn==i||(focusOn==-1&&i==0)" :key="3+i" v-model="rows[i].isBan" @change="emitValues(i,'hasBan',rows[i].isBan)">
+                    <el-checkbox-button :label="i" :disabled="hasDefault==i||hasNone==i||(hasBan!=-1&&hasBan!=i)">同“伴”类型</el-checkbox-button>
                 </el-checkbox-group>
                 <el-button type="danger" size="small" class="del" @click="delRow">删除</el-button>
             </div>
             <div class="main-area">
                 <el-input v-for="(it,i) in rows"
                           :key="i"
-                          v-model="form.options[i]"
+                          v-model="rows[i].name"
                           v-bind:class="{select:focusOn==i}"
                           @focus="selectRow(i)"
                           @blur="emitValues"></el-input>
@@ -73,65 +73,52 @@
     }
 </style>
 <script>
-    import utils from '@api/utils';
+  import utils from '@api/utils.js';
     export default {
       props:['type'],
       data(){
         return {
-          argus:['defaultCheckeds','sameToNones','sameToBans'],
-          form:{
-            options:[],
-            defaultCheckeds:[],
-            sameToNones:[],
-            sameToBans:[]
-          },
-          rows:[{},{},{},{}],
+          rows:[{name:'',defaultSelect:'',isBan:'',isNone:''},{name:'',defaultSelect:'',isBan:'',isNone:''},{name:'',defaultSelect:'',isBan:'',isNone:''},{name:'',defaultSelect:'',isBan:'',isNone:''}],
           focusOn:-1
         }
       },
-      /*computed:{
-        isDisable:function(){               //属性按钮是否可用
-          return function(type,i){
-            if(this.form[type][0]!=undefined&&this.form[type][0]!=i){
-              return true;
-            }
-            if(this.form[type][0] == i){
-              return false;
-            }
-            for(let x=0;x<this.argus.length;x++){
-              if([...this.form.defaultCheckeds,...this.form.sameToNones,...this.form.sameToBans].length==0||this.form[this.argus[x]][0]==i){
-                return false;
-              }else{
-                return true;
-              }
-              }
-
-            return false;
-          }
+      computed:{
+        hasDefault:function(){               //是否有选项默认选中
+          let index =this.rows.findIndex((it)=>{
+            return it.defaultSelect;
+          });console.log(index)
+          return index;
+        },
+        hasNone:function(){                 //是否有选项同无
+          let index =this.rows.findIndex((it)=>{
+            return it.isNone;
+          });
+          return index;
+        },
+        hasBan:function(){                  //是否有选项同伴
+          let index =this.rows.findIndex((it)=>{
+            return it.isBan;
+          });
+          return index;
         }
-      },*/
+      },
       methods:{
-        setValues(name){
-          if(this.focusOn==-1){
-            this[name] = false;
-            this.$message({
-              message: '请先选择要操作的行',
-              type: 'warning'
-            });
-            return;
-          }
-          this.form[name]=this[name]?this.focusOn:-1;
-          this.emitValues();
-        },
         addRow(){
-          this.rows.push({});
+          this.rows.push({name:'',defaultSelect:'',isBan:'',isNone:''});
         },
         selectRow(index){
           this.focusOn = index;
 
         },
-        emitValues(){
-          const items = utils.simpleOptionData(this.form);console.log(111,items)
+        emitValues(i,type,flag){
+          if(typeof i =='number'&&this.focusOn == -1){
+            this.$message({
+              message: '请先选择要操作的行',
+              type: 'warning'
+            });
+            return;
+          }
+          const items = utils.simpleOptionData(this.rows);
           this.$emit('pushValues',items);
         },
         delRow(){
@@ -146,7 +133,6 @@
             confirmButtonText: '确定',
             type: 'warning'
           }).then(() => {
-            this.form.options.splice(this.focusOn,1);
             this.rows.splice(this.focusOn,1);
             this.focusOn = -1;
             this.emitValues();