task4430

src/views/component/sop/xueQingXueShiYan.vue

@@ -1,14 +1,33 @@
 <template>
     <div class="performance">
+        <div class="flex">
+            <div class="title">*</div>
+            <div v-if="isRead" />
+            <div v-else>
+                <el-button type="primary" size="mini" icon="ibps-icon-add" @click="handleAdd"> 添加</el-button>
+                <el-button type="danger" size="mini" icon="ibps-icon-remove" @click="handleDelete"> 删除</el-button>
+            </div>
+        </div>
         <div class="table">
-            <el-table :data="tableData" border>
+            <el-table :data="tableData" border @selection-change="handleSelectionChange">
+                <el-table-column type="selection" width="55" />
                 <el-table-column
                     label="序号"
                     width="50"
                     type="index"
                 />
-                <el-table-column label="菌株编号" prop="junZhuBianHao" width="100" />
-                <el-table-column label="菌株名称" prop="junZhuMingCheng" width="120" />
+                <el-table-column label="菌株编号" prop="junZhuBianHao" width="100">
+                    <template slot-scope="{row}">
+                        <el-input v-if="!readonly && !shiFouGuoShen" v-model="row.junZhuBianHao" size="mini" placeholder="请输入" />
+                        <span v-else>{{ row.junZhuBianHao || '/' }}</span>
+                    </template>
+                </el-table-column>
+                <el-table-column label="菌株名称" prop="junZhuMingCheng" width="120">
+                    <template slot-scope="{row}">
+                        <el-input v-if="!readonly && !shiFouGuoShen" v-model="row.junZhuMingCheng" size="mini" placeholder="请输入" />
+                        <span v-else>{{ row.junZhuMingCheng || '/' }}</span>
+                    </template>
+                </el-table-column>
                 <el-table-column label="沙门菌属诊断血清">
                     <el-table-column label="O多价血清(A-F)" prop="duoJiaXieQing">
                         <template slot-scope="{row}">
@@ -107,11 +126,17 @@ export default {
         readonly: {
             type: Boolean,
             default: false
+        },
+        params: {
+            type: Object,
+            default: () => {}
         }
     },
     data () {
         return {
-            tableData: []
+            tableData: [],
+            multipleSelection: [],
+            isRead: false
         }
     },
     computed: {
@@ -146,15 +171,75 @@ export default {
             deep: true
         }
     },
+    mounted () {
+        this.isRead = this.readonly || this.params?.nodeId === 'Activity_14to8rh'
+    },
 
     methods: {
-
+        handleSelectionChange (val) {
+            this.multipleSelection = val
+        },
+        handleAdd () {
+            const { level } = this.$store.getters
+            this.tableData.push({
+                'id': '',
+                'parentId': '',
+                'diDian': level.second || level.first || '',
+                'bianZhiRen': this.formData.bianZhiRen,
+                'bianZhiBuMen': this.formData.bianZhiBuMen,
+                'bianZhiShiJian': this.formData.bianZhiShiJian,
+                'junZhuId': '',
+                'junZhuBianHao': '',
+                'junZhuMingCheng': '',
+                'duoJiaXieQing': '',
+                'yinZiXieQing': '',
+                'yinZiXieQing1Xian': '',
+                'yinZiXieQing2Xian': '',
+                'siZhongDuoJiaXieQ': '',
+                'liJiZhiHeJunDuoJi': '',
+                'fuShiZhiHeJunDuoJ': '',
+                'baoShiZhiHeJunDuo': '',
+                'songNeiShiZhiHeJu': '',
+                'xieQingXueJianDin': '',
+                'biDuiJieGuoPanDua': '通过',
+                'beiZhu': ''
+            })
+        },
+        // 删除
+        handleDelete () {
+            this.$confirm('确定删除当前选中数据？', '提示', {
+                confirmButtonText: '确定',
+                cancelButtonText: '取消',
+                type: 'warning'
+            }).then(() => {
+                if (this.multipleSelection.length > 0) {
+                    this.tableData = this.tableData.filter(row => !this.multipleSelection.includes(row))
+                } else {
+                    this.$message.warning('请选择数据')
+                }
+            })
+        }
     }
 }
 </script>
 
-<style>
+<style lang="scss" scoped>
 .performance{
     padding: 20px 0 0 20px;
+    .flex{
+        display: flex;
+        justify-content: space-between;
+        padding: 0px 0px 0px 15px;
+        background: #f0ffff;
+        .title {
+            color: red;
+            font-size: 12px;
+            font-weight: bold;
+            margin-bottom: 0;
+        }
+        .el-button {
+            margin: 0;
+        }
+    }
 }
 </style>