| <template> | 
|   <li v-if="element && element.key" :class="{active: selectWidget && selectWidget.key == element.key}" class="item" @click.stop="handleSelectWidget(index)"> | 
|     <i class="handle el-icon-yrt-yidong1"></i> | 
|     <span>{{ element.label }}</span> | 
|     <el-button v-if="selectWidget && selectWidget.key == element.key" type="text" title="删除" size="mini" @click.stop="handleWidgetDelete(index)"> | 
|       <i class="el-icon-yrt-shanchu2"></i> | 
|     </el-button> | 
|     <el-button v-if="selectWidget && selectWidget.key == element.key" type="text" title="复制" size="mini" @click.stop="handleWidgetClone(index)"> | 
|       <i class="el-icon-yrt-fuzhi4"></i> | 
|     </el-button> | 
|     <div class="right-tool"> | 
|       <el-input v-model="element.searchRowNo" placeholder="查询顺序(大于0显示)" class="w-100" size="mini"></el-input> | 
|       <el-switch v-model="element.hidden" :active-value="false" :inactive-value="true" active-text="显示" inactive-text="隐藏"> | 
|       </el-switch> | 
|     </div> | 
|   </li> | 
| </template> | 
|   | 
| <script> | 
| import FmUpload from "./Upload"; | 
| export default { | 
|   components: { | 
|     FmUpload | 
|   }, | 
|   props: { | 
|     element: { | 
|       type: Object, | 
|       default: () => { | 
|         return {}; | 
|       } | 
|     }, | 
|     select: { | 
|       type: Object, | 
|       default: () => { | 
|         return {}; | 
|       } | 
|     }, | 
|     index: { | 
|       type: Number, | 
|       default: null | 
|     }, | 
|     fields: { | 
|       type: Array, | 
|       default: () => { | 
|         return []; | 
|       } | 
|     }, | 
|     configType: { | 
|       type: String, | 
|       default: null | 
|     } | 
|   }, | 
|   data() { | 
|     return { | 
|       selectWidget: this.select | 
|     }; | 
|   }, | 
|   watch: { | 
|     select(val) { | 
|       this.selectWidget = val; | 
|     }, | 
|     selectWidget: { | 
|       handler(val) { | 
|         this.$emit("update:select", val); | 
|       }, | 
|       deep: true | 
|     } | 
|   }, | 
|   methods: { | 
|     handleSelectWidget(index) { | 
|       this.selectWidget = this.fields[index]; | 
|       this.$emit("update:configType", "ManagerConfig"); | 
|     }, | 
|     handleWidgetDelete(index) { | 
|       if (this.fields.length - 1 === index) { | 
|         if (index === 0) { | 
|           this.selectWidget = {}; | 
|         } else { | 
|           this.selectWidget = this.fields[index - 1]; | 
|         } | 
|       } else { | 
|         this.selectWidget = this.fields[index + 1]; | 
|       } | 
|   | 
|       this.$nextTick(() => { | 
|         this.fields.splice(index, 1); | 
|       }); | 
|     }, | 
|     handleWidgetClone(index) { | 
|       const cloneData = { | 
|         ...this.fields[index], | 
|         key: Date.parse(new Date()) + "_" + Math.ceil(Math.random() * 99999) | 
|       }; | 
|   | 
|       this.fields.splice(index, 0, cloneData); | 
|   | 
|       this.$nextTick(() => { | 
|         this.selectWidget = this.fields[index + 1]; | 
|       }); | 
|     } | 
|   } | 
| }; | 
| </script> |