style:table组件完成

renchao@pashanhoo.com
Showing 6 changed files with 30 additions and 86 deletions
public/config.json
src/components/selectTable/index.vue
src/components/selectTable/tableSelect.js
src/views/djbworkflow/djbBook/components/blxxtabs/dyaq.vue
src/views/workflow/components/clxx/clxxUnify.vue
src/views/workflow/mixin/public.js
--- a/public/config.json
View file @3617662
+++ b/public/config.json
View file @3617662
 {
  "TITLE": "不动产登记系统",
-  "SERVERAPI": "/bdcdj",
+  "SERVERAPI": "/bdcdj-th",
  "IDCARDURL": "http://127.0.0.1:33088/function=get_idcard&readnew=0"
 }
--- a/src/components/selectTable/index.vue
View file @3617662
+++ b/src/components/selectTable/index.vue
View file @3617662
@@ -4,12 +4,12 @@
 * @Author: sakuya
 * @Date: 2021年6月10日10:04:07
 * @LastEditors: Please set LastEditors
- * @LastEditTime: 2023-06-29 11:14:11
+ * @LastEditTime: 2023-07-05 10:39:17
 -->
 <template>
  <el-select ref="select" v-model="defaultValue" :size="size" :clearable="clearable" :multiple="multiple" :collapse-tags="collapseTags"
-    :collapse-tags-tooltip="collapseTagsTooltip" :filterable="filterable" :placeholder="placeholder" :disabled="disabled" :filter-method="filterMethod"
+    :collapse-tags-tooltip="collapseTagsTooltip" :filterable="filterable" :placeholder="placeholder" :disabled="disabled"
    @remove-tag="removeTag" @visible-change="visibleChange" @clear="clear">
    <template #empty>
      <div class="sc-table-select__table" :style="{width: tableWidth+'px'}" v-loading="loading">
@@ -19,14 +19,10 @@
        <el-table ref="table" :data="tableData" :height="245" :highlight-current-row="!multiple" @row-click="click" @select="select" @select-all="selectAll">
          <el-table-column v-if="multiple" type="selection" width="45"></el-table-column>
          <el-table-column v-else type="index" width="45">
-            <template #default="scope"><span>{{scope.$index+(currentPage - 1) * pageSize + 1}}</span></template>
+            <template #default="scope"><span>{{scope.$index +1 }}</span></template>
          </el-table-column>
          <slot></slot>
        </el-table>
-        <div class="sc-table-select__page">
-          <el-pagination small background layout="prev, pager, next" :total="total" :page-size="pageSize" v-model:currentPage="currentPage"
-            @current-change="reload"></el-pagination>
-        </div>
      </div>
    </template>
  </el-select>
@@ -48,29 +44,23 @@
      disabled: { type: Boolean, default: false },
      tableWidth: { type: Number, default: 400 },
      mode: { type: String, default: "popover" },
-      props: { type: Object, default: () => { } }
+      props: { type: Object, default: () => { } },
+      // 表格数据
+      tableData: { type: Array, default: () => { [] } },
    },
    data () {
      return {
        loading: false,
        keyword: null,
        defaultValue: [],
-        tableData: [],
-        pageSize: config.pageSize,
-        total: 0,
-        currentPage: 1,
        defaultProps: {
          label: config.props.label,
-          value: config.props.value,
+          value: config.props.value
-          page: config.request.page,
-          pageSize: config.request.pageSize,
-          keyword: config.request.keyword
        },
        formData: {}
      }
    },
    computed: {
    },
    watch: {
      modelValue: {
@@ -90,8 +80,6 @@
      //表格显示隐藏回调
      visibleChange (visible) {
        if (visible) {
-          this.currentPage = 1
-          this.keyword = null
          this.formData = {}
          this.getData()
        } else {
@@ -100,58 +88,24 @@
      },
      //获取表格数据
      async getData () {
-        this.loading = true;
-        var reqData = {
-          [this.defaultProps.page]: this.currentPage,
-          [this.defaultProps.pageSize]: this.pageSize,
-          [this.defaultProps.keyword]: this.keyword
-        }
-        Object.assign(reqData, this.formData)
-        // var res = await this.apiObj.get(reqData);
-        let res = {
-          code: 200,
-          data: {
-            total: 2, rows: [
-              {
-                user: 11111111111,
-                id: 111111111111
-              },
-              {
-                user: 2222222222222,
-                id: 22222222222
-              }
-            ]
-          },
-          message: ""
-        }
-        var parseData = config.parseData(res)
-        this.tableData = parseData.rows;
-        this.total = parseData.total;
-        this.loading = false;
        //表格默认赋值
-        this.$nextTick(() => {
+        if (this.multiple) {
-          if (this.multiple) {
+          this.defaultValue.forEach(row => {
-            this.defaultValue.forEach(row => {
+            var setrow = this.tableData.filter(item => item[this.defaultProps.value] === row[this.defaultProps.value])
-              var setrow = this.tableData.filter(item => item[this.defaultProps.value] === row[this.defaultProps.value])
+            if (setrow.length > 0) {
-              if (setrow.length > 0) {
+              this.$refs.table.toggleRowSelection(setrow[0], true);
-                this.$refs.table.toggleRowSelection(setrow[0], true);
+            }
-              }
+          })
-            })
+        } else {
-          } else {
+          if (this.defaultValue) {
            var setrow = this.tableData.filter(item => item[this.defaultProps.value] === this.defaultValue[this.defaultProps.value])
-            this.$refs.table.setCurrentRow(setrow[0]);
+            // this.$refs.table.setCurrentRow(setrow[0]);
          }
-          this.$refs.table.setScrollTop(0)
+        }
-        })
+        // this.$refs.table.setScrollTop(0)
      },
      //插糟表单提交
      formSubmit () {
-        this.currentPage = 1
-        this.keyword = null
-        this.getData()
-      },
-      //分页刷新表格
-      reload () {
        this.getData()
      },
      //自动模拟options赋值
@@ -162,7 +116,9 @@
              item.currentLabel = item.value[this.defaultProps.label]
            })
          } else {
-            this.$refs.select.selectedLabel = this.defaultValue[this.defaultProps.label]
+            if (this.defaultValue) {
+              this.$refs.select.selectedLabel = this.defaultValue[this.defaultProps.label]
+            }
          }
        })
      },
@@ -207,6 +163,7 @@
          this.defaultValue = row
          this.$refs.select.blur()
          this.autoCurrentLabel()
+          this.$refs.table.setCurrentRow(row);
          this.$emit('update:modelValue', this.defaultValue);
          this.$emit('change', this.defaultValue);
        }
@@ -225,14 +182,6 @@
      findRowByKey (value) {
        return this.tableData.find(item => item[this.defaultProps.value] === value)
      },
-      filterMethod (keyword) {
-        if (!keyword) {
-          this.keyword = null;
-          return false;
-        }
-        this.keyword = keyword;
-        this.getData()
-      },
      // 触发select隐藏
      blur () {
        this.$refs.select.blur();
@@ -244,7 +193,6 @@
    }
  }
 </script>
 <style scoped>
  .sc-table-select__table {
    padding: 12px;
--- a/src/components/selectTable/tableSelect.js
View file @3617662
+++ b/src/components/selectTable/tableSelect.js
View file @3617662
 /*
 * @Description: 
 * @Autor: renchao
- * @LastEditTime: 2023-06-29 11:05:49
+ * @LastEditTime: 2023-07-05 09:48:23
 */
 //表格选择器配置
@@ -9,17 +9,12 @@ export default {
  pageSize: 10,						//表格每一页条数
  parseData: function (res) {
    return {
-      data: res.data,
+      data: res.data
-      rows: res.data.rows,		//分析行数据字段结构
-      total: res.data.total,		//分析总数字段结构
-      msg: res.message,			//分析描述字段结构
-      code: res.code				//分析状态字段结构
    }
  },
  request: {
    page: 'page',					//规定当前分页字段
    pageSize: 'pageSize',			//规定一页条数字段
-    keyword: 'keyword'				//规定搜索字段
  },
  props: {
    label: 'label',					//映射label显示字段
--- a/src/views/djbworkflow/djbBook/components/blxxtabs/dyaq.vue
View file @3617662
+++ b/src/views/djbworkflow/djbBook/components/blxxtabs/dyaq.vue
View file @3617662
--- a/src/views/workflow/components/clxx/clxxUnify.vue
View file @3617662
+++ b/src/views/workflow/components/clxx/clxxUnify.vue
View file @3617662
 <!--
 * @Description: 
 * @Autor: renchao
- * @LastEditTime: 2023-07-04 16:08:03
+ * @LastEditTime: 2023-07-05 09:55:42
 -->
 <template>
  <div class="clxx">
@@ -67,7 +67,7 @@
      ...mapGetters(["dictData"])
    },
    created () {
-      this.ableOperation = this.$parent.currentSelectTab.ableOperation
+      this.ableOperation = this.$parent?.currentSelectTab?.ableOperation || false
      this.clmlInitList(1)
    },
    methods: {
--- a/src/views/workflow/mixin/public.js
View file @3617662
+++ b/src/views/workflow/mixin/public.js
View file @3617662
 /*
 * @Description: 
 * @Autor: renchao
- * @LastEditTime: 2023-05-24 14:42:24
+ * @LastEditTime: 2023-07-05 09:58:31
 */
 import { getForm } from "../flowform";
 import { getHomeNoticeList } from "@/api/home.js"
@@ -38,6 +38,7 @@ export default {
      for (let item of this.tabList) {
        if (item.value === tabname) {
          this.currentSelectTab = item
+          console.log(item, 'item11111111111');
          break;
        }
      }