supply-front/src/views/basic_data/warehouse/warehouse_book.vue

<template>
  <div class="app-container">
    <el-card class="box-card">
      <div slot="header" class="clearfix">
        <span>仓库每天预约提货设置</span>
      </div>
      <!-- 列表 -->
      <div class="">
        <el-table
         v-loading="listLoading"
          :data="dataList"

          element-loading-text="Loading"
          border
          fit
          highlight-current-row
          stripe
        >
          <el-table-column
            align="center"
            label="序号"
           type="index"
            min-width="60"
            show-overflow-tooltip
          />
          <el-table-column
            align="center"
            label="仓库"
            prop="stockName"
            min-width="160"
            show-overflow-tooltip
          />
          <el-table-column
            align="center"
            label="预约存货类型"
            prop="type"
            min-width="160"
            show-overflow-tooltip
          />
          <el-table-column
            align="center"
            label="最大预约单量(1天)"
            prop="number"
            min-width="160"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              <el-input type="number" v-model.number="scope.row.number" :disabled="scope.row.isDisabled"></el-input>
            </template>
          </el-table-column>
          <el-table-column
            align="center"
            label="最大预约台数(1天)"
            prop="towerNum"
            min-width="160"
            show-overflow-tooltip
          >
            <template slot-scope="scope">
              <el-input type="number" v-model.number="scope.row.towerNum" :disabled="scope.row.isDisabled"></el-input>
            </template>
          </el-table-column>

          <el-table-column
            align="center"
            label="操作"
            min-width="160"

            show-overflow-tooltip
          >
          <template slot-scope="scope">
            <el-button type="text" class="textColor" @click="hanleEidt(scope.$index)"
              >编辑</el-button
            >
            <el-button type="text" class="textColor" @click="hanleSave(scope.row)">保存</el-button>
            </template>
          </el-table-column>
        </el-table>
      </div>
    </el-card>
  </div>
</template>

<script>
import Mixin from "@/mixin/index";
import { getListReserve,addReserve } from "@/api/basic_data/warehouse";
export default {
  mixins: [Mixin],
  data() {
    return {
      dataList: [
        {
          num: "1",
          store: "万豪仓",
          type: "家用空调",
          maxNum: "1111",
          maxSets: "12331",
        },
        {
          num: "1",
          store: "万豪仓",
          type: "家用空调",
          maxNum: "1111",
          maxSets: "",
        },
        {
          num: "1",
          store: "万豪仓",
          type: "家用空调",
          maxNum: "1111",
          maxSets: "",
        },
        {
          num: "1",
          store: "万豪仓",
          type: "家用空调",
          maxNum: "1111",
          maxSets: "",
        },
      ],
      index:0
    };
  },
  created() {
    this.getList();
  },
  methods: {
    hanleEidt(i){
      this.dataList.forEach(e=>{
        e.isDisabled = true
      })
      this.dataList[i].isDisabled = false
    },
    hanleSave(edata){
      const params = {
        ...edata
      }
    addReserve(params).then(res=>{
       this.$successMsg("保存成功");
       this.dataList.forEach(e=>{
        e.isDisabled = true
      })
    })
    },
    getList() {
      this.listLoading = true;
      let params = {
        pageNum: this.currentPage,
        pageSize: this.pageSize,
      };
      getListReserve(params).then((res) => {
          res.data.records.forEach(el => {
              el.isDisabled=true
          });
        this.dataList = res.data.records;
        this.listTotal = res.data.total;
        this.listLoading = false;
        console.log(this.dataList, 1233);
      });
    },
  },
};
</script>

<style lang="scss" scoped></style>