完成批量复制粘贴与保存

src/components/data-fields/index.vue

@@ -1,42 +1,7 @@
 <script setup lang="ts">
 import {ref} from "vue";
-import {fields, getProductValues} from '../../service/data'
+import {fields, getProductValues,saveProductValues} from '../../service/data'
 import {Button, Input} from "view-ui-plus";
-
-// type ProductValue = {
-//     name: string;
-//     values: number[];
-// }
-//
-// const config = {
-//     fields: [
-//         '能量密度',
-//         '蛋白Pro',
-//         'Glu',
-//         'Fat',
-//         '纤维素',
-//         'Na',
-//         'K',
-//         'Ca',
-//         'P',
-//         'Mg',
-//     ],
-//     product: [
-//         '爱伦多',
-//         '维沃',
-//         '佳维体',
-//         '伊力佳',
-//     ]
-// }
-//
-//
-// const values: ProductValue[] = [];
-// config.product.forEach(product => {
-//     values.push({
-//         name: product,
-//         values: Array(config.fields.length).fill(0)
-//     });
-// })
 const values = getProductValues()
 const productValues = ref(values)
 const onInputPaste = (e: ClipboardEvent, pIndex: number, fIndex: number) => {
@@ -49,15 +14,14 @@ const onInputPaste = (e: ClipboardEvent, pIndex: number, fIndex: number) => {
         const rowIndex = pIndex + rIndex;
         cols.forEach((value, cIndex) => {
             const colIndex = fIndex + cIndex;
-            console.log(value, rowIndex, colIndex)
             if (rowIndex < values.length && colIndex < values[rowIndex].values.length) {
                 values[rowIndex].values[colIndex].value = Number(value)
             }
         })
     })
-    console.log(JSON.stringify(values))
     productValues.value = values;
 }
+
 </script>
 
 <template>
@@ -77,7 +41,7 @@ const onInputPaste = (e: ClipboardEvent, pIndex: number, fIndex: number) => {
                 </div>
             </div>
             <div class="controls">
-                <Button type="primary" @click="console.log(values.map(s=>s.values))">保存数据</Button>
+                <Button type="primary" @click="saveProductValues(productValues)">保存数据</Button>
             </div>
             <div class="calculator">
                 <Input type="textarea" :rows="4" placeholder="请输入计算公式"/>

src/service/data.ts

@@ -33,7 +33,8 @@ export const products: BaseModel[] = [
     {id: 4, name: '伊力佳', alias: 'yilijia'},
 ]
 
-export const product_values: ProductFieldValue[] = [
+const PRODUCT_VALUES_KEY = 'PRODUCT_VALUES_KEY'
+const product_values_default: ProductFieldValue[] = [
     {
         "id": 1,
         "product_id": 1,
@@ -158,6 +159,8 @@ export const product_values: ProductFieldValue[] = [
 
 
 export function getProductValues() {
+    const sessionData = localStorage.getItem(PRODUCT_VALUES_KEY)
+    const product_values:ProductFieldValue[] =sessionData?JSON.parse(sessionData):product_values_default;
     const values: Record<number, ProductFieldValue[]> = {}
     product_values.forEach(s => {
         if(!values[s.product_id]) values[s.product_id]= [];
@@ -167,6 +170,11 @@ export function getProductValues() {
     return results;
 }
 
+export function saveProductValues(datas: ProductValue[]){
+    const values = datas.map(s=>s.values).flatMap(s=>s)
+    localStorage.setItem(PRODUCT_VALUES_KEY,JSON.stringify(values))
+}
+
 // const product_values: ProductFieldValue[] = []
 // let id = 1;
 // products.forEach(p => {

vite.config.ts

@@ -25,9 +25,9 @@ export default defineConfig({
       }
     },
   },
-  resolve:{
-    alias:{
-      '@': path.resolve(__dirname,"./src")
-    }
-  }
+  // resolve:{
+  //   alias:{
+  //     '@': path.resolve(__dirname,"./src")
+  //   }
+  // },
 })