bl-common-vue3 3.8.111 → 3.8.113

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bl-common-vue3",
-  "version": "3.8.111",
+  "version": "3.8.113",
   "main": "index.js",
   "module": "index.js",
   "description": "bailing vue3 common components lib",

package/src/common/utils/xlsx.js

@@ -5,6 +5,54 @@ const DEFAULT_COLUMN_WIDTH = 16;
 const MAX_COLUMN_WIDTH = 36;
 const HEADER_ROW_HEIGHT = 30;
 const DATA_ROW_HEIGHT = 24;
+const XLSX_MIME_TYPE =
+  "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8";
+const INVALID_FILE_NAME_REG = /[\\/:*?"<>|]/g;
+
+const getSafeXlsxFileName = (filename) => {
+  const safeName =
+    String(filename || "excel")
+      .replace(INVALID_FILE_NAME_REG, "_")
+      .trim() || "excel";
+  return /\.xlsx$/i.test(safeName) ? safeName : `${safeName}.xlsx`;
+};
+
+const isWeComBrowser = () => {
+  const ua = typeof navigator === "undefined" ? "" : navigator.userAgent || "";
+  return /wxwork|MicroMessenger/i.test(ua);
+};
+
+const saveByLink = (blob, fileName) => {
+  const objectUrl = window.URL.createObjectURL(blob);
+  const link = document.createElement("a");
+  link.style.display = "none";
+  link.href = objectUrl;
+  link.download = fileName;
+  document.body.appendChild(link);
+  link.click();
+  link.remove();
+  window.setTimeout(() => window.URL.revokeObjectURL(objectUrl), 0);
+};
+
+const saveXlsxBlob = (blob, filename) => {
+  const fileName = getSafeXlsxFileName(filename);
+  const file =
+    typeof File === "function"
+      ? new File([blob], fileName, { type: XLSX_MIME_TYPE })
+      : blob;
+
+  if (window.navigator?.msSaveOrOpenBlob) {
+    window.navigator.msSaveOrOpenBlob(file, fileName);
+    return;
+  }
+
+  if (isWeComBrowser()) {
+    saveByLink(file, fileName);
+    return;
+  }
+
+  fs.saveAs(file, fileName);
+};
 
 const createBorder = (color) => ({
   top: { style: "thin", color: { rgb: color } },
@@ -33,56 +81,56 @@ const getStyledExportOptions = (options = {}) => {
       columnWidths && typeof columnWidths === "object" ? columnWidths : {},
   };
 };
-
+
 export function getVerticalMergeCells(json, fields, options = {}) {
-  const { groupField, mergeFields = [] } = options;
-  if (!groupField || !Array.isArray(mergeFields) || !mergeFields.length) {
-    return [];
-  }
-
-  const fieldKeys = Object.keys(fields);
-  const mergeColumnIndexes = mergeFields
-    .map((field) => fieldKeys.indexOf(field))
-    .filter((columnIndex) => columnIndex >= 0);
-  if (!mergeColumnIndexes.length) {
-    return [];
-  }
-
-  const merges = [];
-  let groupStartIndex = 0;
-
-  const appendGroupMerges = (groupEndIndex) => {
-    const groupValue = json[groupStartIndex]?.[groupField];
-    if (
-      groupEndIndex <= groupStartIndex ||
-      groupValue === undefined ||
-      groupValue === null ||
-      groupValue === ""
-    ) {
-      return;
-    }
-
-    mergeColumnIndexes.forEach((columnIndex) => {
-      merges.push({
-        // 工作表第 0 行是表头，数据行需要整体向下偏移一行。
-        s: { r: groupStartIndex + 1, c: columnIndex },
-        e: { r: groupEndIndex + 1, c: columnIndex },
-      });
-    });
-  };
-
-  for (let rowIndex = 1; rowIndex <= json.length; rowIndex++) {
-    const groupChanged =
-      rowIndex === json.length ||
-      json[rowIndex]?.[groupField] !== json[groupStartIndex]?.[groupField];
-    if (!groupChanged) {
-      continue;
-    }
-
-    appendGroupMerges(rowIndex - 1);
-    groupStartIndex = rowIndex;
-  }
-
+  const { groupField, mergeFields = [] } = options;
+  if (!groupField || !Array.isArray(mergeFields) || !mergeFields.length) {
+    return [];
+  }
+
+  const fieldKeys = Object.keys(fields);
+  const mergeColumnIndexes = mergeFields
+    .map((field) => fieldKeys.indexOf(field))
+    .filter((columnIndex) => columnIndex >= 0);
+  if (!mergeColumnIndexes.length) {
+    return [];
+  }
+
+  const merges = [];
+  let groupStartIndex = 0;
+
+  const appendGroupMerges = (groupEndIndex) => {
+    const groupValue = json[groupStartIndex]?.[groupField];
+    if (
+      groupEndIndex <= groupStartIndex ||
+      groupValue === undefined ||
+      groupValue === null ||
+      groupValue === ""
+    ) {
+      return;
+    }
+
+    mergeColumnIndexes.forEach((columnIndex) => {
+      merges.push({
+        // 工作表第 0 行是表头，数据行需要整体向下偏移一行。
+        s: { r: groupStartIndex + 1, c: columnIndex },
+        e: { r: groupEndIndex + 1, c: columnIndex },
+      });
+    });
+  };
+
+  for (let rowIndex = 1; rowIndex <= json.length; rowIndex++) {
+    const groupChanged =
+      rowIndex === json.length ||
+      json[rowIndex]?.[groupField] !== json[groupStartIndex]?.[groupField];
+    if (!groupChanged) {
+      continue;
+    }
+
+    appendGroupMerges(rowIndex - 1);
+    groupStartIndex = rowIndex;
+  }
+
   return merges;
 }
 
@@ -188,14 +236,14 @@ export async function createWorkbook(
     : null;
   //导出xlsx
   json.forEach((item) => {
-    for (let i in item) {
-      // eslint-disable-next-line no-prototype-builtins
-      if (fields.hasOwnProperty(i)) {
-        item[fields[i]] = item[i];
-      }
-      delete item[i]; //删除原先的对象属性
-    }
-  });
+    for (let i in item) {
+      // eslint-disable-next-line no-prototype-builtins
+      if (fields.hasOwnProperty(i)) {
+        item[fields[i]] = item[i];
+      }
+      delete item[i]; //删除原先的对象属性
+    }
+  });
   let wb = XLSX.utils.book_new(); //工作簿对象包含一SheetNames数组，以及一个表对象映射表名称到表对象。XLSX.utils.book_new实用函数创建一个新的工作簿对象。
   let ws = XLSX.utils.json_to_sheet(json, { header: Object.values(fields) }); //将JS对象数组转换为工作表。
   if (merges.length) {
@@ -223,32 +271,32 @@ export async function xlsx(
   const sheetName = filename.replace(/[\\/?*[\]:]/g, "").slice(0, 31) || "Sheet1"; //excel的文件名称
   wb.SheetNames.push(sheetName);
   wb.Sheets[sheetName] = ws;
-  const defaultCellStyle = {
-    font: { name: "Verdana", sz: 13, color: "FF00FF88" },
-    fill: { fgColor: { rgb: "FFFFAA00" } },
-  }; //设置表格的样式
-  let wopts = {
-    bookType: "xlsx",
-    bookSST: false,
-    type: "binary",
-    cellStyles: true,
-    defaultCellStyle: defaultCellStyle,
-    showGridLines: false,
-  }; //写入的样式
-  let wbout = XLSX.write(wb, wopts);
-  let blob = new Blob([s2ab(wbout)], { type: "application/octet-stream" });
-  fs.saveAs(blob, filename + ".xlsx");
-}
-const s2ab = (s) => {
-  var buf;
-  if (typeof ArrayBuffer !== "undefined") {
-    buf = new ArrayBuffer(s.length);
-    var view = new Uint8Array(buf);
-    for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff;
-    return buf;
-  } else {
-    buf = new Array(s.length);
-    for (var n = 0; n != s.length; ++n) buf[n] = s.charCodeAt(n) & 0xff;
-    return buf;
-  }
-};
+  const defaultCellStyle = {
+    font: { name: "Verdana", sz: 13, color: "FF00FF88" },
+    fill: { fgColor: { rgb: "FFFFAA00" } },
+  }; //设置表格的样式
+  let wopts = {
+    bookType: "xlsx",
+    bookSST: false,
+    type: "binary",
+    cellStyles: true,
+    defaultCellStyle: defaultCellStyle,
+    showGridLines: false,
+  }; //写入的样式
+  let wbout = XLSX.write(wb, wopts);
+  let blob = new Blob([s2ab(wbout)], { type: XLSX_MIME_TYPE });
+  saveXlsxBlob(blob, filename);
+}
+const s2ab = (s) => {
+  var buf;
+  if (typeof ArrayBuffer !== "undefined") {
+    buf = new ArrayBuffer(s.length);
+    var view = new Uint8Array(buf);
+    for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xff;
+    return buf;
+  } else {
+    buf = new Array(s.length);
+    for (var n = 0; n != s.length; ++n) buf[n] = s.charCodeAt(n) & 0xff;
+    return buf;
+  }
+};

package/src/components/ExtraManage/components/ExtraManageEdit.vue

@@ -111,6 +111,15 @@
           :config="item"
           :validateInfo="validateInfos[item.key]"
         />
+        <a-col :span="8" v-if="displayStatus">
+          <a-form-item :label="t('common.table.status')">
+            <a-switch
+                v-model:checked="formState.status"
+                :checkedValue="1"
+                :unCheckedValue="0"
+            />
+          </a-form-item>
+        </a-col>
         <a-col :span="24">
           <div class="text-title">{{t('components.extraManageEdit.enterSetting')}}</div>
         </a-col>
@@ -272,6 +281,10 @@ export default defineComponent({
       type: Array,
       default: () => [],
     },
+    displayStatus:{
+      type: Boolean,
+      default: true,
+    },
   },
   components: {
     BlModal,
@@ -575,6 +588,9 @@ export default defineComponent({
     const init = () => {
       gettypelist('extra_field_type')
       getCompanyList();
+      if (props.displayStatus){
+        state.formState.status = 1
+      }
       if (props.id) {
         // 编辑
         let detailInfo = props.requestAllInfo.detail;

package/src/components/ExtraManage/index.vue

@@ -28,6 +28,14 @@
           @change="handleCustomConfigChange($event, record, item)"
         />
       </template>
+      <template #column-status="{record}">
+        <a-switch
+            :checked="getStatusValue(record)"
+            :checkedValue="1"
+            :unCheckedValue="0"
+            @change="statusChange(record, $event)"
+        />
+      </template>
       <template #column-action="{ record }">
         <div v-if="record.is_system == 1">
           <a-button @click="handleEdit(record)" type="link" v-if="record?.can_edit">{{t('common.button.edit')}}</a-button>
@@ -52,6 +60,7 @@
       :requestAllInfo="requestAllInfo"
       :requestAllParams="requestAllParams"
       :displayCompany="displayCompany"
+      :display-status="displayStatus"
       :expandFieldsExtraParams="expandFieldsExtraParams"
       :id="editId"
       :hasVillageSelect="hasVillageSelect"
@@ -135,6 +144,11 @@ export default defineComponent({
       type: Array,
       default: () => [],
     },
+    // 是否展示状态
+    displayStatus:{
+      type: Boolean,
+      default: false,
+    },
   },
   components: {
     BlDrawer,
@@ -147,6 +161,7 @@ export default defineComponent({
       editVisible: false,
       editId: 0,
       customTable: null,
+      statusMap: {},
     });
 
     // 处理后的自定义配置项
@@ -298,6 +313,15 @@ export default defineComponent({
       const fillColumnIndex = _deepColumns.findIndex((column) => column.key === 'fill');
       const customColumns = getColumnsVisibleCustomConfigItems(normalizedCustomConfigItems.value);
       _deepColumns.splice(fillColumnIndex, 0, ...customColumns);
+      if (props.displayStatus){
+        let index = _deepColumns.length - 3
+        _deepColumns.splice(index, 0, {
+          title: t('common.table.status'),
+          dataIndex: "status" ,
+          key: 'status',
+          width: 120,
+        })
+      }
       return _deepColumns;
     });
 
@@ -346,6 +370,40 @@ export default defineComponent({
       });
     };
 
+    const getStatusValue = (record) => {
+      const key = record?.id;
+      if (Object.prototype.hasOwnProperty.call(state.statusMap, key)) {
+        return state.statusMap[key];
+      }
+      return Number(record?.status) === 1 ? 1 : 0;
+    }
+
+    const statusChange = (record, checked) => {
+      const status = checked ? 1 : 0;
+      const oldStatus = getStatusValue(record);
+      state.statusMap[record.id] = status;
+      record.status = status;
+      const params = { ...record, status };
+      // 编辑
+      emit("request", {
+        params: {
+          method: 'put',
+          server: props.requestAllInfo.edit.service,
+          url: props.requestAllInfo.edit.serviceUrl.replace(/\${id}/g, record.id),
+          extra: {
+            ...params,
+          },
+        },
+        success: (res) => {
+          message.success(res?.msg || t('common.save.success'));
+        },
+        fail: () => {
+          state.statusMap[record.id] = oldStatus;
+          record.status = oldStatus;
+        },
+      })
+    }
+
     return {
       t,
       ...toRefs(state),
@@ -361,6 +419,8 @@ export default defineComponent({
       getCustomConfigEditorProps,
       handleCustomConfigChange,
       editableCustomConfigItems,
+      getStatusValue,
+      statusChange,
     };
   },
 });