添加AO保留弹框自定义组件开发

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

+/**
+* @Description:
+* @author gjn
+* @date 2024/05/06
+*/
+<template>
+  <div class="AddExtRetentionDetailDialog-dialog">
+    <dee-as-com
+      ref="tableCom"
+      class="list-table"
+      :lay-config="{ typeName: 'ExtProcessPlan', layKey: 'addExtRetentionLists'}"
+      @selectionChange="selectionChange"
+    />
+    <div slot="footer" class="foot-btn-box">
+      <el-button type="primary" @click="submitEvent">确认</el-button>
+      <el-button @click="cancelEvent">取消</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  componentName: '添加AO保留弹框',
+  name: 'AddExtRetentionDetailDialog',
+  components: {},
+  props: {
+    basicData: {
+      type: Object,
+      default: () => {}
+    },
+    parentTableData: {
+      type: Object,
+      default: () => {}
+    }
+  },
+  data() {
+    return {
+      selection: [],
+      defaultData: {}
+    }
+  },
+  computed: {},
+  watch: {},
+  mounted() {},
+  methods: {
+    findByNameVnode(obj, targetName) {
+      if (obj && obj.$vnode && obj.$vnode.tag && obj.$vnode.tag.includes(targetName)) {
+        return obj
+      } else {
+        return this.findByNameVnode(obj.$parent, targetName)
+      }
+    },
+    selectionChange(val) {
+      this.selection = val
+    },
+    submitEvent() {
+      if (this.selection.length) {
+        const showData = this.findByNameVnode(this, 'DeeAsTable').showData
+        if (showData.length) {
+          this.selection = this.selection.filter(item => !showData.some(x => x.lifecycleTemplateId === item.lifecycleTemplateId))
+        }
+        const data = this.selection.map(item => {
+          item.operator = 'ADD'
+          item.id = null
+          return item
+        })
+        this.$emit('submitEvent', { formData: data })
+      }
+    },
+    cancelEvent() {
+      this.$emit('cancel')
+    }
+  }
+}
+</script>
+<style lang='scss'>
+.AddExtRetentionDetailDialog-dialog{
+  .list-table{
+    height: 510px!important;
+  }
+  .foot-btn-box{
+   display: flex;
+   justify-content: center;
+   align-content: center;
+   margin-top: 10px;
+ }
+ .search-box-col{
+  width: 300px !important;
+ }
+ .w60{
+  width: 30px !important;
+ }
+}
+
+</style>