🦄 refactor: 封装统一表格组件，便于批量扩展表格能力

klp-ui/src/plugins/package/penal/form/ElementForm.vue

@@ -29,7 +29,7 @@
     <!--字段列表-->
 <!--    <div class="element-property list-property">-->
 <!--      <el-divider><i class="el-icon-coin"></i> 表单字段</el-divider>-->
-<!--      <el-table :data="fieldList" size="mini" max-height="240" border fit>-->
+<!--      <KLPTable :data="fieldList" size="mini" max-height="240" border fit>-->
 <!--        <el-table-column label="序号" type="index" width="50px" />-->
 <!--        <el-table-column label="字段名称" prop="label" min-width="80px" show-overflow-tooltip />-->
 <!--        <el-table-column label="字段类型" prop="type" min-width="80px" :formatter="row => fieldType[row.type] || row.type" show-overflow-tooltip />-->
@@ -41,7 +41,7 @@
 <!--            <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeField(row, $index)">移除</el-button>-->
 <!--          </template>-->
 <!--        </el-table-column>-->
-<!--      </el-table>-->
+<!--      </KLPTable>-->
 <!--    </div>-->
 <!--    <div class="element-drawer__button">-->
 <!--      <el-button size="mini" type="primary" icon="el-icon-plus" @click="openFieldForm(null, -1)">添加字段</el-button>-->
@@ -79,7 +79,7 @@
 <!--          <span><i class="el-icon-menu"></i>枚举值列表：</span>-->
 <!--          <el-button size="mini" type="primary" @click="openFieldOptionForm(null, -1, 'enum')">添加枚举值</el-button>-->
 <!--        </p>-->
-<!--        <el-table :data="fieldEnumList" size="mini" key="enum-table" max-height="240" border fit>-->
+<!--        <KLPTable :data="fieldEnumList" size="mini" key="enum-table" max-height="240" border fit>-->
 <!--          <el-table-column label="序号" width="50px" type="index" />-->
 <!--          <el-table-column label="枚举值编号" prop="id" min-width="100px" show-overflow-tooltip />-->
 <!--          <el-table-column label="枚举值名称" prop="name" min-width="100px" show-overflow-tooltip />-->
@@ -90,7 +90,7 @@
 <!--              <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeFieldOptionItem(row, $index, 'enum')">移除</el-button>-->
 <!--            </template>-->
 <!--          </el-table-column>-->
-<!--        </el-table>-->
+<!--        </KLPTable>-->
 <!--      </template>-->
 
 <!--      &lt;!&ndash; 校验规则 &ndash;&gt;-->
@@ -99,7 +99,7 @@
 <!--        <span><i class="el-icon-menu"></i>约束条件列表：</span>-->
 <!--        <el-button size="mini" type="primary" @click="openFieldOptionForm(null, -1, 'constraint')">添加约束</el-button>-->
 <!--      </p>-->
-<!--      <el-table :data="fieldConstraintsList" size="mini" key="validation-table" max-height="240" border fit>-->
+<!--      <KLPTable :data="fieldConstraintsList" size="mini" key="validation-table" max-height="240" border fit>-->
 <!--        <el-table-column label="序号" width="50px" type="index" />-->
 <!--        <el-table-column label="约束名称" prop="name" min-width="100px" show-overflow-tooltip />-->
 <!--        <el-table-column label="约束配置" prop="config" min-width="100px" show-overflow-tooltip />-->
@@ -110,7 +110,7 @@
 <!--            <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeFieldOptionItem(row, $index, 'constraint')">移除</el-button>-->
 <!--          </template>-->
 <!--        </el-table-column>-->
-<!--      </el-table>-->
+<!--      </KLPTable>-->
 
 <!--      &lt;!&ndash; 表单属性 &ndash;&gt;-->
 <!--      <el-divider key="property-divider" />-->
@@ -118,7 +118,7 @@
 <!--        <span><i class="el-icon-menu"></i>字段属性列表：</span>-->
 <!--        <el-button size="mini" type="primary" @click="openFieldOptionForm(null, -1, 'property')">添加属性</el-button>-->
 <!--      </p>-->
-<!--      <el-table :data="fieldPropertiesList" size="mini" key="property-table" max-height="240" border fit>-->
+<!--      <KLPTable :data="fieldPropertiesList" size="mini" key="property-table" max-height="240" border fit>-->
 <!--        <el-table-column label="序号" width="50px" type="index" />-->
 <!--        <el-table-column label="属性编号" prop="id" min-width="100px" show-overflow-tooltip />-->
 <!--        <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />-->
@@ -129,7 +129,7 @@
 <!--            <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeFieldOptionItem(row, $index, 'property')">移除</el-button>-->
 <!--          </template>-->
 <!--        </el-table-column>-->
-<!--      </el-table>-->
+<!--      </KLPTable>-->
 
 <!--      &lt;!&ndash; 底部按钮 &ndash;&gt;-->
 <!--      <div class="element-drawer__button">-->

klp-ui/src/plugins/package/penal/listeners/ElementListeners.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="panel-tab__content">
-    <el-table :data="elementListenersList" size="mini" border>
+    <KLPTable :data="elementListenersList" size="mini" border>
       <el-table-column label="序号" width="50px" type="index" />
       <el-table-column label="事件类型" min-width="100px" prop="event" />
       <el-table-column label="监听器类型" min-width="100px" show-overflow-tooltip :formatter="row => listenerTypeObject[row.listenerType]" />
@@ -11,7 +11,7 @@
           <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeListener(row, $index)">移除</el-button>
         </template>
       </el-table-column>
-    </el-table>
+    </KLPTable>
     <div class="element-drawer__button">
       <el-button size="mini" type="primary" icon="el-icon-plus" @click="openListenerForm(null)">添加监听器</el-button>
     </div>
@@ -102,7 +102,7 @@
         <span><i class="el-icon-menu"></i>注入字段：</span>
         <el-button size="mini" type="primary" @click="openListenerFieldForm(null)">添加字段</el-button>
       </p>
-      <el-table :data="fieldsListOfListener" size="mini" max-height="240" border fit style="flex: none">
+      <KLPTable :data="fieldsListOfListener" size="mini" max-height="240" border fit style="flex: none">
         <el-table-column label="序号" width="50px" type="index" />
         <el-table-column label="字段名称" min-width="100px" prop="name" />
         <el-table-column label="字段类型" min-width="80px" show-overflow-tooltip :formatter="row => fieldTypeObject[row.fieldType]" />
@@ -114,7 +114,7 @@
             <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeListenerField(row, $index)">移除</el-button>
           </template>
         </el-table-column>
-      </el-table>
+      </KLPTable>
 
       <div class="element-drawer__button">
         <el-button size="mini" @click="listenerFormModelVisible = false">取 消</el-button>

klp-ui/src/plugins/package/penal/listeners/UserTaskListeners.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="panel-tab__content">
-    <el-table :data="elementListenersList" size="mini" border>
+    <KLPTable :data="elementListenersList" size="mini" border>
       <el-table-column label="序号" width="50px" type="index" />
       <el-table-column label="事件类型" min-width="80px" show-overflow-tooltip :formatter="row => listenerEventTypeObject[row.event]" />
 <!--      <el-table-column label="事件id" min-width="80px" prop="id" show-overflow-tooltip />-->
@@ -12,7 +12,7 @@
           <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeListener(row, $index)">移除</el-button>
         </template>
       </el-table-column>
-    </el-table>
+    </KLPTable>
     <div class="element-drawer__button">
       <el-button size="mini" type="primary" icon="el-icon-plus" @click="openListenerForm(null)">添加监听器</el-button>
     </div>
@@ -126,7 +126,7 @@
         <span><i class="el-icon-menu"></i>注入字段：</span>
         <el-button size="mini" type="primary" @click="openListenerFieldForm(null)">添加字段</el-button>
       </p>
-      <el-table :data="fieldsListOfListener" size="mini" max-height="240" border fit style="flex: none">
+      <KLPTable :data="fieldsListOfListener" size="mini" max-height="240" border fit style="flex: none">
         <el-table-column label="序号" width="50px" type="index" />
         <el-table-column label="字段名称" min-width="100px" prop="name" />
         <el-table-column label="字段类型" min-width="80px" show-overflow-tooltip :formatter="row => fieldTypeObject[row.fieldType]" />
@@ -138,7 +138,7 @@
             <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeListenerField(row, $index)">移除</el-button>
           </template>
         </el-table-column>
-      </el-table>
+      </KLPTable>
 
       <div class="element-drawer__button">
         <el-button size="mini" @click="listenerFormModelVisible = false">取 消</el-button>

klp-ui/src/plugins/package/penal/properties/ElementProperties.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="panel-tab__content">
-    <el-table :data="elementPropertyList" size="mini" max-height="240" border fit>
+    <KLPTable :data="elementPropertyList" size="mini" max-height="240" border fit>
       <el-table-column label="序号" width="50px" type="index" />
       <el-table-column label="属性名" prop="name" min-width="100px" show-overflow-tooltip />
       <el-table-column label="属性值" prop="value" min-width="100px" show-overflow-tooltip />
@@ -11,7 +11,7 @@
           <el-button size="mini" type="text" style="color: #ff4d4f" @click="removeAttributes(row, $index)">移除</el-button>
         </template>
       </el-table-column>
-    </el-table>
+    </KLPTable>
     <div class="element-drawer__button">
       <el-button size="mini" type="primary" icon="el-icon-plus" @click="openAttributesForm(null, -1)">添加属性</el-button>
     </div>

klp-ui/src/plugins/package/penal/signal-message/SignalAndMessage.vue

@@ -4,20 +4,20 @@
       <span><i class="el-icon-menu" style="margin-right: 8px; color: #555555"></i>消息列表</span>
       <el-button size="mini" type="primary" icon="el-icon-plus" @click="openModel('message')">创建新消息</el-button>
     </div>
-    <el-table :data="messageList" size="mini" border>
+    <KLPTable :data="messageList" size="mini" border>
       <el-table-column type="index" label="序号" width="60px" />
       <el-table-column label="消息ID" prop="id" max-width="300px" show-overflow-tooltip />
       <el-table-column label="消息名称" prop="name" max-width="300px" show-overflow-tooltip />
-    </el-table>
+    </KLPTable>
     <div class="panel-tab__content--title" style="padding-top: 8px; margin-top: 8px; border-top: 1px solid #eeeeee">
       <span><i class="el-icon-menu" style="margin-right: 8px; color: #555555"></i>信号列表</span>
       <el-button size="mini" type="primary" icon="el-icon-plus" @click="openModel('signal')">创建新信号</el-button>
     </div>
-    <el-table :data="signalList" size="mini" border>
+    <KLPTable :data="signalList" size="mini" border>
       <el-table-column type="index" label="序号" width="60px" />
       <el-table-column label="信号ID" prop="id" max-width="300px" show-overflow-tooltip />
       <el-table-column label="信号名称" prop="name" max-width="300px" show-overflow-tooltip />
-    </el-table>
+    </KLPTable>
 
     <el-dialog :visible.sync="modelVisible" :title="modelConfig.title" :close-on-click-modal="false" width="400px" append-to-body destroy-on-close>
       <el-form :model="modelObjectForm" size="mini" label-width="90px" @submit.native.prevent>

klp-ui/src/plugins/package/penal/task/task-components/UserTask.vue

@@ -97,11 +97,11 @@
           </el-card>
         </el-col>
         <el-col :span="17">
-          <el-table ref="multipleTable" height="600" :data="userTableList" border @selection-change="handleSelectionChange">
+          <KLPTable ref="multipleTable" height="600" :data="userTableList" border @selection-change="handleSelectionChange">
             <el-table-column type="selection" width="50" align="center" />
             <el-table-column label="用户名" align="center" prop="nickName" />
             <el-table-column label="部门" align="center" prop="dept.deptName" />
-          </el-table>
+          </KLPTable>
           <pagination
             :total="userTotal"
             :page.sync="queryParams.pageNum"