meixioacomponent 0.3.99 → 0.4.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "meixioacomponent",
-  "version": "0.3.99",
+  "version": "0.4.02",
   "private": false,
   "author": "YuRi",
   "main": "lib/meixioacomponent.umd.min.js",

package/packages/components/proPageTable/oa_pro_table.vue

@@ -23,6 +23,7 @@
     <div class="oa-pro-table-search">
       <oa_pro_table_searchVue
         v-model="module"
+        v-show="!isCheckTableRow"
         ref="oaProTableSearch"
         :screenList="screenList"
         :placeholder="placeholder"
@@ -34,6 +35,17 @@
           <slot name="search-extend"></slot>
         </template>
       </oa_pro_table_searchVue>
+
+      <oa_pro_table_check_handle_barVue
+        :del-fn="delFn"
+        :export-fn="exportFn"
+        v-if="isCheckTableRow"
+        :checked-value="tableCheckboxConfig.value"
+      >
+        <template slot="check-handle">
+          <slot name="check-handle-plugin"></slot>
+        </template>
+      </oa_pro_table_check_handle_barVue>
     </div>
 
     <!-- 表格内容 -->
@@ -216,6 +228,7 @@ import oa_pro_colum_configVue from './oa_pro_colum_config.vue' //表格列配置
 import oa_pro_table_skeletonVue from './oa_pro_table_skeleton.vue' //表格骨架屏
 import baseDefaultSvgVue from '../base/baseDefaultSvg/baseDefaultSvg.vue' //缺省页组件
 import baseButtonHandle from '../base/baseButtonHandle/baseButtonHandle.vue' //通用组件 排列尾部按钮的组件
+import oa_pro_table_check_handle_barVue from './oa_pro_table_check_handle_bar.vue' //  当表格有行被选中的时候
 
 //
 import componentConfig from '../../config/componentConfig'
@@ -272,45 +285,7 @@ export default {
       this._linkViewClassSubs.init()
     }
   },
-  computed: {
-    config() {
-      return {
-        footHeight: 60,
-        headerHeight: this.headerConfig ? 36 : 0,
-        searchContentHeight: this.searchContentHeight,
-      }
-    },
 
-    tableHeight() {
-      return (
-        this.$props.height -
-        this.config.footHeight -
-        this.config.headerHeight -
-        this.config.searchContentHeight
-      )
-    },
-    fixedList() {
-      return this.$props.tableConfig.filter((item) => {
-        const { lock } = item
-        return lock && lock != 'right'
-      })
-    },
-
-    module: {
-      get() {
-        return this.$props.value
-      },
-      set(val) {
-        this.$emit('input', val)
-      },
-    },
-
-    showTableHeader() {
-      return this.$props.tableConfig.filter((item) => {
-        return item.show
-      })
-    },
-  },
   props: {
     // 当加载树形结构的表格时必须传入该值
     rowKey: {
@@ -437,6 +412,59 @@ export default {
       default: true,
     },
   },
+  computed: {
+    config() {
+      return {
+        footHeight: 60,
+        headerHeight: this.headerConfig ? 36 : 0,
+        searchContentHeight: this.searchContentHeight,
+      }
+    },
+
+    tableHeight() {
+      return (
+        this.$props.height -
+        this.config.footHeight -
+        this.config.headerHeight -
+        this.config.searchContentHeight
+      )
+    },
+    fixedList() {
+      return this.$props.tableConfig.filter((item) => {
+        const { lock } = item
+        return lock && lock != 'right'
+      })
+    },
+
+    module: {
+      get() {
+        return this.$props.value
+      },
+      set(val) {
+        this.$emit('input', val)
+      },
+    },
+
+    showTableHeader() {
+      return this.$props.tableConfig.filter((item) => {
+        return item.show
+      })
+    },
+
+    isCheckTableRow() {
+      const { tableCheckboxConfig } = this.$props
+      return tableCheckboxConfig.value.length > 0
+    },
+
+    // 行被选中删除的方法
+    delFn() {
+      return this._linkViewClassSubs.delFn || null
+    },
+    // 行被选中导出的方法
+    exportFn() {
+      return this._linkViewClassSubs.exportFn || null
+    },
+  },
   components: {
     oaProHeader,
     baseButtonHandle,
@@ -447,6 +475,7 @@ export default {
     oa_pro_table_searchVue,
     oa_pro_colum_configVue,
     oa_pro_table_skeletonVue,
+    oa_pro_table_check_handle_barVue,
   },
   methods: {
     isToolTip(value) {
@@ -695,13 +724,7 @@ export default {
             this.setTableData(res)
           } else {
             const tableData = res.tableData
-            if (
-              res._class.__proto__.__proto__.constructor.name ==
-                'LinkViewClass' &&
-              !this._linkViewClassSubs
-            ) {
-              this._linkViewClassSubs = res._class
-            }
+            this.setLinkViewClass(res)
             if (tableData) {
               this.setTableData(tableData)
             }
@@ -720,6 +743,16 @@ export default {
       }
     },
 
+    // 与oa 的页面表格类联动
+    setLinkViewClass(res) {
+      if (
+        res._class.__proto__.__proto__.constructor.name == 'LinkViewClass' &&
+        !this._linkViewClassSubs
+      ) {
+        this._linkViewClassSubs = res._class
+      }
+    },
+
     // 表格如果有滚动条将滚动条拉到顶部
     scrollToTop() {
       const { isAuth } = this.$props
@@ -796,6 +829,11 @@ export default {
           this.preSingleTableValue = val[0]
           tableCheckboxConfig.value = val
         } else {
+          if (val.length == 0) {
+            this.preSingleTableValue = null
+            tableCheckboxConfig.value = []
+            return
+          }
           let index = val.findIndex((item) => {
             return item == this.preSingleTableValue
           })
@@ -812,7 +850,6 @@ export default {
       } else {
         tableCheckboxConfig.value = val
       }
-      //console.log(tableCheckboxConfig.value);
     },
 
     // 返回被选中的值
@@ -842,7 +879,7 @@ export default {
       clearTimeout(this.triggerDown)
       this.triggerDown = setTimeout(() => {
         this.tableDataCompleted()
-      }, 1000)
+      }, 800)
     },
 
     tableDataCompleted() {

package/packages/components/proPageTable/oa_pro_table_check_handle_bar.vue

@@ -0,0 +1,78 @@
+<template>
+  <div class="check-handle-bar-wrap">
+    <div class="handle-notify-data">
+      <span class="handle-text">
+        已选中
+        <span style="color: var(--color-primary); margin: 0px var(--margin-2);">
+          {{ checkNum }}
+        </span>
+        项
+      </span>
+    </div>
+
+    <div class="handle-plugin-wrap">
+      <el-button
+        type="info"
+        size="mini"
+        icon="el-icon-upload2"
+        v-if="exportFn"
+        @click="exportFn"
+      >
+        导出选中
+      </el-button>
+      <el-button
+        type="info"
+        size="mini"
+        v-if="delFn"
+        @click="delFn"
+        icon="el-icon-delete"
+      >
+        删除
+      </el-button>
+
+      <slot name="check-handle"></slot>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {}
+  },
+  props: {
+    delFn: {},
+    exportFn: {},
+    checkedValue: {},
+  },
+  computed: {
+    checkNum() {
+      const { checkedValue } = this.$props
+      return checkedValue.length
+    },
+  },
+  methods: {},
+}
+</script>
+
+<style lang="less" scoped>
+.check-handle-bar-wrap {
+  width: 100%;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  margin: calc(var(--margin-5) * 2) 0px;
+
+  .handle-notify-data {
+    .handle-text {
+      color: var(--font-color-d);
+      font-size: var(--font-size-s);
+      margin-right: var(--margin-4);
+      font-weight: var(--font-weight-kg);
+    }
+  }
+  .handle-plugin-wrap {
+    display: flex;
+  }
+}
+</style>

package/packages/config/uploadRequest.js

@@ -2,46 +2,52 @@ import axios from 'axios'
 import { GetToken } from '../utils/utils.js'
 import componentConfig from './componentConfig.js'
 
-const ossInstance = (params, uploadProgressFn) => {
-  // 创建 axios 实例
-  const instance = axios.create({
-    // API 请求的默认前缀
-    baseURL: `${componentConfig.uploadUrl}`,
-  })
 
-  // 异常拦截处理器
-  const errorHandler = (error) => {
-    return Promise.reject(error)
-  }
 
-  // 响应异常拦截处理器
-  const resErrorHandler = (error) => {
-    // Message.error(`网络超时，请稍后重试`);
-    // return errorHandler(error);
-  }
+export default (file, uploadProgressFn, sourceToken) => {
 
-  // request 拦截器
-  instance.interceptors.request.use((config) => {
-    config.headers['Content-Type'] = 'multipart/form-data'
-    config.headers['authorization'] = `Bearer ${GetToken('token')}`
-    config.onUploadProgress = (progressEvent) => {
-      if (uploadProgressFn) {
-        const percent = (progressEvent.loaded / progressEvent.total) * 100 || 0
-        uploadProgressFn(percent)
-      }
+
+  const ossInstance = (params, uploadProgressFn) => {
+    // 创建 axios 实例
+    const instance = axios.create({
+      // API 请求的默认前缀
+      baseURL: `${componentConfig.uploadUrl}`,
+    })
+  
+    // 异常拦截处理器
+    const errorHandler = (error) => {
+      return Promise.reject(error)
     }
-    return config
-  }, errorHandler)
+  
+    // 响应异常拦截处理器
+    const resErrorHandler = (error) => {
+      // Message.error(`网络超时，请稍后重试`);
+      // return errorHandler(error);
+    }
+  
+    // request 拦截器
+    instance.interceptors.request.use((config) => {
+      config.headers['Content-Type'] = 'multipart/form-data'
+      config.headers['authorization'] = `Bearer ${GetToken('token')}`
+      config.onUploadProgress = (progressEvent) => {
+        if (uploadProgressFn) {
+          const percent = (progressEvent.loaded / progressEvent.total) * 100 || 0
+          uploadProgressFn(percent)
+        }
+      }
+      return config
+    }, errorHandler)
+  
+    // response 拦截器
+    instance.interceptors.response.use(async (response) => {
+      return response
+    }, resErrorHandler)
+  
+    return instance(params)
+  }
 
-  // response 拦截器
-  instance.interceptors.response.use(async (response) => {
-    return response
-  }, resErrorHandler)
 
-  return instance(params)
-}
 
-export default (file, uploadProgressFn, sourceToken) => {
   return new Promise((resolve, reject) => {
     const params = new FormData()
     params.append('file', file)

package/src/App.vue

@@ -1,13 +1,7 @@
 <template>
   <div id="app">
     <div style="height: 100vh;">
-      <!-- <testVue></testVue> -->
-
-      <base-toggle
-        :toggleList="toggleList"
-        v-model="test"
-        :disabled="true"
-      ></base-toggle>
+      <testVue></testVue>
     </div>
   </div>
 </template>

package/src/config/linkViewClass.js

@@ -1,6 +1,8 @@
 class LinkViewClass {
   constructor(params) {
     this.tableData = []
+    this.delFn = null
+    this.exportFn = null
     this.refreshTableData = null
     this.pageProps = {}
     this.pageConfig = {}