From 751569f25a457a7899b76d0df81360ea6b37b217 Mon Sep 17 00:00:00 2001
From: lideqin <694785430@qq.com>
Date: Mon, 4 Sep 2023 18:05:49 +0800
Subject: [PATCH] =?UTF-8?q?[add]=20=E5=8F=AF=E6=89=A9=E5=B1=95=E8=A1=A8?=
 =?UTF-8?q?=E6=A0=BC=E5=B0=81=E8=A3=85?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/JExpandTable.vue | 73 +++++++++++++++++++++++++++++++++
 1 file changed, 73 insertions(+)
 create mode 100644 src/components/JExpandTable.vue

diff --git a/src/components/JExpandTable.vue b/src/components/JExpandTable.vue
new file mode 100644
index 00000000..8e52a792
--- /dev/null
+++ b/src/components/JExpandTable.vue
@@ -0,0 +1,73 @@
+<template>
+  <a-table :columns="columns" :data-source="dataSource" defaultExpandAllRows>
+    <!-- 如果插槽是作用域插槽，将作用域插槽的props包装成对象传递给slot -->
+    <template v-for="(_, slotName) in $scopedSlots" :slot="slotName" slot-scope="text, record, index">
+      <slot :name="slotName" v-bind="{text, record, index}" />
+    </template>
+    <!-- 如果是普通插槽，直接使用$slots渲染 -->
+    <slot v-for="(_, slotName) in $slots" :name="slotName" :slot="slotName" />
+    <div slot="expandedRowRender" slot-scope="record, index" style="margin: 0">
+      <a-form-model :model="record" :rules="rules" :ref="`ruleForm${index}`">
+        <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="依据描述" prop="desc">
+          <a-input
+            type="textarea"
+            placeholder="请输入依据描述"
+            v-model="record.desc" />
+        </a-form-model-item>
+        <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="工作令编号" prop="tokenNum">
+          <a-input
+            placeholder="请输入工作令编号"
+            v-model="record.tokenNum" />
+        </a-form-model-item>
+        <a-form-model-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="项目名称" prop="itemName">
+          <a-input
+            placeholder="请输入项目名称"
+            v-model="record.itemName" />
+        </a-form-model-item>
+      </a-form-model>
+    </div>
+  </a-table>
+</template>
+
+<script>
+export default {
+  name: 'JExpandTable',
+  props: ['columns', 'dataSource', 'modelType'],
+  data () {
+    return {
+      labelCol: {
+        sm: 4
+      },
+      wrapperCol: {
+        sm: 16
+      },
+      rules: {
+        desc: { required: true, message: '请输入依据描述', trigger: 'blur' },
+        tokenNum: { required: true, message: '请输入工作令编号', trigger: 'blur' },
+        itemName: { required: true, message: '请输入项目名称', trigger: 'blur' }
+      }
+    }
+  },
+  methods: {
+    submit () {
+      const arr = []
+      for (const i in this.dataSource) {
+        if (this.$refs[`ruleForm${i}`]) {
+          this.$refs[`ruleForm${i}`].validate(valid => {
+            arr[i] = valid
+          })
+        }
+      }
+      if (arr.includes(false)) {
+        return false
+      } else {
+        return true
+      }
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>