耗材修改

src/api/consumable.js

@@ -163,4 +163,17 @@ export function gettbConsInfoFlow(params) {
         method: "get",
         params
     });
-}
+}
+/**
+ * 分组查询获取耗材流水信息
+ */
+export function viewConInfoFlow(data) {
+    return request({
+      url: "/api/viewConInfoFlow",
+      method: "get",
+      params: {
+        shopId: localStorage.getItem("shopId"),
+        ...data
+      }
+    });
+  }

src/views/invoicing/components/cons_record_detail.vue

@@ -0,0 +1,173 @@
+<template>
+  <div>
+    <el-dialog width="60%" :visible.sync="dialogVisible" :title="query.conName">
+      <div class="app-container">
+        <!-- <div class="head-container">
+          <el-form :model="query" inline>
+            <el-form-item>
+              <el-input v-model="query.conName" placeholder="耗材信息名称" />
+            </el-form-item>
+            <el-form-item>
+              <el-button type="primary" @click="getTableData">查询</el-button>
+              <el-button @click="resetHandle">重置</el-button>
+            </el-form-item>
+          </el-form>
+        </div> -->
+        <div class="head-container">
+          <el-table
+            ref="table"
+            :data="clickseetableData.data"
+            v-loading="clickseetableData.loading"
+            row-key="id"
+            height="50vh"
+          >
+            <el-table-column label="耗材名称" prop="conName" />
+            <el-table-column label="变动库存" prop="amount">
+              <template v-slot="scope">
+                <span :class="{ red: scope.row.bizType == '-' }"
+                  >{{ scope.row.bizType }}{{ scope.row.amount }}</span
+                >
+              </template>
+            </el-table-column>
+            <el-table-column label="现有库存" prop="balance" />
+            <!-- <el-table-column label="业务编码" prop="bizCode" /> -->
+            <el-table-column label="业务说明" prop="bizName" />
+            <el-table-column label="商品名称" prop="productName" />
+            <el-table-column label="订单编号" >
+              <template v-slot="scope">
+                <a class="cursor-pointer" @click="toOrderList(scope.row)">{{ scope.row.orderNo||'' }}</a>
+              </template>
+            </el-table-column>
+            <!-- <el-table-column label="正负号标识" prop="bizType" /> -->
+            <!-- <el-table-column label="耗材id" prop="consId" /> -->
+            <el-table-column
+              label="创建时间"
+              prop="createTime"
+            ></el-table-column>
+            <!-- <el-table-column label="更新时间" prop="updateTime">
+            <template v-slot="scope">
+              {{ dayjs(scope.row.createdAt).format('YYYY-MM-DD HH:mm:ss') }}
+            </template>
+          </el-table-column> -->
+          </el-table>
+        </div>
+        <div class="head-container">
+          <el-pagination
+            :total="clickseetableData.total"
+            :current-page="clickseetableData.page + 1"
+            :page-size="clickseetableData.size"
+            layout="total, sizes, prev, pager, next, jumper"
+            @current-change="paginationChangetype"
+            @size-change="
+              (e) => {
+                clickseetableData.size = e;
+                clickseetableData.page = 0;
+                getTableData();
+              }
+            "
+          />
+        </div>
+      </div>
+    </el-dialog>
+
+
+    <order-detail ref="orderDetail"></order-detail>    
+  </div>
+</template>
+  
+  <script>
+import { gettbConsInfoFlow } from "@/api/consumable";
+import orderDetail from "@/views/order_manage/components/orderDetail";
+export default {
+    components:{
+        orderDetail
+    },
+  data() {
+    return {
+      query: {
+        conName: "",
+        consId:''
+      },
+      dialogVisible:false,
+      clickseetableData: {
+        data: [],
+        page: 0,
+        size: 10,
+        loading: false,
+        total: 0,
+      },
+    };
+  },
+  mounted() {
+  },
+  methods: {
+    toOrderList(data){
+      console.log(data)
+      if(data.orderId){
+        this.$refs.orderDetail.show({id:data.orderId})
+      }
+    //   this.$router.push({
+    //     path:'/order_manage/order_list',
+    //     query:{
+    //         orderNo: data.orderNo||'WX20240717165941120'
+    //     }
+    //  })
+    },
+    open(query){
+        this.dialogVisible = true;
+        this.query=query
+        console.log(query)
+        this.getTableData();
+    },
+    close(){
+        this.dialogVisible = false;
+    },
+    lookDetail(row) {
+      console.log(row);
+    },
+    resetHandle() {
+      this.clickseetableData.page = 0;
+      this.clickseetableData.size = 30;
+      this.query.conName = "";
+      this.query.consId = "";
+      this.getTableData();
+    },
+    pageSizeChange(e) {
+      this.clickseetableData.size = e;
+      this.getTableData();
+    },
+    paginationChangetype(e) {
+      this.clickseetableData.page = e - 1;
+      this.getTableData();
+    },
+    // 查看查询耗材流水信息
+    async getTableData() {
+      try {
+        this.clickseetableData.loading = true;
+        const res = await gettbConsInfoFlow({
+          page: this.clickseetableData.page,
+          size: this.clickseetableData.size,
+           ...this.query,
+          shopId: localStorage.getItem("shopId"),
+        });
+        this.clickseetableData.loading = false;
+        this.clickseetableData.data = res.content;
+        this.clickseetableData.total = res.totalElements;
+      } catch (error) {
+        console.log(error);
+      }
+    },
+  },
+};
+</script>
+  <style scoped>
+.cursor-pointer{
+  cursor: pointer;
+  color: #1890ff;
+  transition: all 0.3s;
+}
+.cursor-pointer:hover{
+  opacity: .7;
+}
+
+</style>

src/views/invoicing/consumable/cons_record copy.vue

@@ -0,0 +1,239 @@
+<template>
+  <div class="app-container">
+    <div class="head-container">
+      <el-form :model="query" inline>
+        <el-form-item>
+          <el-input v-model="query.conName" placeholder="耗材信息名称" />
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="getTableData">查询</el-button>
+          <el-button @click="resetHandle">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="head-container">
+      <el-table
+        ref="table"
+        :data="clickseetableData.data"
+        v-loading="clickseetableData.loading"
+        row-key="consId"
+        :expand-row-keys="expands"
+        @expand-change="expandChange"
+        height="66vh"
+      >
+        <el-table-column type="expand">
+          <template slot-scope="props">
+            <el-table 
+             ref="recodersTable"
+            :data="props.row.recoders" row-key="id" height="66vh">
+              <el-table-column label="耗材名称" prop="conName" />
+              <el-table-column label="变动库存" prop="amount">
+                <template v-slot="scope">
+                  <span :class="{ red: scope.row.bizType == '-' }"
+                    >{{ scope.row.bizType }}{{ scope.row.amount }}</span
+                  >
+                </template>
+              </el-table-column>
+              <el-table-column label="现有库存" prop="balance" />
+              <el-table-column label="业务说明" prop="bizName" />
+              <el-table-column label="商品名称" prop="productName">
+                <template v-slot="scope">
+                  {{ scope.row.productName }}
+                </template>
+              </el-table-column>
+              <el-table-column
+                label="创建时间"
+                prop="createTime"
+              ></el-table-column>
+            </el-table>
+
+            <div class="head-container">
+              <el-pagination
+                :total="props.row.total"
+                :current-page="props.row.page + 1"
+                :page-size="props.row.size"
+                layout="total, sizes, prev, pager, next, jumper"
+                @current-change="recodersPageChange($event, props.row)"
+                @size-change="recodersSizeChange($event, props.row)"
+              />
+            </div>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="耗材名称" prop="conName" />
+        <el-table-column label="变动库存" prop="amount">
+          <template v-slot="scope">
+            <span :class="{ red: scope.row.bizType == '-' }"
+              >{{ scope.row.bizType }}{{ scope.row.amount }}</span
+            >
+          </template>
+        </el-table-column>
+        <el-table-column label="现有库存" prop="balance" />
+        <!-- <el-table-column label="业务编码" prop="bizCode" /> -->
+        <el-table-column label="业务说明" prop="bizName" />
+        <el-table-column label="商品名称" prop="productName" />
+        <!-- <el-table-column label="正负号标识" prop="bizType" /> -->
+        <!-- <el-table-column label="耗材id" prop="consId" /> -->
+        <el-table-column label="创建时间" prop="createTime"></el-table-column>
+        <!-- <el-table-column label="更新时间" prop="updateTime">
+          <template v-slot="scope">
+            {{ dayjs(scope.row.createdAt).format('YYYY-MM-DD HH:mm:ss') }}
+          </template>
+        </el-table-column> -->
+      </el-table>
+    </div>
+    <div class="head-container">
+      <el-pagination
+        :total="clickseetableData.total"
+        :current-page="clickseetableData.page + 1"
+        :page-size="clickseetableData.size"
+        layout="total, sizes, prev, pager, next, jumper"
+        @current-change="paginationChangetype"
+        @size-change="pageSizeChange "
+      />
+    </div>
+  </div>
+</template>
+
+<script>
+import { gettbConsInfoFlow, viewConInfoFlow } from "@/api/consumable";
+export default {
+  data() {
+    return {
+      expands:[],
+      query: {
+        conName: "",
+      },
+      clickseetableData: {
+        data: [],
+        page: 0,
+        size: 30,
+        loading: false,
+        total: 0,
+      },
+    };
+  },
+  mounted() {
+    this.getTableData();
+  },
+  methods: {
+    resetRecodetsTable(){
+      this.expands=[];
+    },
+    recodersPageChange(page,row) {
+      // this.clickseetableData.page = e - 1;
+      row.page=page-1;
+      this.getGroupConInfoFlow(row);
+    },
+    recodersSizeChange(size,row){
+      const index = this.clickseetableData.data.findIndex(
+          (v) => v.consId == row.consId
+        );
+        if(index!=-1){
+          row.size=size;
+          row.page=0;
+        }
+      this.getGroupConInfoFlow(row);
+    },
+    // 获取分组内的耗材具体记录
+    async getGroupConInfoFlow(row) {
+      try {
+        row.loading = true;
+        const res = await gettbConsInfoFlow({
+          page: row.page,
+          size: row.size,
+          consId: row.consId,
+          conName: row.conName,
+          shopId: localStorage.getItem("shopId"),
+        });
+        row.loading = false;
+        const index = this.clickseetableData.data.findIndex(
+          (v) => v.consId == row.consId
+        );
+        if (index != -1) {
+          this.$set(this.clickseetableData.data, index, {
+            ...this.clickseetableData.data[index],
+            recoders: res.content,
+            total: res.totalElements,
+          });
+        }
+        // const res = await gettbConsInfoFlow({
+        //   page: this.clickseetableData.page,
+        //   size: this.clickseetableData.size,
+        //   consId: "",
+        //   conName: this.query.conName,
+        //   shopId: localStorage.getItem("shopId")
+        // });
+        console.log(res);
+        this.clickseetableData.loading = false;
+      } catch (error) {
+        console.log(error);
+      }
+    },
+    expandChange(row, expandedRows) {
+      //展开
+      if (expandedRows.length) {
+        this.expands=[];
+        if(row){
+          this.expands.push(row.consId);
+        }
+        this.getGroupConInfoFlow(row);
+      } else {
+        this.expands=[];
+
+      }
+    },
+    resetHandle() {
+      this.clickseetableData.page = 0;
+      this.clickseetableData.size = 30;
+      this.query.conName = "";
+      this.getTableData();
+      this.resetRecodetsTable()
+
+    },
+    pageSizeChange(e) {
+      this.clickseetableData.size = e;
+      this.clickseetableData.page = 0;
+      this.resetRecodetsTable()
+      this.getTableData();
+    },
+    paginationChangetype(e) {
+      this.clickseetableData.page = e - 1;
+      this.resetRecodetsTable()
+      this.getTableData();
+    },
+    // 查看查询耗材流水信息
+    async getTableData() {
+      try {
+        this.clickseetableData.loading = true;
+        const res = await viewConInfoFlow({
+          page: this.clickseetableData.page,
+          size: this.clickseetableData.size,
+          consId: "",
+          conName: this.query.conName,
+          shopId: localStorage.getItem("shopId"),
+        });
+        // const res = await gettbConsInfoFlow({
+        //   page: this.clickseetableData.page,
+        //   size: this.clickseetableData.size,
+        //   consId: "",
+        //   conName: this.query.conName,
+        //   shopId: localStorage.getItem("shopId")
+        // });
+        console.log(res);
+        this.clickseetableData.loading = false;
+        this.clickseetableData.data = res.content.map((v) => {
+          return { ...v, recoders: [], total: 0,
+              page: 0,
+              size: 30,
+              loading: false
+           };
+        });
+        this.clickseetableData.total = res.totalElements;
+      } catch (error) {
+        console.log(error);
+      }
+    },
+  },
+};
+</script>

src/views/invoicing/consumable/cons_record.vue

@@ -20,20 +20,31 @@
         height="66vh"
       >
         <el-table-column label="耗材名称" prop="conName" />
-        <el-table-column label="变动库存" prop="amount">
+        <el-table-column label="现有库存"  >
           <template v-slot="scope">
-            <span :class="{ red: scope.row.bizType == '-' }"
+            <span :class="[computedClass(scope.row.balance)]">  {{scope.row.balance  }}</span>
-              >{{ scope.row.bizType }}{{ scope.row.amount }}</span
+          </template>
+        </el-table-column>
+        <el-table-column label="耗材消耗" prop="conConsume" />
+        <el-table-column label="耗材入库" prop="conIn" />
+        <el-table-column label="耗材出库" prop="conOut" />
+        <el-table-column label="耗材反还" prop="conReturn" />
+
+        <!-- <el-table-column label="业务编码" prop="bizCode" /> -->
+        <!-- <el-table-column label="业务说明" prop="bizName" /> -->
+        <!-- <el-table-column label="商品名称" prop="productName" /> -->
+        <!-- <el-table-column label="正负号标识" prop="bizType" /> -->
+        <!-- <el-table-column label="耗材id" prop="consId" /> -->
+        <!-- <el-table-column label="创建时间" prop="createTime"></el-table-column> -->
+        <el-table-column label="操作" >
+          <template v-slot="scope">
+            <el-button
+              type="text"
+              @click="lookDetail(scope.row)"
+              >查看详情</el-button
             >
           </template>
         </el-table-column>
-        <el-table-column label="现有库存" prop="balance" />
-        <!-- <el-table-column label="业务编码" prop="bizCode" /> -->
-        <el-table-column label="业务说明" prop="bizName" />
-        <el-table-column label="商品名称" prop="productName" />
-        <!-- <el-table-column label="正负号标识" prop="bizType" /> -->
-        <!-- <el-table-column label="耗材id" prop="consId" /> -->
-        <el-table-column label="创建时间" prop="createTime"></el-table-column>
         <!-- <el-table-column label="更新时间" prop="updateTime">
           <template v-slot="scope">
             {{ dayjs(scope.row.createdAt).format('YYYY-MM-DD HH:mm:ss') }}
@@ -57,12 +68,19 @@
         "
       />
     </div>
+
+    <cons-record-detail ref="recodeDetail"></cons-record-detail>
   </div>
 </template>
 
 <script>
-import { gettbConsInfoFlow } from "@/api/consumable";
+import { gettbConsInfoFlow,viewConInfoFlow } from "@/api/consumable";
+import consRecordDetail from "../components/cons_record_detail";
+
 export default {
+  components:{
+    consRecordDetail
+  },
   data() {
     return {
       query: {
@@ -81,6 +99,17 @@ export default {
     this.getTableData();
   },
   methods: {
+    computedClass(num){
+      if(num>0){
+        return 'green'
+      }else{
+        return 'red'
+      }
+    },
+    lookDetail(row){
+      console.log(row)
+      this.$refs.recodeDetail.open(row)
+    },
     resetHandle() {
       this.clickseetableData.page = 0;
       this.clickseetableData.size = 30;
@@ -99,11 +128,10 @@ export default {
     async getTableData() {
       try {
         this.clickseetableData.loading = true;
-        const res = await gettbConsInfoFlow({
+        const res = await viewConInfoFlow({
           page: this.clickseetableData.page,
           size: this.clickseetableData.size,
-          consId: "",
+          ...this.query,
-          conName: this.query.conName,
           shopId: localStorage.getItem("shopId")
         });
         this.clickseetableData.loading = false;
@@ -116,3 +144,14 @@ export default {
   }
 };
 </script>
+<style lang="scss" scoped>
+.green{
+  color: #13ce66;
+  font-weight: bold;
+}
+.red{
+  color: #ff4949;
+  font-weight: bold;
+
+}
+</style>

src/views/invoicing/consumable/information.vue

@@ -4,37 +4,104 @@
     <div class="head-container">
       <div class="row_wrap">
         <div class="row">
-          <el-input v-model="query.conTypeId" size="small" clearable placeholder="请输入类型id" style="width: 150px;"
+          <!-- <el-input
-            @keyup.enter.native="getTableData" />
+            v-model="query.conTypeId"
-          <el-input v-model="query.conTypeName" size="small" clearable placeholder="请输入类型名称" style="width: 150px;"
+            size="small"
-            @keyup.enter.native="getTableData" />
+            clearable
-          <el-input v-model="query.conCode" size="small" clearable placeholder="请输入耗材代码" style="width: 150px;"
+            placeholder="请输入类型id"
-            @keyup.enter.native="getTableData" />
+            style="width: 150px"
-          <el-input v-model="query.conName" size="small" clearable placeholder="请输入耗材名称" style="width: 150px;"
+            @keyup.enter.native="getTableData"
-            @keyup.enter.native="getTableData" />
+          /> -->
-          <div style="width: 150px;">
+          <div style="width: 150px">
-            <el-select v-model="query.status" placeholder="请选择商品规格" style="width: 100%;">
+            <el-select
-              <el-option :label="item.label" :value="item.value" v-for="item in typeEnums" :key="item.label" />
+              v-model="query.conTypeId"
+              placeholder="请选择耗材分类"
+              style="width: 100%"
+            >
+              <el-option
+                :label="item.conTypeName"
+                :value="item.id"
+                v-for="item in consTypeList"
+                :key="item.conTypeId"
+              />
+            </el-select>
+          </div>
+          <el-input
+            v-model="query.conTypeName"
+            size="small"
+            clearable
+            placeholder="请输入类型名称"
+            style="width: 150px"
+            @keyup.enter.native="getTableData"
+          />
+          <el-input
+            v-model="query.conCode"
+            size="small"
+            clearable
+            placeholder="请输入耗材代码"
+            style="width: 150px"
+            @keyup.enter.native="getTableData"
+          />
+          <el-input
+            v-model="query.conName"
+            size="small"
+            clearable
+            placeholder="请输入耗材名称"
+            style="width: 150px"
+            @keyup.enter.native="getTableData"
+          />
+          <div style="width: 150px">
+            <el-select
+              v-model="query.status"
+              placeholder="请选择商品规格"
+              style="width: 100%"
+            >
+              <el-option
+                :label="item.label"
+                :value="item.value"
+                v-for="item in typeEnums"
+                :key="item.label"
+              />
             </el-select>
           </div>
           <el-button type="primary" @click="getTableData">查询</el-button>
           <el-button @click="resetHandle">重置</el-button>
         </div>
         <div class="row">
-          <el-button icon="el-icon-download" :loading="downloadLoading" @click="protHandle">导出耗材</el-button>
+          <el-button
-          <el-button icon="el-icon-upload2" :loading="uploadLoading" @click="dialogVisible = true">导入耗材</el-button>
+            icon="el-icon-download"
+            :loading="downloadLoading"
+            @click="protHandle"
+            >导出耗材</el-button
+          >
+          <el-button
+            icon="el-icon-upload2"
+            :loading="uploadLoading"
+            @click="dialogVisible = true"
+            >导入耗材</el-button
+          >
         </div>
       </div>
     </div>
     <div class="head-container">
       <el-row>
         <el-col>
-          <el-button type="primary" icon="el-icon-plus" @click="clickdialogframe('add')">添加</el-button>
+          <el-button
+            type="primary"
+            icon="el-icon-plus"
+            @click="clickdialogframe('add')"
+            >添加</el-button
+          >
         </el-col>
       </el-row>
     </div>
     <div class="head-container" id="table_drag">
-      <el-table ref="table" :data="tableData.data" v-loading="tableData.loading" row-key="id">
+      <el-table
+        ref="table"
+        :data="tableData.data"
+        v-loading="tableData.loading"
+        row-key="id"
+      >
         <el-table-column prop="id" label="ID" width="50px" />
         <el-table-column label="耗材名称" prop="conName" />
         <el-table-column label="耗材代码" prop="conCode" />
@@ -63,10 +130,22 @@
         </el-table-column>
         <el-table-column label="操作" width="180" fixed="right">
           <template v-slot="scope">
-            <el-button type="text" @click="editorHandle(scope.row)">编辑</el-button>
+            <el-button type="text" @click="editorHandle(scope.row)"
-            <el-button type="text" @click="clicksee(scope.row)" style="margin-left: 10px !important;">耗材记录</el-button>
+              >编辑</el-button
-            <el-button type="text" size="mini" style="margin-left: 10px !important;"
+            >
-              @click="$refs.AddConsTakin.show(scope.row)">耗材盘点</el-button>
+            <el-button
+              type="text"
+              @click="clicksee(scope.row)"
+              style="margin-left: 10px !important"
+              >耗材记录</el-button
+            >
+            <el-button
+              type="text"
+              size="mini"
+              style="margin-left: 10px !important"
+              @click="$refs.AddConsTakin.show(scope.row)"
+              >耗材盘点</el-button
+            >
             <!-- <el-button type="text" icon="el-icon-rank">排序</el-button> -->
             <!-- <el-button type="text" @click="clickdialogfadd(scope.row)"
               style="margin-left: 10px !important;">入库</el-button> -->
@@ -80,39 +159,83 @@
       </el-table>
     </div>
     <div class="head-container">
-      <el-pagination :total="tableData.total" :current-page="tableData.page + 1" :page-size="tableData.size"
+      <el-pagination
-        layout="total, sizes, prev, pager, next, jumper" @current-change="paginationChange" @size-change="e => {
+        :total="tableData.total"
-          tableData.size = e;
+        :current-page="tableData.page + 1"
-          tableData.page = 0;
+        :page-size="tableData.size"
-          getTableData();
+        layout="total, sizes, prev, pager, next, jumper"
-        }
+        @current-change="paginationChange"
-          " />
+        @size-change="
+          (e) => {
+            tableData.size = e;
+            tableData.page = 0;
+            getTableData();
+          }
+        "
+      />
     </div>
     <!-- 耗材入库 -->
     <el-dialog title="耗材入库" :visible.sync="libraryshow">
-      <el-form :inline="true" ref="reflibrary" :model="libraryshowdata" :rules="ruleslibrary" class="demo-form-inline">
+      <el-form
+        :inline="true"
+        ref="reflibrary"
+        :model="libraryshowdata"
+        :rules="ruleslibrary"
+        class="demo-form-inline"
+      >
         <el-form-item label="耗材入库数量" prop="stockNumber">
-          <el-input v-model.number="libraryshowdata.stockNumber" type="number" placeholder="请输入单位"></el-input>
+          <el-input
+            v-model.number="libraryshowdata.stockNumber"
+            type="number"
+            placeholder="请输入单位"
+          ></el-input>
         </el-form-item>
-        <el-form-item style="display: flex;justify-content: flex-end;">
+        <el-form-item style="display: flex; justify-content: flex-end">
           <el-button @click="libraryshow = false">取 消</el-button>
-          <el-button type="primary" @click="clickdialoglibraryshow('reflibrary')">确 定</el-button>
+          <el-button
+            type="primary"
+            @click="clickdialoglibraryshow('reflibrary')"
+            >确 定</el-button
+          >
         </el-form-item>
       </el-form>
     </el-dialog>
     <!-- 修改和增加 -->
-    <el-dialog :title="dialogtitle" :visible.sync="dialogshow" width="70%">
+
-      <el-form :inline="true" ref="refruleForm" :model="ruleForm" :rules="rules" class="demo-form-inline">
+    <el-dialog :title="dialogtitle" :visible.sync="dialogshow" width="80%">
-        <el-form-item label="单位" prop="conUnit" v-if="dialogtitle == '添加'">
+      <template v-if="dialogtitle != '编辑'">
-          <el-input v-model="ruleForm.conUnit" placeholder="请输入单位"></el-input>
+        <div v-for="(item, index) in ruleForms" :key="index">
-        </el-form-item>
+          <el-form
-        <el-form-item label="耗材类型" prop="conTypeId" v-if="dialogtitle == '添加'">
+            :inline="true"
-          <el-select v-model="ruleForm.conTypeId" placeholder="请选择">
+            :ref="'refruleForm'+index"
-            <el-option v-for="item in consTypeList" :key="item.conTypeId" :label="item.conTypeName" :value="item.id">
+            :model="item"
-            </el-option>
+            :rules="rules"
-          </el-select>
+            class="demo-form-inline"
-        </el-form-item>
+          >
-        <!-- <el-form-item
+            <el-form-item label=" ">
+              <i
+                class="el-icon-remove-outline color-danger"
+                @click="ruleFormsReduce(index)"
+              ></i>
+            </el-form-item>
+            <el-form-item label="单位" prop="conUnit">
+              <el-input
+                v-model="item.conUnit"
+                placeholder="请输入单位"
+              ></el-input>
+            </el-form-item>
+            <el-form-item label="耗材类型" prop="conTypeId">
+              <el-select v-model="item.conTypeId" placeholder="请选择" @change="selectChange($event,'refruleForm'+index,'conTypeId')" >
+                <el-option
+                  v-for="option in consTypeList"
+                  :key="option.conTypeId"
+                  :label="option.conTypeName"
+                  :value="option.id"
+                >
+                </el-option>
+              </el-select>
+            </el-form-item>
+            <!-- <el-form-item
           label="耗材类型"
           prop="conNames"
           v-if="dialogtitle == '添加'"
@@ -123,55 +246,176 @@
             disabled
           ></el-input>
         </el-form-item>-->
-        <!-- <el-form-item v-if="dialogtitle == '添加'">
+            <!-- <el-form-item v-if="dialogtitle == '添加'">
           <el-button type="primary" @click="typedialogshow = true"
             >去选择</el-button
           >
         </el-form-item>  -->
-        <el-form-item label="耗材信息名称" prop="conName">
+            <el-form-item label="耗材信息名称" prop="conName">
-          <el-input v-model="ruleForm.conName" placeholder="请输入耗材信息名称"></el-input>
+              <el-input
-        </el-form-item>
+                v-model="item.conName"
-        <!-- <el-form-item label="耗材信息代码" prop="conCode">
+                placeholder="请输入耗材信息名称"
+              ></el-input>
+            </el-form-item>
+            <!-- <el-form-item label="耗材信息代码" prop="conCode">
           <el-input
             v-model="ruleForm.conCode"
             placeholder="请输入耗材信息代码"
           ></el-input>
         </el-form-item> -->
-        <el-form-item label="耗材价格">
+            <el-form-item label="耗材价格">
-          <el-input v-model="ruleForm.price" placeholder="请输入耗材价格"></el-input>
+              <el-input
-        </el-form-item>
+                v-model="item.price"
-        <el-form-item label="预警值">
+                placeholder="请输入耗材价格"
-          <el-input v-model="ruleForm.conWarning" placeholder="请输入耗材预警值"></el-input>
+              ></el-input>
-        </el-form-item>
+            </el-form-item>
-        <el-form-item label="状态" v-if="dialogtitle == '编辑'">
+            <el-form-item label="预警值">
-          <el-switch v-model="ruleForm.status" active-value="1" inactive-value="0"></el-switch>
+              <el-input
-        </el-form-item>
+                v-model="item.conWarning"
-        <!-- <el-form-item label="单位耗材值" prop="surplusStock">
+                placeholder="请输入耗材预警值"
+              ></el-input>
+            </el-form-item>
+
+            <el-form-item label=" ">
+              <i
+                class="el-icon-circle-plus-outline color-success"
+                @click="ruleFormsAdd(index)"
+              ></i>
+            </el-form-item>
+            <!-- <el-form-item label="单位耗材值" prop="surplusStock">
           <el-input v-model="ruleForm.surplusStock" placeholder="请输入单位耗材值"></el-input>
         </el-form-item> -->
-        <el-form-item style="display: flex;justify-content: flex-end;">
+          </el-form>
+        </div>
+
+        <div style="display: flex; justify-content: flex-end">
           <el-button @click="dialogshow = false">取 消</el-button>
-          <el-button type="primary" @click="submitForm('refruleForm')">
+          <el-button type="primary" @click="submitForms()">
             确 定
           </el-button>
+        </div>
+      </template>
+
+      <template v-else>
+        <el-form
+          :inline="true"
+          ref="refruleForm"
+          :model="ruleForm"
+          :rules="rules"
+          class="demo-form-inline"
+        >
+          <!-- <el-form-item label="单位" prop="conUnit" v-if="dialogtitle == '添加'">
+          <el-input v-model="ruleForm.conUnit" placeholder="请输入单位"></el-input>
         </el-form-item>
-      </el-form>
+        <el-form-item label="耗材类型" prop="conTypeId" v-if="dialogtitle == '添加'">
+          <el-select v-model="ruleForm.conTypeId" placeholder="请选择">
+            <el-option v-for="item in consTypeList" :key="item.conTypeId" :label="item.conTypeName" :value="item.id">
+            </el-option>
+          </el-select>
+        </el-form-item> -->
+          <!-- <el-form-item
+          label="耗材类型"
+          prop="conNames"
+          v-if="dialogtitle == '添加'"
+        >
+          <el-input
+            v-model="ruleForm.conNames"
+            placeholder="请输耗材信息名称"
+            disabled
+          ></el-input>
+        </el-form-item>-->
+          <!-- <el-form-item v-if="dialogtitle == '添加'">
+          <el-button type="primary" @click="typedialogshow = true"
+            >去选择</el-button
+          >
+        </el-form-item>  -->
+          <el-form-item label="耗材信息名称" prop="conName">
+            <el-input
+              v-model="ruleForm.conName"
+              placeholder="请输入耗材信息名称"
+            ></el-input>
+          </el-form-item>
+          <!-- <el-form-item label="耗材信息代码" prop="conCode">
+          <el-input
+            v-model="ruleForm.conCode"
+            placeholder="请输入耗材信息代码"
+          ></el-input>
+        </el-form-item> -->
+          <el-form-item label="耗材价格">
+            <el-input
+              v-model="ruleForm.price"
+              placeholder="请输入耗材价格"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="预警值">
+            <el-input
+              v-model="ruleForm.conWarning"
+              placeholder="请输入耗材预警值"
+            ></el-input>
+          </el-form-item>
+          <el-form-item label="状态" v-if="dialogtitle == '编辑'">
+            <el-switch
+              v-model="ruleForm.status"
+              active-value="1"
+              inactive-value="0"
+            ></el-switch>
+          </el-form-item>
+          <!-- <el-form-item label="单位耗材值" prop="surplusStock">
+          <el-input v-model="ruleForm.surplusStock" placeholder="请输入单位耗材值"></el-input>
+        </el-form-item> -->
+          <el-form-item style="display: flex; justify-content: flex-end">
+            <el-button @click="dialogshow = false">取 消</el-button>
+            <el-button type="primary" @click="submitForm('refruleForm')">
+              确 定
+            </el-button>
+          </el-form-item>
+        </el-form>
+      </template>
     </el-dialog>
+
     <el-dialog title="选择类型" :visible.sync="typedialogshow">
       <div class="head-container">
-        <el-input v-model="querytypedialogshowquery.conTypeName" size="small" clearable placeholder="请输入耗材类型名称"
+        <el-input
-          style="width: 100%;" class="filter-item" @keyup.enter.native="getTableDatatype" />
+          v-model="querytypedialogshowquery.conTypeName"
-        <el-input v-model="querytypedialogshowquery.conTypeCode" size="small" clearable placeholder="请输入耗材类型代码"
+          size="small"
-          style="width: 100%;" class="filter-item" @keyup.enter.native="getTableDatatype" />
+          clearable
-        <el-select v-model="querytypedialogshowquery.status" placeholder="请选择商品规格" style="width: 100%;">
+          placeholder="请输入耗材类型名称"
-          <el-option :label="item.label" :value="item.value" v-for="item in typeEnums" :key="item.label" />
+          style="width: 100%"
+          class="filter-item"
+          @keyup.enter.native="getTableDatatype"
+        />
+        <el-input
+          v-model="querytypedialogshowquery.conTypeCode"
+          size="small"
+          clearable
+          placeholder="请输入耗材类型代码"
+          style="width: 100%"
+          class="filter-item"
+          @keyup.enter.native="getTableDatatype"
+        />
+        <el-select
+          v-model="querytypedialogshowquery.status"
+          placeholder="请选择商品规格"
+          style="width: 100%"
+        >
+          <el-option
+            :label="item.label"
+            :value="item.value"
+            v-for="item in typeEnums"
+            :key="item.label"
+          />
         </el-select>
-        <div style="margin-top: 10px;">
+        <div style="margin-top: 10px">
           <el-button type="primary" @click="getTableDatatype">查询</el-button>
           <el-button @click="resetHandletype">重置</el-button>
         </div>
       </div>
-      <el-table ref="table" :data="tableDatatype.data" v-loading="tableDatatype.loading" row-key="id">
+      <el-table
+        ref="table"
+        :data="tableDatatype.data"
+        v-loading="tableDatatype.loading"
+        row-key="id"
+      >
         <el-table-column label="耗材类型名称" prop="conTypeName" />
         <el-table-column label="耗材类型代码" prop="conTypeCode" />
         <el-table-column label="店铺ID" prop="shopId" />
@@ -188,19 +432,30 @@
         </el-table-column>
       </el-table>
       <div class="head-container">
-        <el-pagination :total="tableDatatype.total" :current-page="tableDatatype.page + 1"
+        <el-pagination
-          :page-size="tableDatatype.size" layout="total, sizes, prev, pager, next, jumper"
+          :total="tableDatatype.total"
-          @current-change="paginationChangetype" />
+          :current-page="tableDatatype.page + 1"
+          :page-size="tableDatatype.size"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="paginationChangetype"
+        />
       </div>
     </el-dialog>
     <el-dialog title="耗材信息" :visible.sync="clickseetypedialogshow">
       <div class="head-container">
-        <el-table ref="table" :data="clickseetableData.data" v-loading="clickseetableData.loading" row-key="id"
+        <el-table
-          height="450">
+          ref="table"
+          :data="clickseetableData.data"
+          v-loading="clickseetableData.loading"
+          row-key="id"
+          height="450"
+        >
           <el-table-column label="耗材名称" prop="conName" />
           <el-table-column label="变动库存" prop="amount">
             <template v-slot="scope">
-              <span :class="{ red: scope.row.bizType == '-' }">{{ scope.row.bizType }}{{ scope.row.amount }}</span>
+              <span :class="{ red: scope.row.bizType == '-' }"
+                >{{ scope.row.bizType }}{{ scope.row.amount }}</span
+              >
             </template>
           </el-table-column>
           <el-table-column label="现有库存" prop="balance" />
@@ -208,7 +463,10 @@
           <el-table-column label="业务说明" prop="bizName" />
           <!-- <el-table-column label="正负号标识" prop="bizType" /> -->
           <!-- <el-table-column label="耗材id" prop="consId" /> -->
-          <el-table-column label="商品信息" prop="productName"></el-table-column>
+          <el-table-column
+            label="商品信息"
+            prop="productName"
+          ></el-table-column>
           <el-table-column label="创建时间" prop="createTime"></el-table-column>
           <!-- <el-table-column label="更新时间" prop="updateTime">
           <template v-slot="scope">
@@ -218,10 +476,20 @@
         </el-table>
       </div>
       <div class="head-container">
-        <el-pagination :total="clickseetableData.total" :current-page="clickseetableData.page + 1"
+        <el-pagination
-          :page-size="clickseetableData.size" layout="total, sizes, prev, pager, next, jumper"
+          :total="clickseetableData.total"
+          :current-page="clickseetableData.page + 1"
+          :page-size="clickseetableData.size"
+          layout="total, sizes, prev, pager, next, jumper"
           @current-change="paginationChangetype"
-          @size-change="e => { clickseetableData.size = e; clickseetableData.page = 0; getConsRecord() }" />
+          @size-change="
+            (e) => {
+              clickseetableData.size = e;
+              clickseetableData.page = 0;
+              getConsRecord();
+            }
+          "
+        />
       </div>
     </el-dialog>
     <!-- 耗材盘点 -->
@@ -238,6 +506,18 @@ import Sortable from "sortablejs";
 import dayjs from "dayjs";
 import settings from "@/settings";
 import { upProSort } from "@/api/shop";
+
+function returnPromise(index,prosise){
+		return new Promise((resolve,reject)=>{
+			prosise.then(res=>{
+				console.log(res);
+				resolve({sucees:true})
+			}).catch(err=>{
+				console.log(err);
+				resolve({sucees:false})
+			})
+		})
+	}
 import {
   gettbConsType,
   gettbConsInfo,
@@ -316,6 +596,7 @@ export default {
         total: 0
       },
       ruleFormLoading: false,
+      ruleForms:[],
       ruleForm: {
         conCode: "",
         conName: "",
@@ -336,7 +617,7 @@ export default {
           { required: true, message: "请输入耗材信息名称", trigger: "blur" }
         ],
         conTypeId: [
-          { required: true, message: "请选择耗材类型", trigger: "blur" }
+          { required: true, message: "请选择耗材类型", trigger: "change" }
         ],
         price: [{ required: true, message: "请输入耗材价格", trigger: "blur" }],
         conWarning: [
@@ -362,10 +643,34 @@ export default {
   },
   mounted() {
     this.resetQuery = { ...this.query }
+    this.resetRuleForms()
     this.getTableData();
     this.getTableDatatype();
+    this.gettbConsType()
   },
   methods: {
+    //解决selectc值改变后未验证问题
+    selectChange($event,ref,type){
+      this.$refs[ref][0].validateField(type)
+    },
+    //重置添加耗材表单
+    resetRuleForms(){
+      this.ruleForms=[{...this.ruleForm}]
+      this.$refs['refruleForm0']&&this.$refs['refruleForm0'][0].resetFields()
+    },
+    //添加耗材弹窗删除
+    ruleFormsReduce(index){
+      if(this.ruleForms.length>1){
+      this.ruleForms.splice(index,1)
+      }else{
+        this.$message({ type: "error", message: "至少保留一种耗材" });
+      }
+    },
+    //添加耗材弹窗增加
+    ruleFormsAdd(){
+      console.log('add')
+      this.ruleForms.push({...this.ruleForm})
+    },
     // 导入耗材
     async excelSuccessUpload(file) {
       try {
@@ -509,7 +814,8 @@ export default {
         this.dialogtitle = "添加";
         this.gettbConsType()
         this.$nextTick(() => {
-          this.$refs.refruleForm.resetFields();
+          // this.$refs.refruleForm.resetFields();
+          this.resetRuleForms()
         });
       } else {
         this.dialogtitle = "编辑";
@@ -523,7 +829,32 @@ export default {
       }
       this.dialogshow = true;
     },
+      //添加
+    async submitForms() {
+      let isAllPassForm=0
+      for(let i in this.ruleForms){
+        const res=await returnPromise(i,this.$refs['refruleForm'+i][0].validate())
+        console.log(res)
+        isAllPassForm+=res.sucees?1:0
+      }
+      //判断验证是否通过
+      if(isAllPassForm===this.ruleForms.length){
+        await posttbConsInfo( this.ruleForms)
+        this.$message({ type: "success", message: "添加成功" });
+
+        // for(let i of this.ruleForms){
+        //   const res=await posttbConsInfo(i)
+        //   this.$message({ type: "success", message: "添加成功" });
+        // }
+        this.dialogshow = false;
+          this.resetRuleForms()
+          this.ruleFormLoading = false;
+          this.getTableData();
+      }
+    },
+    //编辑
     submitForm(formName) {
+
       this.$refs[formName].validate(async valid => {
         if (valid) {
           this.ruleFormLoading = true;
@@ -532,12 +863,17 @@ export default {
             this.$message({ type: "success", message: "编辑成功" });
             this.dialogshow = false;
           } else {
-            //添加
+            // //添加
-            console.log(this.ruleForm, '调试')
+            // console.log(this.ruleForm, '调试')
-            await posttbConsInfo({
+            // for(let i of this.ruleForms){
-              ...this.ruleForm
+            //   console.log(i)
-            });
+            //   await posttbConsInfo({
-            this.$message({ type: "success", message: "添加成功" });
+            //     ...i
+            //    });
+            //    this.$message({ type: "success", message: "添加成功" });
+
+            // }
+          
           }
           this.dialogshow = false;
           this.$refs[formName].resetFields();
@@ -590,6 +926,16 @@ export default {
 </script>
 
 <style scoped lang="scss">
+.color-success {
+  color: #67c23a;
+  cursor: pointer;
+  font-weight: 700;
+}
+.color-danger {
+  color: #f56c6c;
+  font-weight: 700;
+  cursor: pointer;
+}
 .row_wrap {
   display: flex;
   justify-content: space-between;

src/views/order_manage/order_list.vue

@@ -54,12 +54,21 @@
           >
           </el-date-picker>
         </el-form-item>
+        
         <el-form-item label="订单号">
           <el-input
             v-model="query.orderNo"
             placeholder="请输入订单号"
             style="width: 300px;"
           ></el-input>
+         
+        </el-form-item>
+        <el-form-item label="商品名称">
+          <el-input
+            v-model="query.productName"
+            placeholder="请输入商品名称"
+            style="width: 300px;"
+          ></el-input>
           <el-button type="primary" @click="getTableData">查询</el-button>
           <el-button @click="resetHandle">重置</el-button>
           <el-button
@@ -71,6 +80,8 @@
             <span v-else>下载中...</span>
           </el-button>
         </el-form-item>
+       
+
       </el-form>
     </div>
     <div class="head-container">
@@ -218,7 +229,8 @@ export default {
         status: "",
         payType: "",
         orderNo: "",
-        createdAt: []
+        createdAt: [],
+        productName:''
       },
       tableData: {
         data: [],
@@ -262,6 +274,9 @@ export default {
     if(this.$route.query.tableName){
       this.query.tableName = this.$route.query.tableName
     }
+    if(this.$route.query.orderNo){
+      this.query.orderNo = this.$route.query.orderNo
+    }
     this.resetQuery = { ...this.query };
     this.tbShopPayTypeGet();
     this.getTableData();
@@ -320,11 +335,13 @@ export default {
       this.tableData.loading = true;
       try {
         this.payCount();
+        const productName=this.query.productName.replace(/\s+/g,'')
         const res = await tbOrderInfoData({
           page: this.tableData.page,
           pageSize: this.tableData.size,
           orderType: this.orderType,
-          ...this.query
+          ...this.query,
+          productName
         });
         this.tableData.loading = false;
         this.tableData.data = res.content;