优化问题

src/views/invoicing/goods_stoks.vue

@@ -5,7 +5,7 @@
                 <div class="row">
                     <el-input v-model="query.name" size="small" clearable placeholder="商品名称"
                         @keyup.enter.native="getTableData" />
-                    <el-input v-model="query.num" placeholder="库存数量：少于多少xx" />
+                    <!-- <el-input v-model="query.num" placeholder="库存数量：少于多少xx" /> -->
                     <div style="width: 300px;">
                         <el-select v-model="query.isStock" placeholder="库存开关" style="width: 100%;">
                             <el-option label="开" :value="1">开</el-option>
@@ -14,6 +14,7 @@
                     </div>
                     <el-button type="primary" @click="getTableData">查询</el-button>
                     <el-button @click="resetHandle">重置</el-button>
+                    <el-button @click="Uppop()">库存预警:{{ warnLine }}</el-button>
                 </div>
                 <div class="row">
                     <el-button icon="el-icon-download" :loading="downloadLoading" @click="protHandle">导出库存</el-button>
@@ -34,14 +35,14 @@
                 <el-table-column label="商品信息" width="200px">
                     <template v-slot="scope">
                         <div class="shop_info">
-                            <el-image :src="scope.row.img" class="cover" v-if="scope.row.iskaiguans!=1">
+                            <el-image :src="scope.row.img" class="cover" v-if="scope.row.iskaiguans != 1">
                                 <div class="img_error" slot="error">
                                     <i class="icon el-icon-document-delete"></i>
                                 </div>
                             </el-image>
                             <div class="info">
                                 <span>{{ scope.row.name }}</span>
-                                <div v-if="scope.row.iskaiguans!=1">
+                                <div v-if="scope.row.iskaiguans != 1">
                                     <el-tag type="primary">{{ scope.row.type }}</el-tag>
                                 </div>
                             </div>
@@ -49,15 +50,17 @@
                     </template>
                 </el-table-column>
                 <el-table-column label="规格" prop="number">
-                    <template v-slot="scope"  >
-                        <div v-if="scope.row.iskaiguans ">
+                    <template v-slot="scope">
+                        <div v-if="scope.row.iskaiguans">
                             {{ scope.row.specSnap }}
                         </div>
                     </template>
                 </el-table-column>
-                <el-table-column label="库存" prop="number">
-                    <template v-slot="scope">
-                        {{ `${scope.row.stockNumber} ${scope.row.unitName}` }}
+                <el-table-column label="库存" prop="number" >
+                    <template v-slot="scope" >
+                        <span :class="[scope.row.stockNumber<=warnLine?'colorStyle':'']">
+                            {{ `${scope.row.stockNumber} ${scope.row.unitName}` }}
+                        </span>
                     </template>
                 </el-table-column>
 
@@ -97,11 +100,23 @@
         <el-dialog title="导入库存" :visible.sync="dialogVisible">
             <UploadExcel :beforeUpload="excelSuccessUpload" />
         </el-dialog>
+        <!-- 预存弹窗组件 -->
+        <el-dialog title="" :visible.sync="dialogTableVisible" width="350px">
+            <el-form>
+                <el-form-item label="库存预存设置" label-width="120px">
+                    <el-input v-model="montey" type="number" autocomplete="off"></el-input>
+                </el-form-item>
+            </el-form>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="dialogTableVisible = false; montey = ''">取 消</el-button>
+                <el-button type="primary" @click="sumbit()">确 定</el-button>
+            </div>
+        </el-dialog>
     </div>
 </template>
 
 <script>
-import { stock, stockdownload, stockdoImport, stockStateChange, stockStateChanges, stocks } from '@/api/invoicing'
+import { stock, stockdownload, stockdoImport, stockStatewarnLine, stockStateChanges, stocks } from '@/api/invoicing'
 import settings from '@/settings'
 import invoicingDetail from './components/invoicingDetail'
 import UploadExcel from '@/components/UploadExcel/'
@@ -114,6 +129,8 @@ export default {
     data() {
         return {
             dialogVisible: false,
+            dialogTableVisible: false,
+            montey: "",
             query: {
                 name: '',
                 isStock: '',
@@ -121,6 +138,7 @@ export default {
             },
             downloadLoading: false,
             uploadLoading: false,
+            warnLine:null, // 警戒线
             tableData: {
                 page: 0,
                 size: 10,
@@ -135,6 +153,27 @@ export default {
         this.getTableData()
     },
     methods: {
+        Uppop() {
+            this.dialogTableVisible = true
+        },
+        async sumbit() {
+            try {
+                const res = await stockStatewarnLine({
+                    shopId: localStorage.getItem("shopId"),
+                    warnLine: this.montey
+                })
+
+                this.$message({ type: 'success', message: '修改成功!' });
+                setTimeout(() => {
+                    this.dialogTableVisible = false
+                    this.montey = ''
+                    this.getTableData()
+                }, 500);
+
+            } catch (error) {
+                console.log(error);
+            }
+        },
         async load(tree, treeNode, resolve) {
             const res = await stocks({
                 productId: tree.proId,
@@ -243,6 +282,7 @@ export default {
 
                     }
                 });
+                this.warnLine = res.warnLine
                 this.tableData.list = res.content
 
             } catch (error) {
@@ -299,6 +339,10 @@ export default {
         gap: 10px;
     }
 }
+.colorStyle{
+    color: rgb(231, 42, 42);
+    font-weight: 700;
+}
 </style>
 <style>
 .cell {