JLHWEB: 1、修复床垫报价修改时因添加床网导致主键报错问题；2、床垫床网计算公式，支持一键复制；3、床网报价弹簧成本和重量支持显示，包括显示损耗率

JLHWEB/src/components/LjSelector/select.vue

@@ -13,7 +13,7 @@
     :loading="loading"
     :no-match-text="noMatchText"
     :remote-method="remoteMethod"
-    :popper-class="`lj-select__popper ${popperClass}`"
+    :popper-class="`lj-select__popper ${popperClass ? popperClass : ''}`"
     @focus="handleFocus"
     @change="handleSelect"
   >
@@ -68,6 +68,7 @@ const emit = defineEmits(["select", "update:value", "openModal", "focus"]);
 const LjSelectSelectRef = ref();
 
 const handleSelect = (item: any) => {
+  console.log("LjSelectorSelect handleSelect 手动选 item :>> ", item);
   // if (item.disabled) {
   //   return;
   // }

JLHWEB/src/utils/index.ts

@@ -1360,3 +1360,19 @@ export const text2Formula = (str: any) => {
 
   throw new Error(`无法解析规则: ${str}`);
 };
+
+/**
+ * @description 事件: 一键复制
+ */
+export const copyFunc = (data: any) => {
+  const input = document.createElement("textarea");
+  input.value = data;
+  document.body.appendChild(input);
+  input.select();
+  document.execCommand("Copy");
+  document.body.removeChild(input);
+  ElMessage({
+    type: "success",
+    message: "复制成功"
+  });
+};

JLHWEB/src/views/quote/bednetQuote/components/AllFormula.vue

@@ -52,18 +52,46 @@
       </div>
     </template>
     <template #default>
-      <!-- <el-row :gutter="10" class="">
-        <el-col> -->
       <LjHeader class="flx-1" title="单据统计" />
-      <FormulaGroup :data="isNormalFormulas" :fields="fieldsReplace" />
+      <el-skeleton :loading="formulaList.length == 0" animated :count="6">
+        <template #template>
+          <div style="display: flex; align-items: center; justify-items: space-between; margin-top: 16px; height: 24px">
+            <el-skeleton-item variant="h1" style="width: 120px" />
+            <el-skeleton-item variant="h1" style="margin-left: 16px" />
+          </div>
+        </template>
+        <template #default>
+          <FormulaGroup :data="isNormalFormulas" :fields="fieldsReplace" />
+        </template>
+      </el-skeleton>
 
       <LjHeader class="flx-1 mt-16" title="详细报价" />
-      <FormulaGroup :data="isMxFormulas" :fields="fieldsReplace" />
+
+      <el-skeleton :loading="formulaList.length == 0" animated :count="6">
+        <template #template>
+          <div style="display: flex; align-items: center; justify-items: space-between; margin-top: 16px; height: 24px">
+            <el-skeleton-item variant="h1" style="width: 120px" />
+            <el-skeleton-item variant="h1" style="margin-left: 16px" />
+          </div>
+        </template>
+        <template #default>
+          <FormulaGroup :data="isMxFormulas" :fields="fieldsReplace" />
+        </template>
+      </el-skeleton>
 
       <LjHeader class="flx-1 mt-16" title="重量" />
-      <FormulaGroup :data="isWeigthFormulas" :fields="fieldsReplace" />
-      <!-- </el-col>
-      </el-row> -->
+
+      <el-skeleton :loading="formulaList.length == 0" animated :count="6">
+        <template #template>
+          <div style="display: flex; align-items: center; justify-items: space-between; margin-top: 16px; height: 24px">
+            <el-skeleton-item variant="h1" style="width: 120px" />
+            <el-skeleton-item variant="h1" style="margin-left: 16px" />
+          </div>
+        </template>
+        <template #default>
+          <FormulaGroup :data="isWeigthFormulas" :fields="fieldsReplace" />
+        </template>
+      </el-skeleton>
     </template>
   </LjDrawer>
 </template>
@@ -79,6 +107,16 @@ import FormulaGroup from "./FormulaGroup.vue";
 import LjHeader from "@/components/LjHeader/index.vue";
 import { cloneDeep } from "lodash-es";
 
+interface WidgetProps {
+  /**
+   * @description 字段对照表
+   */
+  replace: any[];
+  formula: any[];
+}
+
+const props = withDefaults(defineProps<WidgetProps>(), {});
+
 const { t } = useI18n();
 const { prefixCls } = useDesign("bednet-formal-detail");
 const globalStore = useGlobalStore();
@@ -87,7 +125,6 @@ const visible = ref(false);
 const LjDrawerRef = ref();
 const formulaList = ref<any>([]);
 const fieldsReplace = ref<any>([]);
-const mainData = ref<any>({});
 const formulaMxList = ref<any>([]);
 
 const buildTreeArr = (items, parentId = null) => {
@@ -159,12 +196,60 @@ const isNormalFormulas = computed(() => {
 });
 
 const isMxFormulas = computed(() => {
-  return formulaList.value.filter((item: any) => item.type == 2);
+  let arr = formulaList.value.filter((item: any) => item.type == 2 && !/【\d+弹簧材料总成本】/.test(item.label));
+  let springArr = formulaList.value.filter((item: any) => item.type == 2 && /【\d+弹簧材料总成本】/.test(item.label));
+  console.log("springArr :>> ", springArr);
+  if (springArr.length > 0) {
+    arr = arr.map((item: any) => {
+      if (item.label == "【弹簧材料总成本】") {
+        item.children = springArr;
+      }
+      return item;
+    });
+  }
+  return arr;
 });
 const isWeigthFormulas = computed(() => {
-  return formulaList.value.filter((item: any) => item.type == 3);
+  let arr = formulaList.value.filter((item: any) => item.type == 3 && !/【\d+钢丝重量】/.test(item.label));
+  let wireArr = formulaList.value.filter((item: any) => item.type == 3 && /【\d+钢丝重量】/.test(item.label));
+  if (wireArr.length > 0) {
+    arr = arr.map((item: any) => {
+      if (item.label == "【钢丝重量】") {
+        item.children = wireArr;
+      }
+      return item;
+    });
+  }
+  return arr;
 });
 
+watch(
+  () => visible.value,
+  val => {
+    if (!val) {
+      // searchField.value = "";
+      LjDrawerRef.value.hide();
+      // selectColumn.value = [];
+      // ifAllSelect.value = false;
+    }
+    return;
+  }
+);
+
+watch(
+  () => props.formula,
+  val => {
+    formulaList.value = val;
+  }
+);
+
+watch(
+  () => props.replace,
+  val => {
+    fieldsReplace.value = val;
+  }
+);
+
 const autoClose = () => {
   setTimeout(() => {
     visible.value = false;
@@ -183,32 +268,13 @@ const cancelClick = () => {
  */
 const open = (formulas: any, replace: any, data: any) => {
   visible.value = true;
-  formulaList.value = formulas;
-  fieldsReplace.value = replace;
-  mainData.value = data;
+  // formulaList.value = formulas;
+  // fieldsReplace.value = replace;
 
-  formulaMxList.value;
+  // formulaMxList.value;
 
   nextTick(() => {
-    //   list.value = cloneDeep(params);
-    //   oriList.value = cloneDeep(params);
-
-    //   let arr: string[] = [];
-    //   params.map((item: any) => {
-    //     if (item.basicinfo && item.basicinfo.hasOwnProperty("group")) {
-    //       item.basicinfo.group && !arr.includes(item.basicinfo.group) && arr.push(item.basicinfo.group);
-    //     }
-    //   });
-    //   groupList.value = arr;
-
-    //   selectGroup.value = group;
-
     LjDrawerRef.value.show();
-    //   console.log("open columnsDrag.value :>> ", columnsDrag.value);
-
-    //   nextTick(() => {
-    //     initDragSelect();
-    //   });
   });
 };
 

JLHWEB/src/views/quote/bednetQuote/components/FormulaGroup.vue

@@ -30,7 +30,12 @@
       </div>
     </div>
     <div class="flx-1 overflow-auto">
-      <FormulaItem :data="item" :fields="fields" :formula="data" />
+      <template v-if="item?.children">
+        <FormulaItem v-for="(itm, index) in item?.children" :data="itm" :fields="fields" :formula="data" :key="index" />
+      </template>
+      <template v-else>
+        <FormulaItem :data="item" :fields="fields" :formula="data" />
+      </template>
     </div>
   </div>
 </template>
@@ -47,6 +52,7 @@ interface WidgetProps {
    */
   fields: any[];
   width?: number;
+  formulaArr?: any[];
 }
 
 const props = withDefaults(defineProps<WidgetProps>(), {

JLHWEB/src/views/quote/bednetQuote/components/FormulaItem.vue

@@ -5,8 +5,7 @@
 <script setup lang="tsx" name="BednetFormulaItem">
 // import type { formulasProp } from "../index.vue";
 // import { ElScrollbar } from "element-plus";
-import { formatAmount3 } from "@/utils/index";
-import { isFilterPrice } from "@/utils/index";
+import { formatAmount3, isFilterPrice, copyFunc } from "@/utils/index";
 import { InfoFilled } from "@element-plus/icons-vue";
 
 interface itemProps {
@@ -59,6 +58,32 @@ const funcFormulaToArray = (formula: string) => {
   return result.filter(t => t);
 };
 
+/**
+ * @description 点击复制替换的公式
+ * @param event
+ * @param data 公式数组
+ */
+const toClickFormula = (e: any, data: any) => {
+  e.stopPropagation();
+
+  let _formula = data.map((o, i) => {
+    let str = o;
+    if (o.indexOf("[") > -1 && o.indexOf("]") > -1) {
+      let fieldName = o.slice(1, -1); // 去掉方括号
+      let sumVal = props.fields.find(f => {
+        let _label = f.label.slice(1, -1);
+        if (_label === fieldName) {
+          return f;
+        }
+      });
+      str = sumVal.value;
+    }
+    return str;
+  });
+
+  copyFunc(_formula.join(""));
+};
+
 const RenderVariable = (data: any, rprops: any) => {
   let fieldName = data.slice(1, -1); // 去掉方括号
 
@@ -176,7 +201,7 @@ const RenderFormulaItem = (rprops: any) => {
     return (
       <>
         {/* <ElScrollbar> */}
-        <div class="formula-wrapper">
+        <div class="formula-wrapper" onClick={v => toClickFormula(v, fArr)}>
           {fArr.map((t, i) => {
             if (t.indexOf("[") === 0 && !rprops.data.ifnotreplace) {
               return RenderVariable(t, rprops);

JLHWEB/src/views/quote/bednetQuote/detail.vue

@@ -82,7 +82,7 @@
 
   <MtrldefDialog ref="MtrldefDialogRef" v-bind="MtrldefDialogProps" />
   <SpringDialog ref="SpringDialogRef" v-bind="SpringDialogProps" />
-  <AllFormula ref="AllFormulaRef" />
+  <AllFormula ref="AllFormulaRef" :formula="cmpFormulas" :replace="cmpFormulaReplace" />
 </template>
 
 <script setup lang="ts" name="bednetQuoteDetail">
@@ -745,6 +745,6 @@ const funcAfterMound = async (data: any) => {
 };
 
 const gotoShowFormula = () => {
-  AllFormulaRef.value.open(cmpFormulas.value, cmpFormulaReplace.value);
+  AllFormulaRef.value.open();
 };
 </script>

JLHWEB/src/views/quote/mattressQuote/components/AllFormula.vue

@@ -26,18 +26,38 @@
       <!-- <template v-if="iforigin"> -->
       <el-tabs v-model="activeName">
         <el-tab-pane label="新公式" name="first">
-          <FormulaGroup :data="isNormalFormulasPart1" :fields="isFieldsReplace" />
-          <FormulaGroup
-            v-for="(itm, index) in isFieldsReplaceBendet"
-            :key="index"
-            :prefix-label="'床网' + (index + 1)"
-            :data="isNormalFormulasBednet"
-            :fields="itm.replace"
-          />
-          <FormulaGroup :data="isNormalFormulasPart2" :fields="isFieldsReplace" />
+          <el-skeleton :loading="formulaList.length == 0" animated :count="8">
+            <template #template>
+              <div style="display: flex; align-items: center; justify-items: space-between; margin-top: 16px; height: 24px">
+                <el-skeleton-item variant="h1" style="width: 120px" />
+                <el-skeleton-item variant="h1" style="margin-left: 16px" />
+              </div>
+            </template>
+            <template #default>
+              <FormulaGroup :data="isNormalFormulasPart1" :fields="isFieldsReplace" />
+              <FormulaGroup
+                v-for="(itm, index) in isFieldsReplaceBendet"
+                :key="index"
+                :prefix-label="'床网' + (index + 1)"
+                :data="isNormalFormulasBednet"
+                :fields="itm.replace"
+              />
+              <FormulaGroup :data="isNormalFormulasPart2" :fields="isFieldsReplace" />
+            </template>
+          </el-skeleton>
         </el-tab-pane>
         <el-tab-pane label="旧公式" name="second" v-if="iforigin">
-          <FormulaGroup :data="isNormalFormulasOri" :fields="isFieldsReplaceOri" />
+          <el-skeleton :loading="formulaList.length == 0" animated :count="8">
+            <template #template>
+              <div style="display: flex; align-items: center; justify-items: space-between; margin-top: 16px; height: 24px">
+                <el-skeleton-item variant="h1" style="width: 120px" />
+                <el-skeleton-item variant="h1" style="margin-left: 16px" />
+              </div>
+            </template>
+            <template #default>
+              <FormulaGroup :data="isNormalFormulasOri" :fields="isFieldsReplaceOri" />
+            </template>
+          </el-skeleton>
         </el-tab-pane>
       </el-tabs>
       <!-- </template> -->
@@ -62,6 +82,15 @@ import { cloneDeep } from "lodash-es";
 
 interface WidgetProps {
   iforigin: boolean;
+  /**
+   * @description 字段对照表
+   */
+  dannum_type: any;
+  replace: any[];
+  formula: any[];
+  formula_ori: any[];
+  formula_bednet: any[];
+  differ: any[];
 }
 
 const props = withDefaults(defineProps<WidgetProps>(), {
@@ -78,7 +107,7 @@ const formulaList = ref<any>([]);
 const fieldsReplace = ref<any>([]);
 const formulaListOri = ref<any>([]);
 const formulaListBednet = ref<any>([]);
-const differ = ref<any>([]);
+const differArr = ref<any>([]);
 // const mainData = ref<any>({});
 const formulaMxList = ref<any>([]);
 
@@ -218,15 +247,15 @@ const getDannumType = computed(() => {
 });
 
 const isFieldsReplace = computed(() => {
-  let tg = differ.value.find((item: any) => item.type == getDannumType.value);
+  let tg = differArr.value.find((item: any) => item.type == getDannumType.value);
   return tg.replace;
 });
 const isFieldsReplaceBendet = computed(() => {
-  let tg = differ.value.find((item: any) => item.type == getDannumType.value);
+  let tg = differArr.value.find((item: any) => item.type == getDannumType.value);
   return tg.replace_bednet;
 });
 const isFieldsReplaceOri = computed(() => {
-  let tg = differ.value.find((item: any) => item.type == getDannumType.value);
+  let tg = differArr.value.find((item: any) => item.type == getDannumType.value);
   return tg.replace_origin;
 });
 
@@ -265,55 +294,89 @@ const cancelClick = () => {
  * @description 显示组件
  */
 const open = (data: any) => {
-  switch (data.dannum_type) {
-    case 2:
-      dannumValue.value = "标准";
-      break;
-    case 1:
-      dannumValue.value = "散单";
-      break;
-    case 3:
-      dannumValue.value = "大单";
-      break;
-    case 4:
-      dannumValue.value = "小单";
-      break;
-  }
+  // switch (data.dannum_type) {
+  //   case 2:
+  //     dannumValue.value = "标准";
+  //     break;
+  //   case 1:
+  //     dannumValue.value = "散单";
+  //     break;
+  //   case 3:
+  //     dannumValue.value = "大单";
+  //     break;
+  //   case 4:
+  //     dannumValue.value = "小单";
+  //     break;
+  // }
 
   visible.value = true;
-  formulaList.value = data.formula;
-  fieldsReplace.value = data.replace;
-  formulaListOri.value = data.formula_ori;
-  formulaListBednet.value = data.formula_bednet;
-  differ.value = data.differ;
-  // mainData.value = data;
-
-  console.log("formulaListBednet.value :>> ", formulaListBednet.value);
-  // formulaMxList.value;
+  // formulaList.value = data.formula;
+  // fieldsReplace.value = data.replace;
+  // formulaListOri.value = data.formula_ori;
+  // formulaListBednet.value = data.formula_bednet;
+  // differ.value = data.differ;
 
   nextTick(() => {
-    //   list.value = cloneDeep(params);
-    //   oriList.value = cloneDeep(params);
-
-    //   let arr: string[] = [];
-    //   params.map((item: any) => {
-    //     if (item.basicinfo && item.basicinfo.hasOwnProperty("group")) {
-    //       item.basicinfo.group && !arr.includes(item.basicinfo.group) && arr.push(item.basicinfo.group);
-    //     }
-    //   });
-    //   groupList.value = arr;
-
-    //   selectGroup.value = group;
-
     LjDrawerRef.value.show();
-    //   console.log("open columnsDrag.value :>> ", columnsDrag.value);
-
-    //   nextTick(() => {
-    //     initDragSelect();
-    //   });
   });
 };
 
+watch(
+  () => props.formula,
+  val => {
+    formulaList.value = val;
+  },
+  { deep: true }
+);
+
+watch(
+  () => props.replace,
+  val => {
+    fieldsReplace.value = val;
+  },
+  { deep: true }
+);
+watch(
+  () => props.dannum_type,
+  val => {
+    switch (val) {
+      case 2:
+        dannumValue.value = "标准";
+        break;
+      case 1:
+        dannumValue.value = "散单";
+        break;
+      case 3:
+        dannumValue.value = "大单";
+        break;
+      case 4:
+        dannumValue.value = "小单";
+        break;
+    }
+  }
+);
+watch(
+  () => props.formula_ori,
+  val => {
+    formulaListOri.value = val;
+  },
+  { deep: true }
+);
+watch(
+  () => props.formula_bednet,
+  val => {
+    formulaListBednet.value = val;
+  },
+  { deep: true }
+);
+watch(
+  () => props.differ,
+  val => {
+    differArr.value = val;
+  },
+  { deep: true }
+);
+
 defineExpose({
   open
 });

JLHWEB/src/views/quote/mattressQuote/detail.vue

@@ -745,7 +745,16 @@
   <MtrldefDialog ref="MtrldefDialogRef" v-bind="MtrldefDialogProps" />
   <BednetDialog ref="BednetDialogRef" v-bind="BednetDialogProps" />
   <LjDrawerQuoteList ref="QuoteListDrawerRef" :iforigin="isShowOriginFormulaMattress" />
-  <AllFormula ref="AllFormulaRef" :iforigin="isShowOriginFormulaMattress" />
+  <AllFormula
+    ref="AllFormulaRef"
+    :iforigin="isShowOriginFormulaMattress"
+    :dannum_type="currentType"
+    :formula="cmpFormulas"
+    :replace="cmpFormulaReplace"
+    :formula_ori="cmpFormulasOri"
+    :formula_bednet="cmpFormulasBednet"
+    :differ="cmpDiffer"
+  />
 
   <LjDrawer ref="LjDrawerRef" class="lj-drawer-win" size="80%" direction="btt" :title="drawerTitle">
     <BednetDetail
@@ -1578,15 +1587,10 @@ const getData = (params: any) => {
   // return [];
 };
 
-const gotoShowFormula = (data: any) => {
-  AllFormulaRef.value.open({
-    dannum_type: data.type,
-    formula: cmpFormulas.value,
-    replace: cmpFormulaReplace.value,
-    formula_ori: cmpFormulasOri.value,
-    formula_bednet: cmpFormulasBednet.value,
-    differ: cmpDiffer.value
-  });
+const currentType = ref(1);
+const gotoShowFormula = (type: any) => {
+  currentType.value = type;
+  AllFormulaRef.value.open();
 };
 
 const loadingStatus = reactive({
@@ -2060,7 +2064,7 @@ const orderDefaultAction = [
     disabledTextCallBack: () => {
       return userInfo.usermode == 1 ? "业务员模式不可以查看！" : "";
     },
-    clickFunc: item => gotoShowFormula({ type: LjDetailRef.value._mainData.dannum_type })
+    clickFunc: item => gotoShowFormula(LjDetailRef.value._mainData.dannum_type)
   }),
   buttonDefault({
     label: t("common.viewHistoricalQuotes"),

JLHWEB/src/views/quote/mattressQuote/hooks/index.tsx

@@ -1105,6 +1105,7 @@ export const useHooks = (t?: any) => {
       records.thickness = 0;
       records.qty = 0;
       records._X_ROW_KEY = "";
+      records.mattressmxid = 0;
 
       if (item) {
         records.thickness = item?.bednet_height;
@@ -1832,6 +1833,7 @@ export const useHooks = (t?: any) => {
         records = {
           addmx: "+",
           delmx: "-",
+          mattressmxid: 0,
           formulatype: row.formulatype,
           if_mtrl: row.if_mtrl,
           formulaid: row.formulaid,

JLHWEB/src/views/system/selector/bednet/select.vue

@@ -6,6 +6,7 @@
     :loading="loading"
     v-bind="$attrs"
     :remote-method="remoteMethod"
+    popper-class="lj-select-mtrldef__popper"
     @select="handleSelect"
     @open-modal="openModal"
   >
@@ -15,9 +16,15 @@
     <template #header>
       <div class="table-header lj-select__table">
         <div class="table-tr">
-          <div class="table-td pr-4" style="width: 80px">{{ $t("table.u_bednet_define.bednetcode") }}</div>
-          <div class="table-td pr-4" style="width: 80px">{{ $t("table.u_bednet_define.bednetname") }}</div>
-          <div class="table-td pr-4" style="width: 40px">{{ $t("table.u_bednet_define.typename") }}</div>
+          <div class="table-td pr-4" style="width: 200px; max-width: 200px; min-width: 200px">
+            {{ $t("table.u_bednet_define.bednetcode") }}
+          </div>
+          <div class="table-td pr-4" style="width: 200px; max-width: 200px; min-width: 200px">
+            {{ $t("table.u_bednet_define.bednetname") }}
+          </div>
+          <div class="table-td pr-4" style="width: 80px; max-width: 80px; min-width: 80px">
+            {{ $t("table.u_bednet_define.typename") }}
+          </div>
         </div>
       </div>
     </template>
@@ -36,9 +43,23 @@
       </template>
       <template v-else>
         <div class="table-tr">
-          <div style="width: 80px" class="table-td pr-4 text-ellipsis-one" :title="item.bednetcode">{{ item.bednetcode }}</div>
-          <div style="width: 80px" class="table-td pr-4 text-ellipsis-one" :title="item.bednetname">{{ item.bednetname }}</div>
-          <div style="width: 40px" class="table-td pr-4 text-ellipsis-one">{{ item.typename }}</div>
+          <div
+            style="width: 200px; max-width: 200px; min-width: 200px"
+            class="table-td pr-4 text-ellipsis-one"
+            :title="item.bednetcode"
+          >
+            {{ item.bednetcode }}
+          </div>
+          <div
+            style="width: 200px; max-width: 200px; min-width: 200px"
+            class="table-td pr-4 text-ellipsis-one"
+            :title="item.bednetname"
+          >
+            {{ item.bednetname }}
+          </div>
+          <div style="width: 80px; max-width: 80px; min-width: 80px" class="table-td pr-4 text-ellipsis-one">
+            {{ item.typename }}
+          </div>
         </div>
       </template>
     </el-option>