@ddwl/ddwl-ui 1.2.1 → 1.2.3-beta.1

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

@@ -1,173 +0,0 @@
-<template>
-  <d-dialog
-    v-model="visible"
-    form-refs="importForm"
-    :width="width"
-    :title="title"
-    submit-btn-text="导入"
-    submit-btn-icon="el-icon-upload2"
-    @submit="submit"
-  >
-    <el-form
-      ref="importForm"
-      :model="form"
-      :inline="true"
-    >
-      <el-form-item
-        class="import-form-item"
-        prop="file"
-        label="选择文件"
-        :rules="[
-          { required: true, message: '请选择文件' }
-        ]"
-      >
-        <div class="custom-file-input">
-          <div class="custom-file-content">
-            {{ form.file ? form.file.name : '请选择' }}
-          </div>
-          <el-upload
-            :file-list="fileList"
-            :show-file-list="false"
-            :auto-upload="false"
-            action=""
-            :on-change="uploadChange"
-          >
-            <el-button
-              type="primary"
-              icon="el-icon-folder"
-            />
-          </el-upload>
-        </div>
-      </el-form-item>
-      <el-button
-        v-show="templateUrl"
-        icon="el-icon-paperclip"
-        type="text"
-        @click="downloadFile"
-      >
-        模板下载
-      </el-button>
-    </el-form>
-    <slot>
-      <p>1. 支持导入格式为{{ fileType.join('、') }}的文件，且文件大小不可超过{{ fileSize }}M</p>
-      <p>2. 模板的表头不可更改，不可删除</p>
-      <p>3. 若导入数据存在编码一致的情况则会更新原有数据</p>
-      <p>4. 若导入过程中有问题，需调整模板内容后再重新导入</p>
-    </slot>
-  </d-dialog>
-</template>
-
-<script>
-import DDialog from '../dialog'
-
-export default {
-  name: 'DImportFile',
-  components: { DDialog },
-  model: {
-    prop: 'modelValue',
-    event: 'change'
-  },
-  props: {
-    modelValue: {
-      default: false,
-      type: Boolean
-    },
-    width: {
-      default: '520px',
-      type: String
-    },
-    title: {
-      default: '',
-      type: String
-    },
-    templateUrl: {
-      default: '',
-      type: String
-    },
-    fileType: {
-      default: () => ['xlsx', 'xls'],
-      type: Array
-    },
-    fileSize: {
-      default: 5,
-      type: Number
-    }
-  },
-  data () {
-    return {
-      fileList: [],
-      form: {
-        file: ''
-      }
-    }
-  },
-  computed: {
-    visible: {
-      get () {
-        return this.modelValue
-      },
-      set (value) {
-        this.form.file = ''
-        this.fileList = []
-        this.$refs.importForm.clearValidate()
-        this.$emit('change', value)
-      }
-    }
-  },
-  methods: {
-    downloadFile () {
-      let token
-      try {
-        token = JSON.parse(window.localStorage.getItem('userInfo')).token
-      } catch (e) {
-        token = ''
-      }
-      window.location.href = `${this.templateUrl}?authToken=${token}`
-    },
-    uploadChange (file, fileList) {
-      const isLimit = file.size / 1024 / 1024 < this.fileSize
-      const isType = this.fileType.includes(file.name.substr(file.name.lastIndexOf('.') + 1).toLocaleLowerCase())
-      if (!isType) {
-        this.$message.error(`请上传正确的文件格式（${this.fileType.join('、')}）`)
-        return false
-      }
-      if (!isLimit) {
-        this.$message.error(`上传文件大小不能超过${this.fileSize}MB`)
-        return false
-      }
-      this.fileList = fileList
-      this.form.file = file.raw
-    },
-    async submit (callback) {
-      if (!this.form.file) {
-        this.$message.error('请选择导入文件')
-        callback(new Error(false))
-        return
-      }
-      try {
-        this.$emit('submit', this.form.file, callback)
-      } catch (e) {
-        callback(new Error(false))
-      }
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.custom-file-input {
-  display: flex;
-  width: 230px;
-  .custom-file-content {
-    width: 100%;
-    height: 32px;
-    border: 1px solid #dcdfe6;
-    border-right: none;
-    border-radius: 2px 0 0 2px;
-    padding: 0 8px;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-}
-</style>

package/src/packages/menu/index.vue

@@ -1,66 +0,0 @@
-<!-- 菜单 -->
-<template>
-  <el-menu
-    class="d-menu"
-    :default-active="isVertical ? $route.path : activeMenu"
-    :router="isVertical"
-    unique-opened
-    :mode="mode"
-    @select="menuSelect">
-    <menu-item v-for="item in data" :key="item.name" :data="item" :mode="mode"></menu-item>
-  </el-menu>
-</template>
-
-<script>
-import MenuItem from './menuItem.vue'
-export default {
-  name: 'DMenu',
-  components: { MenuItem },
-  props: {
-    data: {
-      type: Array,
-      default: () => []
-    },
-    mode: {
-      type: String,
-      default: 'vertical'
-    }
-  },
-  data () {
-    return {
-      activeMenu: ''
-    }
-  },
-  computed: {
-    isVertical () {
-      return this.mode === 'vertical'
-    }
-  },
-  watch: {
-    '$route.path': {
-      handler (path) {
-        if (!this.isVertical) {
-          if (this.activeMenu && path.substring(0, this.activeMenu.length) === this.activeMenu) return
-          const data = this.data.find(item => path.substring(0, item.path.length) === item.path)
-          this.activeMenu = data?.path
-          this.$emit('select', data, false)
-        }
-      },
-      immediate: true
-    }
-  },
-  methods: {
-    menuSelect (index) {
-      if (this.isVertical) return
-      const data = this.data.find(item => item.path === index)
-      this.$emit('select', data, true)
-    }
-  }
-}
-</script>
-
-<style lang='scss' scoped>
-.d-menu {
-  height: 100%;
-}
-</style>

package/src/packages/menu/menuItem.vue

@@ -1,90 +0,0 @@
-<!-- 菜单子项 -->
-<template>
-  <el-submenu
-    v-if="mode === 'vertical' && data.children && data.children.length"
-    :index="data.path"
-  >
-    <template slot="title">
-      <img
-        v-if="data.meta.icon"
-        class="mr8 menu-icon"
-        :src="data.meta.icon"
-      >
-      <span>{{ data.meta.title }}</span>
-    </template>
-    <menu-item
-      v-for="item in data.children"
-      :key="item.name"
-      :data="item"
-    />
-  </el-submenu>
-  <el-menu-item
-    v-else
-    :index="data.path"
-  >
-    <template slot="title">
-      <div
-        v-if="data.meta.icon"
-        class="menu-icon-box"
-      >
-        <img
-          class="menu-icon"
-          :src="data.meta.icon"
-        >
-      </div>
-      <span
-        v-if="data.meta.isNewWindow"
-        class="ml6 ellipsis flex-1"
-        @click.stop="openNewWindow(data)"
-      >{{ data.meta.title }}</span>
-      <span
-        v-else
-        class="ml6 ellipsis flex-1"
-      >{{ data.meta.title }}</span>
-    </template>
-  </el-menu-item>
-</template>
-
-<script>
-export default {
-  name: 'MenuItem',
-  components: {},
-  props: {
-    data: {
-      type: Object,
-      default: () => ({})
-    },
-    mode: {
-      type: String,
-      default: 'vertical'
-    }
-  },
-  data () {
-    return {
-    }
-  },
-  computed: {},
-  created () {},
-  methods: {
-    openNewWindow (data) {
-      window.open(data.path, '_blank')
-    }
-  }
-}
-</script>
-
-<style lang='scss' scoped>
-.menu-icon-box {
-  width: 26px;
-  height: 26px;
-  border-radius: 50%;
-  background-color: #fff;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.menu-icon {
-  width: 16px;
-  height: 16px;
-}
-</style>

package/src/packages/popconfirm/index.vue

@@ -1,39 +0,0 @@
-<!-- 二次确认气泡 -->
-<template>
-  <el-popconfirm
-    :title="title"
-    cancel-button-type=""
-    icon="el-icon-warning"
-    @confirm="confirm"
-  >
-    <span slot="reference" :class="`${type}-text-btn`">{{ buttonName }}</span>
-  </el-popconfirm>
-</template>
-
-<script>
-export default {
-  name: 'DPopconfirm',
-  props: {
-    title: {
-      default: '您确定删除该信息？',
-      type: String
-    },
-    buttonName: {
-      default: '删除',
-      type: String
-    },
-    type: {
-      default: 'primary',
-      type: String
-    }
-  },
-  data () {
-    return {}
-  },
-  methods: {
-    confirm () {
-      this.$emit('confirm')
-    }
-  }
-}
-</script>

package/src/packages/radio-group/index.vue

@@ -1,57 +0,0 @@
-<!-- 单选框组 -->
-<template>
-  <el-radio-group
-    v-model="value"
-    v-bind="$attrs"
-    v-on="$listeners"
-  >
-    <el-radio
-      v-for="item in options"
-      :key="item.value"
-      :label="item.value"
-    >
-      {{ item.label }}
-    </el-radio>
-  </el-radio-group>
-</template>
-
-<script>
-export default {
-  name: 'DRadioGroup',
-  components: {},
-  model: {
-    prop: 'modelValue',
-    event: 'modelChange'
-  },
-  props: {
-    modelValue: {
-      type: [String, Number],
-      default: ''
-    },
-    options: {
-      type: Array,
-      default: () => []
-    }
-  },
-  data () {
-    return {
-    }
-  },
-  computed: {
-    value: {
-      get () {
-        return this.modelValue
-      },
-      set (value) {
-        this.$emit('modelChange', value)
-      }
-    }
-  },
-  watch: {},
-  created () {},
-  methods: {}
-}
-</script>
-
-<style lang='scss' scoped>
-</style>

package/src/packages/render/index.vue

@@ -1,14 +0,0 @@
-<!-- eslint-disable vue/require-default-prop -->
-<script>
-export default {
-  name: 'DRender',
-  functional: true,
-  props: {
-    scope: Object,
-    render: Function
-  },
-  render: (h, ctx) => {
-    return ctx.props.render ? ctx.props.render(ctx.props.scope, h) : ''
-  }
-}
-</script>

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

@@ -1,257 +0,0 @@
-<!-- 搜索组件 -->
-<template>
-  <div class="d-search-form">
-    <el-row class="flex-wrap" :gutter="gutter">
-      <el-col
-        v-for="(item, index) in list"
-        v-show="showCol(index)"
-        :key="item.prop"
-        :span="item.span || Math.floor(24 / cell)"
-        class="col-item"
-      >
-        <div class="search-item">
-          <div class="search-item-label">
-            {{ item.label }}
-          </div>
-          <form-item v-model="form[item.prop]" :config="item" />
-        </div>
-      </el-col>
-      <el-col :span="hiddenIndex === list.length || expend ? emptySpan : 0" style="height: 68px;">
-        <span />
-      </el-col>
-      <el-col v-if="hasSlot && expend && !suffixSlot" :span="24 - submitSpan" class="mb16">
-        <slot />
-      </el-col>
-      <el-col :span="submitSpan">
-        <div
-          :style="{
-            'margin-top': hasSlot && expend && !suffixSlot ? '0px' : '24px'
-          }"
-          class="d-search-form-btn"
-        >
-          <el-button type="primary" :disabled="searchLoading" @click="search">
-            查询
-          </el-button>
-          <el-button :disabled="searchLoading" @click="reset">
-            重置
-          </el-button>
-          <el-button
-            v-if="list.length > hiddenIndex"
-            class="expend-btn"
-            :class="`el-icon-arrow-${expend ? 'up' : 'down'}`"
-            @click="changeStatus"
-          />
-        </div>
-      </el-col>
-      <el-col v-if="hasSlot && (!expend || suffixSlot)" :span="20" class="mb16">
-        <slot />
-      </el-col>
-    </el-row>
-  </div>
-</template>
-
-<script>
-import FormItem from '../form-item'
-import { cloneDeep } from 'lodash'
-
-// 初始化表单
-let initForm = {}
-
-export default {
-  name: 'DSearchForm',
-  components: {
-    FormItem
-  },
-  model: {
-    prop: 'value',
-    event: 'change'
-  },
-  props: {
-    config: {
-      require: true,
-      default: () => [],
-      type: Array
-    },
-    cell: {
-      default: 6,
-      type: Number
-    },
-    gutter: {
-      default: 16,
-      type: Number
-    },
-    value: {
-      default: () => {},
-      type: Object
-    },
-    searchData: {
-      default: null,
-      type: Function
-    },
-    buttonSpan: {
-      default: 0,
-      type: Number
-    }
-  },
-  data () {
-    return {
-      list: [],
-      hiddenIndex: 0,
-      emptySpan: 0,
-      expend: false,
-      searchLoading: false,
-      // 判断是否有插槽节点，目前只在组件初始化完成时判断
-      hasSlot: false,
-      suffixSlot: true
-    }
-  },
-  computed: {
-    form: {
-      get () {
-        return this.value
-      },
-      set (value) {
-        this.$emit('change', value)
-      }
-    },
-    submitSpan () {
-      return this.buttonSpan || 24 / this.cell
-    },
-    spanList () {
-      return this.list.map(item => item.span || Math.floor(24 / this.cell)) || []
-    },
-    showCol () {
-      return (index) => {
-        return this.expend || index < this.hiddenIndex
-      }
-    }
-  },
-  watch: {
-    config: {
-      handler () {
-        this.list = this.config.filter(item => !item.hidden)
-      },
-      deep: true,
-      immediate: true
-    },
-    spanList: {
-      handler (val, oldVal) {
-        if (!val.length || JSON.stringify(val) === JSON.stringify(oldVal)) {
-          return
-        }
-        this.calcSpan()
-      },
-      deep: true,
-      immediate: true
-    }
-  },
-  created () {
-    initForm = cloneDeep(this.value)
-    this.$nextTick(() => {
-      this.hasSlot = !!(this.$slots.default && this.$slots.default.length)
-      this.calcSpan()
-    })
-  },
-  methods: {
-    /**
-     * @description: 查询
-     */
-    async search () {
-      this.$emit('search')
-      if (this.searchData) {
-        try {
-          this.searchLoading = true
-          await this.searchData({ pageNum: 1 }, this.form)
-          this.searchLoading = false
-        } catch (e) {
-          this.searchLoading = false
-        }
-      }
-    },
-    /**
-     * @description: 重置
-     */
-    async reset () {
-      this.form = cloneDeep(initForm)
-      this.$emit('search')
-      if (this.searchData) {
-        this.resetLoading = true
-        await this.searchData({ pageNum: 1 }, this.form)
-        this.resetLoading = false
-      }
-    },
-    /**
-     * @description: 展开/收起
-     */
-    changeStatus () {
-      this.expend = !this.expend
-      this.$emit('expand-change', this.expend)
-    },
-    calcSpan () {
-      let hiddenIndex = 1
-      const total = this.spanList.length ? this.spanList.reduce((a, b, index) => {
-        const sum = a + b
-        if (hiddenIndex < 2) {
-          if (24 - sum < this.submitSpan) {
-            hiddenIndex = index
-          }
-          if (24 - sum >= this.submitSpan && index === this.spanList.length - 1) {
-            hiddenIndex = index + 1
-          }
-        }
-        return sum
-      }) : 0
-      this.hiddenIndex = hiddenIndex
-
-      const offsetSpan = 24 - total % 24
-      if (this.hasSlot) {
-        if (offsetSpan < this.submitSpan || offsetSpan === 24) {
-          this.suffixSlot = false
-          this.emptySpan = 0
-        } else {
-          this.suffixSlot = true
-          this.emptySpan = offsetSpan >= this.submitSpan ? offsetSpan - this.submitSpan : 24 - this.submitSpan
-        }
-      } else {
-        this.emptySpan = offsetSpan >= this.submitSpan ? offsetSpan - this.submitSpan : 24 - this.submitSpan
-      }
-    }
-  }
-}
-</script>
-
-<style lang="scss" scoped>
-.d-search-form {
-  margin-bottom: 4px;
-  .col-item {
-    align-items: end;
-  }
-  .el-select {
-    width: 100%;
-    .el-input_inner {
-      height: 32px;
-    }
-  }
-  &-btn {
-    text-align: right;
-    margin-bottom: 16px;
-  }
-  &-overflow {
-    margin-top: 24px;
-  }
-  .expend-btn {
-    padding: 4px 8px;
-  }
-}
-.search-item {
-  margin-bottom: 12px;
-  &-label {
-    margin-bottom: 4px;
-    font-weight: 400;
-    color: #333333;
-  }
-  :deep(.el-input__inner) {
-    height: 32px !important;
-  }
-}
-</style>