@ddwl/ddwl-ui 1.3.17 → 1.4.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ddwl/ddwl-ui",
-  "version": "1.3.17",
+  "version": "1.4.0",
   "private": false,
   "main": "dist/index.common.js",
   "style": "dist/index.css",
@@ -22,20 +22,17 @@
     "lint": "vue-cli-service lint",
     "dev": "vue-cli-service lint && vue-cli-service serve",
     "build": "vue-cli-service lint && vue-cli-service build --target lib --name index src/main.js",
-    "release": "npm run build && bumpp -r && npm publish --access=public"
+    "release": "npm run build && bumpp -r && npm publish --access=public",
+    "pub": "node scripts/publish.js"
   },
   "dependencies": {
-    "@vue/eslint-config-standard": "^8.0.1",
     "core-js": "^3.8.3",
     "crypto-js": "^4.2.0",
     "dayjs": "^1.11.13",
     "element-ui": "2.15.14",
     "lodash": "^4.17.21",
-    "sass": "^1.22.10",
-    "sass-loader": "^7.2.0",
-    "sass-resources-loader": "^2.2.5",
     "sortablejs": "^1.15.3",
-    "svg-sprite-loader": "^6.0.11",
+    "ssh2-sftp-client": "^12.0.1",
     "vue": "^2.7.14"
   },
   "devDependencies": {
@@ -44,6 +41,7 @@
     "@vue/cli-plugin-babel": "~5.0.0",
     "@vue/cli-plugin-eslint": "~5.0.0",
     "@vue/cli-service": "~5.0.0",
+    "@vue/eslint-config-standard": "^8.0.1",
     "babel-eslint": "^10.1.0",
     "bumpp": "^10.2.0",
     "conventional-changelog-cli": "^5.0.0",
@@ -51,6 +49,10 @@
     "eslint-config-prettier": "^10.1.8",
     "eslint-plugin-prettier": "^5.5.4",
     "eslint-plugin-vue": "^8.0.3",
+    "sass": "^1.22.10",
+    "sass-loader": "^7.2.0",
+    "sass-resources-loader": "^2.2.5",
+    "svg-sprite-loader": "^6.0.11",
     "vue-template-compiler": "^2.6.14"
   },
   "eslintConfig": {

package/src/lib/install/index.js

@@ -1,4 +1,5 @@
 import previewVue from '../../packages/file-preview/index.vue'
+import importVue from '../../packages/import-file/index.vue'
 
 export default (Vue) => {
   // 文件预览
@@ -10,4 +11,51 @@ export default (Vue) => {
     instance.defaultIndex = defaultIndex
     instance.list = list
   }
+
+  // 文件导入
+  Vue.prototype.$importFile = ({
+    width = '520px',
+    title = '文件导入',
+    templateUrl = '',
+    token = '',
+    templateDownloadMethod = null,
+    fileType = ['xlsx', 'xls'],
+    fileSize = 5,
+    slotRender = null
+  }) => {
+    return new Promise((resolve, reject) => {
+      const Import = Vue.extend(importVue)
+      const instance = new Import()
+      const el = instance.$mount().$el
+      document.body.appendChild(el)
+
+      instance.value = true
+      instance.width = width
+      instance.title = title
+      instance.templateUrl = templateUrl
+      instance.token = token
+      instance.templateDownloadMethod = templateDownloadMethod
+      instance.fileType = fileType
+      instance.fileSize = fileSize
+      instance.slotRender = slotRender
+
+      const destroy = () => {
+        instance.$destroy()
+        el.parentNode && el.parentNode.removeChild(el)
+      }
+
+      instance.$on('submit', async (callback, file) => {
+        try {
+          resolve(callback, file)
+        } catch (e) {
+          callback(new Error(e))
+        }
+      })
+
+      instance.$on('close', () => {
+        reject(new Error('cancelled'))
+        Vue.nextTick(destroy)
+      })
+    })
+  }
 }

package/src/main.js

@@ -6,7 +6,6 @@ import Drawer from './packages/drawer'
 import FilterTree from './packages/filter-tree'
 import Form from './packages/form'
 import FormItem from './packages/form-item'
-import ImportFile from './packages/import-file'
 import Menu from './packages/menu'
 import Popconfirm from './packages/popconfirm'
 import Render from './packages/render'
@@ -31,7 +30,6 @@ const components = [
   FilterTree,
   Form,
   FormItem,
-  ImportFile,
   Menu,
   Popconfirm,
   Render,

package/src/packages/form-item/index.vue

@@ -98,7 +98,7 @@ export default {
       }
     },
     slots() {
-      return Object.entries(this.config.slots || []).map(([key, value]) => ({
+      return Object.entries(this.config.slots || {}).map(([key, value]) => ({
         slotName: key,
         render: value
       }))

package/src/packages/import-file/index.vue

@@ -39,28 +39,27 @@
         模板下载
       </el-button>
     </el-form>
-    <slot>
+    <div v-if="slotRender">
+      <d-render :render="slotRender" />
+    </div>
+    <div v-else>
       <p>1. 支持导入格式为{{ fileType.join('、') }}的文件，且文件大小不可超过{{ fileSize }}M</p>
       <p>2. 模板的表头不可更改，不可删除</p>
       <p>3. 若导入数据存在编码一致的情况则会更新原有数据</p>
       <p>4. 若导入过程中有问题，需调整模板内容后再重新导入</p>
-    </slot>
+    </div>
   </d-dialog>
 </template>
 
 <script>
-import { template } from 'lodash'
 import DDialog from '../dialog'
+import DRender from '../render'
 
 export default {
   name: 'DImportFile',
-  components: { DDialog },
-  model: {
-    prop: 'modelValue',
-    event: 'change'
-  },
+  components: { DDialog, DRender },
   props: {
-    modelValue: {
+    value: {
       default: false,
       type: Boolean
     },
@@ -76,6 +75,10 @@ export default {
       default: '',
       type: String
     },
+    token: {
+      default: '',
+      type: String
+    },
     templateDownloadMethod: {
       type: Function,
       default: null
@@ -87,26 +90,32 @@ export default {
     fileSize: {
       default: 5,
       type: Number
+    },
+    slotRender: {
+      default: null,
+      type: Function
     }
   },
   data() {
     return {
+      visible: false,
       fileList: [],
       form: {
         file: ''
       }
     }
   },
-  computed: {
+  watch: {
+    value: {
+      handler(value) {
+        this.visible = value
+      }
+    },
     visible: {
-      get() {
-        return this.modelValue
-      },
-      set(value) {
-        this.form.file = ''
-        this.fileList = []
-        this.$refs.importForm.clearValidate()
-        this.$emit('change', value)
+      handler(value) {
+        if (!value) {
+          this.$emit('close', value)
+        }
       }
     }
   },
@@ -115,13 +124,7 @@ export default {
       if (this.templateDownloadMethod) {
         this.templateDownloadMethod()
       } else {
-        let token
-        try {
-          token = JSON.parse(window.localStorage.getItem('userInfo')).token
-        } catch (e) {
-          token = ''
-        }
-        window.location.href = `${this.templateUrl}?authToken=${token}`
+        window.location.href = `${this.templateUrl}?authToken=${this.token}`
       }
     },
     uploadChange(file, fileList) {
@@ -147,7 +150,7 @@ export default {
         return
       }
       try {
-        this.$emit('submit', this.form.file, callback)
+        this.$emit('submit', callback, this.form.file)
       } catch (e) {
         callback(new Error(false))
       }

package/src/packages/menu/menuItem.vue

@@ -13,16 +13,16 @@
   </el-submenu>
   <el-menu-item v-else class="d-menu__submenu-item" :index="data.path">
     <template slot="title">
-      <div v-if="data.meta.icon" class="d-menu-icon-box">
+      <div v-if="data.meta.icon" class="d-menu-icon-box mr6">
         <img class="d-menu-icon" :src="data.meta.icon" />
       </div>
       <span
         v-if="data.meta.isNewWindow"
-        class="ml6 ellipsis flex-1"
+        class="ellipsis flex-1"
         @click.stop="openNewWindow(data)"
         >{{ data.meta.title }}</span
       >
-      <span v-else class="ml6 ellipsis flex-1">{{ data.meta.title }}</span>
+      <span v-else class="ellipsis flex-1">{{ data.meta.title }}</span>
     </template>
   </el-menu-item>
 </template>

package/src/packages/search-form/index.vue

@@ -50,9 +50,6 @@
 import FormItem from '../form-item'
 import { cloneDeep } from 'lodash'
 
-// 初始化表单
-let initForm = {}
-
 export default {
   name: 'DSearchForm',
   components: {
@@ -64,7 +61,7 @@ export default {
   },
   props: {
     config: {
-      require: true,
+      required: true,
       default: () => [],
       type: Array
     },
@@ -91,6 +88,7 @@ export default {
   },
   data() {
     return {
+      initForm: {},
       list: [],
       hiddenIndex: 0,
       emptySpan: 0,
@@ -142,7 +140,7 @@ export default {
     }
   },
   created() {
-    initForm = cloneDeep(this.value)
+    this.initForm = cloneDeep(this.value)
     this.$nextTick(() => {
       this.hasSlot = !!(this.$slots.default && this.$slots.default.length)
       this.calcSpan()
@@ -168,7 +166,7 @@ export default {
      * @description: 重置
      */
     async reset() {
-      this.form = cloneDeep(initForm)
+      this.form = cloneDeep(this.initForm)
       this.$emit('search')
       if (this.searchData) {
         this.resetLoading = true

package/src/packages/table/index.vue

@@ -96,7 +96,7 @@ export default {
     // request config
     requestConfig: {
       type: Object,
-      require: false,
+      required: false,
       default: () => ({
         api: () => {}, // 接口
         params: {}, // 默认参数
@@ -242,8 +242,9 @@ export default {
         })
         this.total = total
         this.handleRequestData(data)
-        // eslint-disable-next-line no-empty
-      } catch (e) {}
+      } catch (e) {
+        console.error(e)
+      }
       this.loading = false
     },
     async getData(params) {

package/src/packages/upload/index.vue

@@ -95,7 +95,7 @@
     </div>
     <file-preview
       v-if="previewVisible"
-      :default-index="preveiwIndex"
+      :default-index="previewIndex"
       :list="imgOrVideoList.map((i) => i.fileUrl)"
       @close="previewVisible = false"
     />
@@ -163,7 +163,7 @@ export default {
       dialogVisible: false,
       dialogImageUrl: '',
       videoBg,
-      preveiwIndex: 0,
+      previewIndex: 0,
       previewVisible: false
     }
   },
@@ -258,7 +258,7 @@ export default {
       this.$parent.$emit('el.form.change')
     },
     picturePreview(index) {
-      this.preveiwIndex = index
+      this.previewIndex = index
       this.previewVisible = true
     }
   }
@@ -297,6 +297,11 @@ export default {
     .img-part {
       width: 80px;
       height: 80px;
+      .el-upload--picture-card {
+        width: 80px;
+        height: 80px;
+        line-height: 80px;
+      }
     }
   }
   .file-list {