lw-cdp-ui 1.2.48 → 1.2.49

package/dist/components/lwSearch/index.vue

@@ -1,628 +0,0 @@
-<template>
-  <div id="search-wrap">
-    <div class="search-content">
-      <el-form ref="searchForm" :model="form" @submit.prevent :label-align="labelAlign" style="width: 100%">
-        <el-row :class="(options.length - expandNumber === 0) ? 'expand-row' : (options.length - expandNumber < columnNumber) ? '' : isExpandStatus ? ((options.length % columnNumber === 0) ? 'expand-row' : '') : (options.length >= expandNumber ? 'expand-row' : '')" type="flex" justify="start" :gutter="10">
-          <template v-for="(item, index) in options" :key="item.prop">
-            <el-col :class="(!isExpandStatus && item.isExpand) ? '' : (options.length - expandNumber < columnNumber) ? '' : (!isExpandStatus && index > (expandNumber - 1) ? 'hide' : '')" :span="columnNumber ? 24/columnNumber : (item.span || 8)">
-              <el-form-item :label-width="hideLabel ? 0 : labelWidth" :required="item.required" :label="hideLabel ? '' : $t(item.label)">
-                <template v-if="item.dateSection && item.prop && item.prop.length === 2">
-                  <el-row :gutter="10" class="date-section">
-                    <el-col :span="12" :style="{ width: '45%', flex: '0 0 45%' }">
-                      <component :is="setComponent(item.renderType)" :disabled="item.disabled" :item="item" v-model="form[item.prop[0]]" :disabled-date="(date) => disabledDate(date, 'prev', form[item.prop[1]])" :propValueFormat="item.valueFormat || 'YYYY-MM-DD 00:00:00'" />
-                    </el-col>
-                    <span class="date-section-line"> - </span>
-                    <el-col :span="12" :style="{ width: '45%', flex: '0 0 45%' }">
-                      <component :is="setComponent(item.renderType)" :disabled="item.disabled" :item="item" v-model="form[item.prop[1]]" :disabled-date="(date) => disabledDate(date, 'next', form[item.prop[0]])" :propValueFormat="item.valueFormat || 'YYYY-MM-DD 23:59:59'" />
-                    </el-col>
-                  </el-row>
-                </template>
-                <template v-else>
-                  <component v-model="form[item.prop]" :is="setComponent(item.renderType)" :disabled="item.disabled" :item="item" style="width: 100%" />
-                </template>
-              </el-form-item>
-            </el-col>
-          </template>
-        </el-row>
-
-        <div class="control" :style="{bottom: ((options.length%columnNumber === 0) ? '0px' : '10px')}">
-          <el-button class="reset" @click="resetForm('searchForm')">
-            {{$t('btn.reset')}}
-          </el-button>
-          <el-button class="submit" type="primary" @click="submitForm('searchForm')">
-            {{$t('btn.query')}}
-          </el-button>
-
-          <div :class="options.length - expandNumber >= columnNumber ? 'expand-button' : 'hidden'" @click="isExpandStatus = !isExpandStatus">
-            <span>{{ isExpandStatus ? "收起" : "展开" }}</span>
-          </div>
-        </div>
-      </el-form>
-    </div>
-  </div>
-</template>
-
-<script>
-import SearchInput from "./input/input.vue";
-import SearchSelect from "./select/select.vue";
-import SearchDate from "./date/date.vue";
-import SearchDates from "./dates/dates.vue";
-import SearchDateRange from "./dateRange/dateRange.vue";
-import dayjs from "dayjs";
-
-export default {
-  components: {
-    SearchInput,
-    SearchSelect,
-    SearchDate,
-    SearchDates,
-    SearchDateRange,
-  },
-  name: "lwSearch",
-  props: {
-    options: {
-      // 配置项
-      type: Array,
-      default: () => [],
-    },
-    modelValue: {
-      // 绑定的结果对象
-      type: Object,
-      default: () => ({}),
-    },
-    labelWidth: {
-      // label全局宽度
-      type: String,
-      default: "70px",
-    },
-    labelPosition: {
-      // label全局位置
-      type: String,
-      default: "left",
-    },
-    columnNumber: {
-      // 每行列数量
-      type: Number,
-      default: 4,
-    },
-    isSave: {
-      // 是否保存功能
-      type: Boolean,
-      default: false,
-    },
-    isCloud: {
-      // 是否保存功能
-      type: Boolean,
-      default: false,
-    },
-    saveKey: {
-      // 保存功能指定localStorage searchSaveData对象中key
-      type: String,
-      default: "",
-    },
-    isExpand: {
-      // 默认是否展开
-      type: Boolean,
-      default: false,
-    },
-    expandNumber: {
-      // 默认收起展示数量
-      type: Number,
-      default: 4,
-    },
-    hasExpandAll: {
-      // 默认收起展示数量
-      type: Boolean,
-      default: false,
-    },
-    hideLabel: {
-      // 是否隐藏标签
-      type: Boolean,
-      default: false,
-    },
-    labelAlign: {
-      //标签对齐方式
-      type: String,
-      default: "right",
-    },
-  },
-  data() {
-    return {
-      form: {}, // 内部维护数据
-      defaultForm: {}, // 原始数据
-      isExpandStatus: false, // 是否展开搜索条件
-      isChange: false, // 是否展示变式下拉框
-      saveList: [], // 搜索保存数据列表
-      saveFormName: "", // 当前保存数据名称
-      isSaveShow: false, // 是否展示保存操作
-      isSelectShow: false, // 是否展示选择操作
-      selectForm: "", // 当前选中数据
-      currentExpandNumber: 4, // 当前收起展示数量
-      isExpandAll: true,
-      currentTemplate: {},
-      variantList: [],
-      varianId: [],
-      systemName: "shopManagement",
-    };
-  },
-  watch: {
-    modelValue: {
-      handler(newVal) {
-        if (JSON.stringify(newVal) !== JSON.stringify(this.form)) {
-          this.form = JSON.parse(JSON.stringify(newVal));
-        }
-      },
-      deep: true,
-    },
-    form: {
-      handler(newVal) {
-        if (JSON.stringify(newVal) !== JSON.stringify(this.modelValue)) {
-          this.$emit("update:modelValue", newVal);
-        }
-      },
-      deep: true,
-    },
-  },
-  mounted() {
-    this.isExpandStatus = this.isExpand;
-    this.currentExpandNumber = this.expandNumber || this.columnNumber;
-    this.form = JSON.parse(JSON.stringify(this.modelValue));
-    this.defaultForm =
-      JSON.stringify(this.defaultForm) === "{}"
-        ? JSON.parse(JSON.stringify(this.modelValue))
-        : this.defaultForm;
-  },
-  methods: {
-    // 根据renderType设置对应组件
-    setComponent(type) {
-      const typeList = {
-        input: "SearchInput",
-        select: "SearchSelect",
-        date: "SearchDate",
-        dates: "SearchDates",
-        dateRange: "SearchDateRange",
-      };
-      return typeList[type] || "SearchInput";
-    },
-    // 触发提交
-    submitForm(formEl) {
-      if (!this.$refs[formEl]) return;
-      this.$refs[formEl].validate((valid) => {
-        if (valid) {
-          this.$emit("search");
-        }
-      });
-    },
-    // 重置条件
-    resetForm(formEl) {
-      if (!this.$refs[formEl]) return;
-      this.$refs[formEl].resetFields();
-      this.form = JSON.parse(JSON.stringify(this.defaultForm));
-      // 保留页面table分页数据
-      this.form.size = this.modelValue.size;
-      // this.form.page = this.modelValue.page;
-      this.$emit("reset");
-    },
-
-    // 关闭变式
-    handleChangeHide(vis) {
-      if (vis === false) {
-        this.isChange = false;
-        this.isSaveShow = false;
-        this.isSelectShow = false;
-        this.saveFormName = "";
-        this.selectForm = "";
-      }
-    },
-    // 保存搜索表单
-    handleSaveSearchForm() {
-      if (this.saveKey && this.isSave) {
-        if (Object.keys(this.form).length === 0) {
-          this.$message.error("搜索条件为空！");
-          return;
-        }
-        let tempObj = Object.assign({}, this.form, {
-          searchSaveName: this.saveFormName,
-          id: dayjs().valueOf() + Math.random() + "",
-        });
-        let obj = {
-          route: this.$route.name,
-          system: this.systemName,
-          variant: [tempObj],
-        };
-        let resObj = this.variantList.find((it) => {
-          return it.route === this.$route.name;
-        });
-        if (resObj) {
-          resObj.variant.push(tempObj);
-        } else {
-          this.variantList.push(obj);
-        }
-        if (this.isCloud) {
-          let params = {
-            id: this.varianId,
-            username: JSON.parse(sessionStorage.userAuthInfo).username,
-            system: this.systemName,
-            menu: this.saveKey,
-            content: JSON.stringify(this.variantList),
-          };
-        } else {
-          localStorage.setItem("variantList", JSON.stringify(this.variantList));
-        }
-      }
-    },
-    // 选择保存过的搜索历史
-    handleSearchSelect(val) {
-      let obj = this.saveList.find((it) => {
-        return it.id === val;
-      });
-      if (obj) {
-        let rObj = JSON.parse(JSON.stringify(obj));
-        delete rObj.id;
-        delete rObj.searchSaveName;
-        this.$emit("update:modelValue", rObj);
-      }
-    },
-    // 删除保存过的搜索历史
-    handleDeleteSearchList(index) {
-      let tempList = JSON.parse(JSON.stringify(this.saveList));
-      tempList.splice(index, 1);
-      if (this.saveKey && this.isSave) {
-        // 更新逻辑，视具体API而定
-      }
-    },
-    // 禁止选择日期
-    disabledDate(date, currentSource, limitDate = "") {
-      if (limitDate) {
-        if (currentSource === "prev") {
-          return dayjs(date.getTime()).isAfter(dayjs(limitDate), "day");
-        }
-        if (currentSource === "next") {
-          return dayjs(date.getTime()).isBefore(dayjs(limitDate), "day");
-        }
-      }
-    },
-    // 一键收缩展开
-    expandAll() {
-      this.isExpandAll = !this.isExpandAll;
-    },
-  },
-};
-</script>
-<style lang="scss" scoped>
-@keyframes slide-animation {
-  from {
-    width: 100%;
-    height: auto;
-    margin-top: 0;
-    padding: 15px 60px 0 15px;
-    // transform: scale(1);
-    opacity: 1;
-  }
-
-  to {
-    width: 0;
-    height: 0;
-    margin-top: -10px;
-    padding: 0;
-    // transform: scale(0);
-    opacity: 0;
-  }
-}
-
-#search-wrap {
-  width: 100%;
-  background: var(--color-bg-2);
-  // position: relative;
-  overflow: hidden;
-  .arco-col {
-    margin: 5px 0;
-    padding: 0 !important;
-  }
-
-  .arco-form-item-label {
-    padding-right: 10px;
-  }
-
-  // .el-col-6 {
-  //   margin: 5px 0;
-  // }
-
-  .control-button {
-    position: absolute;
-    top: 10px;
-    right: 20px;
-    z-index: 99;
-    cursor: pointer;
-
-    .expand-img {
-      width: 24px;
-      height: 24px;
-      cursor: pointer;
-      transition: all 0.5s linear;
-
-      &.close {
-        transform: rotate(180deg);
-      }
-    }
-  }
-
-  .arco-form-item-content-flex {
-    display: block;
-  }
-
-  .search-content {
-    position: relative;
-    // border: 1px solid #e5e5e5;
-    box-sizing: border-box;
-    width: 100%;
-    // transition: width .3s linear;
-    margin-top: 0;
-    padding: 0 0 0px 0;
-
-    &.close {
-      width: 0;
-      height: 0;
-      margin-top: -10px;
-      padding: 0;
-      overflow: hidden;
-      opacity: 0;
-      animation: slide-animation 0.3s;
-    }
-
-    .expand-row {
-      padding-bottom: 40px;
-    }
-
-    .control {
-      position: absolute;
-      right: 0;
-      bottom: 0;
-      z-index: 9;
-      display: flex;
-      justify-content: flex-end;
-      align-items: flex-end;
-      .reset {
-        width: 90px;
-        height: 32px;
-        margin-right: 0px;
-        border: none;
-        background-color: #eeeefc;
-        color: var(--el-color-primary);
-        border-radius: 2px;
-        font-size: 12px;
-        & > span {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-
-          .el-icon--left {
-            margin-right: 5px;
-          }
-        }
-      }
-
-      .submit {
-        width: 90px;
-        height: 32px;
-        background-color: var(--el-color-primary);
-        border: none;
-        border-radius: 2px;
-        & > span {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-
-          .el-icon--left {
-            margin-right: 5px;
-          }
-        }
-      }
-
-      .expand-button {
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-        box-sizing: border-box;
-        width: 40px;
-        padding-right: 5px;
-        cursor: pointer;
-
-        & > span {
-          color: #505050;
-          font-size: 12px;
-        }
-      }
-
-      .hidden {
-        visibility: hidden;
-        width: 0px;
-      }
-
-      .save {
-        position: relative;
-        // width: 84px;
-        height: 30px;
-        padding: 0;
-        padding: 0 10px;
-        // background: #bda87c;
-
-        .save-text {
-          display: flex;
-          align-items: center;
-          justify-content: center;
-          width: 84px;
-          height: 30px;
-
-          & > span {
-            padding-right: 10px;
-            padding-left: 10px;
-            border-right: 1px solid #fff;
-          }
-
-          & > i {
-            padding-left: 10px;
-          }
-        }
-      }
-    }
-
-    .el-form {
-      position: relative;
-    }
-
-    .el-form-item {
-      margin-bottom: 10px;
-
-      .el-form-item__label {
-        padding-right: 5px;
-        font-size: 12px;
-        user-select: none;
-      }
-      // .arco-select__tags-text {
-      //   max-width: 80px !important;
-      // }
-      .select-trigger {
-        width: 100%;
-
-        .el-select__tags {
-          // max-width: calc(100% - 0px) !important;
-          & > span {
-            max-width: 100%;
-
-            .el-tag--info {
-              max-width: 100% !important;
-
-              &:first-child {
-                .el-select__tags-text {
-                  max-width: 100% !important;
-                }
-              }
-
-              &:nth-child(2) {
-                // display: none;
-                .arco-select__tags-text {
-                  max-width: 100% !important;
-                }
-              }
-            }
-          }
-        }
-      }
-
-      .el-date-editor.el-input,
-      .el-date-editor.el-input__inner {
-        width: 100%;
-      }
-
-      .el-select .el-select__tags {
-        display: flex;
-        flex-wrap: nowrap;
-
-        & > span {
-          display: flex;
-          flex-wrap: nowrap;
-        }
-      }
-
-      .date-section {
-        position: relative;
-        margin-bottom: 0 !important;
-
-        .el-input--small .el-input__inner {
-          padding-right: 20px;
-          padding-left: 15px;
-        }
-
-        .el-input__prefix {
-          display: none;
-        }
-
-        .date-section-line {
-          position: absolute;
-          top: 50%;
-          left: 50%;
-          transform: translate(-50%, -50%);
-        }
-      }
-    }
-  }
-}
-
-.hide {
-  display: none !important;
-}
-
-.search-panel-popover {
-  // background: red;
-  box-sizing: border-box;
-  position: relative;
-  .save-controls {
-    & > div {
-      & > span {
-        cursor: pointer;
-        display: block;
-        padding: 5px 0;
-        &:hover {
-          color: #155752;
-        }
-      }
-    }
-    .save-form {
-      width: 160px;
-      height: 40px;
-      background: #ffffff;
-      display: flex;
-      align-items: center;
-      justify-content: flex-start;
-      transform: translateX(-14px);
-      .save-form-button {
-        margin-left: 10px;
-      }
-      .save-form-input {
-        width: 84px;
-      }
-      .el-button--primary.is-disabled {
-        background: #155752;
-        opacity: 0.6;
-      }
-      .save-form-select {
-        width: 160px;
-      }
-    }
-  }
-}
-
-.select-popper {
-  .el-select-dropdown__item {
-    padding: 0 10px;
-  }
-  .select-content {
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    box-sizing: border-box;
-    .select-content-button {
-      border: none;
-      background: none;
-      flex-shrink: 0;
-      box-sizing: border-box;
-      padding: 7px;
-      border-radius: 100%;
-      &:hover {
-        .el-icon--close {
-          opacity: 1;
-        }
-      }
-      .el-icon--close {
-        opacity: 0.6;
-        display: block;
-        color: #155752;
-        width: 12px;
-        height: 12px;
-      }
-    }
-  }
-}
-</style>
-

package/dist/components/lwSearch/input/input.vue

@@ -1,55 +0,0 @@
-<template>
-  <div>
-    <el-input
-      :type="item.type || 'text'"
-      :disabled="item.disabled"
-      :placeholder="item.label || $t('lwSearch.please_input')"
-      :maxlength="item.maxlength"
-      :minlength="item.minlength"
-      :show-word-limit="item.showWordLimit"
-      :autosize="item.autosize || { minRows: 2 }"
-      allow-clear
-      clearable
-      v-model="value"
-    />
-  </div>
-</template>
-
-<script>
-export default {
-  emits: ["update:modelValue", "change"],
-  name: "Input",
-  props: {
-    disabled: { // 是否禁止操作
-      type: Boolean,
-      default: false
-    },
-    modelValue: { // 绑定的结果
-      type: [String, Number],
-      default: ""
-    },
-    item: { // 配置项
-      type: Object,
-      default: () => ({})
-    },
-  },
-  data() {
-    return {
-      value: this.modelValue
-    };
-  },
-  watch: {
-    modelValue(newVal) {
-      this.value = newVal;
-    },
-    value(newVal) {
-      const filter = this.item.filter ?? false;
-      if (filter) {
-        newVal = newVal.replace(/ /g, ',').replace(/\,/g, ',').replace(/\，/g, ',').replace(/\n/g, ',');
-      }
-      this.$emit('update:modelValue', newVal);
-      this.$emit('change', newVal);
-    }
-  }
-};
-</script>

package/dist/components/lwSearch/locale/en-us.js

@@ -1,15 +0,0 @@
-export default {
-	lwSearch: {
-		please_select: 'Please select',
-		please_input: 'Please input',
-		dateRange: {
-			startPlaceholder: 'Start Time',
-			endPlaceholder: 'End Time'
-		},
-		monthRange: {
-			rangeSeparator:'To',
-			startPlaceholder: 'Start Month',
-			endPlaceholder: 'End Month'
-		}
-	}
-}

package/dist/components/lwSearch/locale/zh-cn.js

@@ -1,15 +0,0 @@
-export default {
-	lwSearch: {
-		please_select: '请选择',
-		please_input: '请输入',
-		dateRange: {
-			startPlaceholder: '开始时间',
-			endPlaceholder: '结束时间'
-		},
-		monthRange: {
-			rangeSeparator:'至',
-			startPlaceholder: '开始月',
-			endPlaceholder: '结束月'
-		}
-	}
-}