tab切换组件

applications/dee-mes/src/privateComponents/components/UnqualifiedSearch/config.js

+export default {
+  props: {},
+  layoutConfigData: [
+    {
+      title: '高级组件配置',
+      data: [
+        {
+          key: 'searchAttrModel',
+          title: '搜索模型',
+          width: 1,
+          component: {
+            defaultValue: 'JobResponseInExperment',
+            name: 'readable',
+            type: 'textarea',
+            rows: '2'
+          }
+        },
+        {
+          key: 'searchAttrModel',
+          title: '搜索模型',
+          component: {
+            defaultValue: 'JobResponseInExperment',
+            name: 'el-input'
+          }
+        },
+        {
+          key: 'searchAttrNumber',
+          title: '搜索编号',
+          component: {
+            defaultValue: 'JobResponseInExpermentQuery',
+            name: 'el-input'
+          }
+        },
+        {
+          key: 'attrTab1Name',
+          title: 'TAB1名称',
+          component: {
+            defaultValue: '试验',
+            name: 'el-input'
+          }
+        },
+        {
+          key: 'attrTab1Model',
+          title: 'TAB1模型',
+          component: {
+            defaultValue: 'JobResponseInExperment',
+            name: 'el-input'
+          }
+        },
+        {
+          key: 'attrTab1Number',
+          title: 'TAB1编号',
+          component: {
+            defaultValue: 'unqualified_Table',
+            name: 'el-input'
+          }
+        },
+        {
+          key: 'attrTab2Name',
+          title: 'TAB2名称',
+          component: {
+            defaultValue: '不合格品',
+            name: 'el-input'
+          }
+        },
+        {
+          key: 'attrTab2Model',
+          title: 'TAB2模型',
+          component: {
+            defaultValue: 'JobResponseInTest',
+            name: 'el-input'
+          }
+        },
+        {
+          key: 'attrTab2Number',
+          title: 'TAB2编号',
+          component: {
+            defaultValue: 'unqualified_Table',
+            name: 'el-input',
+            type: 'textarea',
+            rows: '2'
+          }
+        }
+      ]
+    }
+  ],
+  data() {
+    return {
+    }
+  },
+  created() {
+  },
+  computed: {
+
+  },
+  methods: {
+
+  }
+}
+

applications/dee-mes/src/privateComponents/components/UnqualifiedSearch/index.vue

+/**
+* @Description:  双TAB切换
+* @author xioln
+* @date 2023-10-25
+* @FilePath: applications/dee-mes/src/privateComponents/components/UnqualifiedSearch/index.vue
+*/
+<template>
+  <div class="unqualifie-search">
+    <dee-as-com
+      ref="deeSearch"
+      :lay-config="serchOptions"
+      @searchEvent="searchEvent"
+    />
+    <dee-tab
+      ref="deetab"
+      class="dee-tab"
+      :tabs="tabs"
+      @tabClick="tabClick"
+    >
+      <div slot="1">
+        <dee-as-com
+          ref="deetab1"
+          :lay-config="tab1Options"
+        />
+      </div>
+      <div slot="2">
+        <dee-as-com
+          ref="deetab2"
+          :lay-config="tab2Options"
+        />
+      </div>
+    </dee-tab>
+  </div>
+</template>
+<script>
+import config from './config'
+// import _get from 'lodash.get'
+
+export default {
+  componentName: 'TAB切换',
+  name: 'UnqualifiedSearch',
+  components: {},
+  mixins: [config],
+  props: {
+    itemObj: {
+      type: Object,
+      default: null
+    }
+  },
+  data() {
+    return {
+      tabs: [
+        { id: '1', name: '' },
+        { id: '2', name: '' }
+      ],
+      serchOptions: {
+        typeName: '',
+        layKey: ''
+      },
+      tab1Options: {
+        typeName: '',
+        layKey: ''
+      },
+      tab2Options: {
+        typeName: '',
+        layKey: ''
+      },
+      searchItems: [],
+      currTab: 1
+    }
+  },
+  computed: {},
+  watch: {
+    itemObj: {
+      immediate: true,
+      deep: true,
+      handler(v) {
+        this.tabs[0].name = v.attrTab1Name
+        this.tabs[1].name = v.attrTab2Name
+        this.serchOptions.typeName = v.searchAttrModel
+        this.serchOptions.layKey = v.searchAttrNumber
+        this.tab1Options.typeName = v.attrTab1Model
+        this.tab1Options.layKey = v.attrTab1Number
+        this.tab2Options.typeName = v.attrTab2Model
+        this.tab2Options.layKey = v.attrTab2Number
+      }
+    }
+  },
+  created() {
+    // 初始化数据
+  },
+  methods: {
+    searchEvent(v) {
+      this.searchItems = v.items
+      this.searchFun()
+    },
+    tabClick(val) {
+      this.currTab = val.name
+      this.searchFun()
+    },
+    searchFun() {
+      if (this.currTab === 1) {
+        this.$refs.deetab1.$refs.asCom.getData(this.searchItems)
+      } else {
+        this.$refs.deetab2.$refs.asCom.getData(this.searchItems)
+      }
+    }
+  }
+}
+</script>
+<style lang='scss'>
+</style>