Merge branch 'master' of http://111.30.93.211:10101/r/supipe

李旭东

2023-10-27 2d8dafdddd85653371e463ee43f960f2366d9313

 web/src/views/GoodManage/components/AuxiliaryInvent.vue

@@ -1,304 +1,304 @@
<template>
  <div class="main tabs_main" style="height:89%">
    <div class="main_header">
      <div class="header_item">
        <span class="header_label">物品名称：</span>
        <el-input v-model="search.assistName" :size="size" clearable placeholder="请输入物品名称"></el-input>
      </div>
      <div class="header_item">
        <el-button   :size="size" icon="el-icon-search" v-if="showButton('search')" @click="searchButtonInfo(true)">查询</el-button>
        <el-button  :size="size" icon="el-icon-upload2" v-if="showButton('export')" @click="exportFile">导出Excel</el-button>
      </div>
    </div>
    <div class="main_content">
      <el-table
        v-loading="loading"
        :data="dataList"
        height="100%"
        :cell-style="cellStyle">
        <el-table-column align="center" label="序号" width="60">
          <template #default="scope">
            <span>{{(pageNum - 1) * pageSize + scope.$index + 1}}</span>
          </template>
        </el-table-column>
        <el-table-column prop="assistName" label="物品名称" align="center"></el-table-column>
        <el-table-column prop="assistModel" label="型号规格" align="center" ></el-table-column>
        <el-table-column prop="dictName" label="类别" align="center" ></el-table-column>
        <el-table-column prop="unit" label="计量单位" align="center"></el-table-column>
        <el-table-column prop="stock" label="库存数量" align="center" >
          <template #default="{row}">
              {{row.stock === null?0:row.stock}}
          </template>
        </el-table-column>
        <el-table-column prop="alarmCount" label="报警数" align="center" >
          <template #default="{row}">
              {{row.alarmCount === null?0:row.alarmCount}}
          </template>
        </el-table-column>
        <el-table-column prop="position" label="位置" align="center" show-overflow-tooltip></el-table-column>
        <el-table-column label="操作" align="center" width="200">
          <template #default="{ row }">
            <el-button class="table_btn" size="mini" v-if="showButton('update')" @click="updateProp(row)">库存校正</el-button>
            <el-button class="delete_btn" size="mini" v-if="showButton('update')" @click="updatePropAlarm(row)">预警设置</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
    <div class="main_footer">
      <el-pagination
        background
        @current-change="changePageNum"
        @size-change="changePageSize"
        :current-page="pageNum"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total">
      </el-pagination>
    </div>
    <el-dialog
      class="prop_dialog"
      :title="asyncTitle ? '预警设置' : '库存校正'"
      :close-on-click-modal="false"
      :visible.sync="asyncVisible"
      width="35%">
      <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="auto" class="rule_form">
        <el-form-item label="物品名称：" prop="assistName">
          <el-input v-model="ruleForm.assistName" :size="size" clearable placeholder="请输入物品名称" :disabled="disabled"></el-input>
        </el-form-item>
        <el-form-item label="规格型号：" prop="assistModel">
          <el-input v-model="ruleForm.assistModel" :size="size" clearable placeholder="请输入规格型号" :disabled="disabled"></el-input>
        </el-form-item>
        <el-form-item label="库存数量：" prop="correctionBefore" v-if="!asyncTitle">
          <el-input v-model="ruleForm.correctionBefore" :size="size" clearable placeholder="请输入库存数量" :disabled="disabled"></el-input>
        </el-form-item>
        <el-form-item label="校正数量：" prop="correctionNum" v-if="!asyncTitle">
          <el-input v-model="ruleForm.correctionNum" type="number" :size="size" clearable placeholder="请输入校正数量" @blur="changeAfter"></el-input>
        </el-form-item>
        <el-form-item label="校正后数量：" prop="correctionAfter" v-if="!asyncTitle">
          <el-input v-model="ruleForm.correctionAfter" :size="size" clearable placeholder="请输入校正后数量" :disabled="true"></el-input>
        </el-form-item>
        <el-form-item label="预警数量：" prop="alarmCount" v-if="asyncTitle">
          <el-input v-model="ruleForm.alarmCount" :size="size" clearable placeholder="请输入预警数量" ></el-input>
        </el-form-item>
        <el-form-item label="备注：" prop="remark" v-if="!asyncTitle">
          <el-input v-model="ruleForm.remark" :size="size" type="textarea" :rows="2" clearable placeholder="请输入备注"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button @click="asyncVisible = false">取 消</el-button>
        <el-button class="submit_btn" @click="asyncTitle ? submitInsert() : submitUpdate()">提 交</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { buttonPinia } from '../../../pinia/index';
import { throttle, changeSize,downFiles } from '../../../plugins/public'; // 导入节流、动态切换组件尺寸方法
  export default {
    data() {
      return {
        size: changeSize(), // 组件尺寸
        pageNum: 1,
        pageSize: 10,
        assistId:"",//一行ID
        search:{},//查询条件
        total: 0,
        loading: false,
        disabled:false,//是否禁止修改
        dataList: [], //库存管理信息列表
        asyncTitle: true, // 对话框title 预警设置：true  库存校正：false
        asyncVisible: false, // 添加 修改对话框
        ruleForm: {
        }, // 按钮表单
        rules: {
          assistName: [{
            required: true,
            message: '请输入物品名称',
            trigger: 'blur'
          }],
          assistModel: [{
            required: true,
            message: '请输入规格型号',
            trigger: 'blur'
          }],
          alarmCount: [{
            required: true,
            message: '请输入预警数量',
            trigger: 'blur'
          }],
          correctionBefore: [{
            required: true,
            message: '请输入库存数量',
            trigger: 'blur'
          }],
          correctionNum: [{
            required: true,
            message: '请输入校正数量',
            trigger: 'blur'
          }],
          correctionAfter: [{
            required: true,
            message: '请输入校正后数量',
            trigger: 'blur'
          }],
        },
      }
    },
    watch: {
      asyncVisible(bol) {
        if(!bol) {
          this.ruleForm = {};
          this.$refs.ruleForm.resetFields();
        }
      }
    },
    mounted() {
      const that = this;
      // 根据窗口大小动态修改组件尺寸
      window.onresize = () => {
        that.size = changeSize();
      }
    },
    methods: {
      cellStyle({row,column}){
        if(row.stock <= row.alarmCount &&column.property =="stock"){
          return {
            'color':'red'
          }
        }
      },
      //计算出校正后重量
      changeAfter(){
        this.$set(this.ruleForm,'correctionAfter',this.ruleForm.correctionBefore+this.ruleForm.correctionNum*1)
      },
      // 转圈圈
        functionLoading() {
            this.loadingView = this.$loading({
                lock: true,
                text: '请稍后...',
                spinner: 'el-icon-loading',
                background: 'rgba(0, 0, 0, 0.7)'
            });
        },
      //导出Excel
      exportFile(){
        this.functionLoading();
        let params  = Object.assign({},this.search)
        this.$api.Auxiliary.exportInventDatas(params).then(res => {
            downFiles(res, '库存管理信息', 'xls')
            this.loadingView.close()
        })
        .catch(() => {
          this.loadingView.close();
        })
      },
      // 查询按钮列表信息
      searchButtonInfo(bol) {
        if(bol) {
          this.pageNum = 1;
        }
        let params = Object.assign({},this.search,{
          pageNum: this.pageNum,
          pageSize: this.pageSize
        })
        this.loading = true;
        this.$api.Auxiliary.searchAuxiliaryType(params).then((res) => {
          if(res.statusMsg === 'ok') {
            this.total = res.data.total;
            this.dataList = res.data.list;
          }
          this.loading = false;
        })
      },
      //预警设置按钮
      updatePropAlarm(row){
        this.assistId = row.id
        this.asyncTitle = true;
        this.asyncVisible = true;
        this.disabled = true
        this.$api.Auxiliary.detailsAuxiliaryType({assistId: row.id}).then(res=>{
            if(res.statusMsg === 'ok'){
                this.ruleForm = res.data
            }else{
                this.$message.warning(res.statusMsg)
            }
        })
      },
      //库存校正按钮
      updateProp(row) {
        this.assistId = row.id
        this.asyncTitle = false;
        this.asyncVisible = true;
        this.disabled = true
        this.$api.Auxiliary.detailsAuxiliaryType({assistId: row.id}).then(res=>{
            if(res.statusMsg === 'ok'){
                this.ruleForm = res.data
                this.$set(this.ruleForm,'correctionBefore',res.data.stock)
                this.$set(this.ruleForm,'remark','')
            }else{
                this.$message.warning(res.statusMsg)
            }
        })
      },
      // 提交库存校正按钮信息
      submitUpdate: throttle(function() {
        this.$refs.ruleForm.validate((valid) => {
          if(valid) {
            const params = Object.assign({}, this.ruleForm);
            params.correctionNum = this.ruleForm.correctionNum*1
            params.correctionBefore = this.ruleForm.correctionBefore*1
            params.assistId = this.assistId
            delete params.id
            this.$api.Auxiliary.addAuxiliaryCheck(params).then((res) => {
              if(res.statusMsg === 'ok') {
                this.asyncVisible = false;
                this.searchButtonInfo(true);
                this.$message.success('库存校正成功！');
              } else {
                this.$message.warning(res.statusMsg);
              }
            })
          }
        })
      }, 3000),
      // 提交预警设置按钮信息
      submitInsert: throttle(function() {
        this.$refs.ruleForm.validate((valid) => {
          if(valid) {
            const params = Object.assign({}, this.ruleForm);
            this.$api.Auxiliary.updateAuxiliaryType(params).then((res) => {
              if(res.statusMsg === 'ok') {
                this.asyncVisible = false;
                this.searchButtonInfo(true);
                this.$message.success('预警设置成功！');
              } else {
                this.$message.warning(res.statusMsg);
              }
            })
          }
        })
      }, 3000),
      // 判断按钮权限信息
      showButton(str) {
        const pinia = buttonPinia();
        return pinia.$state.buttonInfo.includes(str);
      },      
      // 切换页数
      changePageNum(page) {
        this.pageNum = page;
        this.searchButtonInfo();
      },
      // 切换每页条数
      changePageSize(size) {
        this.pageSize = size;
        this.searchButtonInfo();
      }
    }
  }
</script>

<style lang="scss" scoped>
@import'@/style/layout-main.scss';
<template>

  <div class="main tabs_main" style="height:89%">

    <div class="main_header">

      <div class="header_item">

        <span class="header_label">物品名称：</span>

        <el-input v-model="search.assistName" :size="size" clearable placeholder="请输入物品名称"></el-input>

      </div>

      <div class="header_item">

        <el-button   :size="size" icon="el-icon-search" v-if="showButton('search')" @click="searchButtonInfo(true)">查询</el-button>

        <el-button  :size="size" icon="el-icon-upload2" v-if="showButton('export')" @click="exportFile">导出Excel</el-button>

      </div>

    </div>

    <div class="main_content">

      <el-table

        v-loading="loading"

        :data="dataList"

        height="100%"

        :cell-style="cellStyle">

        <el-table-column align="center" label="序号" width="60">

          <template #default="scope">

            <span>{{(pageNum - 1) * pageSize + scope.$index + 1}}</span>

          </template>

        </el-table-column>

        <el-table-column prop="assistName" label="物品名称" align="center"></el-table-column>

        <el-table-column prop="assistModel" label="型号规格" align="center" ></el-table-column>

        <el-table-column prop="dictName" label="类别" align="center" ></el-table-column>

        <el-table-column prop="unit" label="计量单位" align="center"></el-table-column>

        <el-table-column prop="stock" label="库存数量" align="center" >

          <template #default="{row}">

              {{row.stock === null?0:row.stock}}

          </template>

        </el-table-column>

        <el-table-column prop="alarmCount" label="报警数" align="center" >

          <template #default="{row}">

              {{row.alarmCount === null?0:row.alarmCount}}

          </template>

        </el-table-column>

        <el-table-column prop="position" label="位置" align="center" show-overflow-tooltip></el-table-column>

        <el-table-column label="操作" align="center" width="200">

          <template #default="{ row }">

            <el-button class="table_btn" size="mini" v-if="showButton('update')" @click="updateProp(row)">库存校正</el-button>

            <el-button class="delete_btn" size="mini" v-if="showButton('update')" @click="updatePropAlarm(row)">预警设置</el-button>

          </template>

        </el-table-column>

      </el-table>

    </div>

    <div class="main_footer">

      <el-pagination

        background

        @current-change="changePageNum"

        @size-change="changePageSize"

        :current-page="pageNum"

        :page-sizes="[10, 20, 50, 100]"

        :page-size="pageSize"

        layout="total, sizes, prev, pager, next, jumper"

        :total="total">

      </el-pagination>

    </div>

    <el-dialog

      class="prop_dialog"

      :title="asyncTitle ? '预警设置' : '库存校正'"

      :close-on-click-modal="false"

      :visible.sync="asyncVisible"

      width="35%">

      <el-form ref="ruleForm" :model="ruleForm" :rules="rules" label-width="auto" class="rule_form">

        <el-form-item label="物品名称：" prop="assistName">

          <el-input v-model="ruleForm.assistName" :size="size" clearable placeholder="请输入物品名称" :disabled="disabled"></el-input>

        </el-form-item>

        <el-form-item label="规格型号：" prop="assistModel">

          <el-input v-model="ruleForm.assistModel" :size="size" clearable placeholder="请输入规格型号" :disabled="disabled"></el-input>

        </el-form-item>

        <el-form-item label="库存数量：" prop="correctionBefore" v-if="!asyncTitle">

          <el-input v-model="ruleForm.correctionBefore" :size="size" clearable placeholder="请输入库存数量" :disabled="disabled"></el-input>

        </el-form-item>

        <el-form-item label="校正数量：" prop="correctionNum" v-if="!asyncTitle">

          <el-input v-model="ruleForm.correctionNum" type="number" :size="size" clearable placeholder="请输入校正数量" @input="changeAfter"></el-input>

        </el-form-item>

        <el-form-item label="校正后数量：" prop="correctionAfter" v-if="!asyncTitle">

          <el-input v-model="ruleForm.correctionAfter" :size="size" clearable placeholder="请输入校正后数量" :disabled="true"></el-input>

        </el-form-item>

        <el-form-item label="预警数量：" prop="alarmCount" v-if="asyncTitle">

          <el-input v-model="ruleForm.alarmCount" :size="size" clearable placeholder="请输入预警数量" ></el-input>

        </el-form-item>

        <el-form-item label="备注：" prop="remark" v-if="!asyncTitle">

          <el-input v-model="ruleForm.remark" :size="size" type="textarea" :rows="2" clearable placeholder="请输入备注"></el-input>

        </el-form-item>

      </el-form>

      <div slot="footer">

        <el-button @click="asyncVisible = false">取 消</el-button>

        <el-button class="submit_btn" @click="asyncTitle ? submitInsert() : submitUpdate()">提 交</el-button>

      </div>

    </el-dialog>

  </div>

</template>



<script>

import { buttonPinia } from '../../../pinia/index';

import { throttle, changeSize,downFiles } from '../../../plugins/public'; // 导入节流、动态切换组件尺寸方法

  export default {

    data() {

      return {

        size: changeSize(), // 组件尺寸

        pageNum: 1,

        pageSize: 10,

        assistId:"",//一行ID

        search:{},//查询条件

        total: 0,

        loading: false,

        disabled:false,//是否禁止修改

        dataList: [], //库存管理信息列表

        asyncTitle: true, // 对话框title 预警设置：true  库存校正：false

        asyncVisible: false, // 添加 修改对话框

        ruleForm: {

        }, // 按钮表单

        rules: {

          assistName: [{

            required: true,

            message: '请输入物品名称',

            trigger: 'blur'

          }],

          assistModel: [{

            required: true,

            message: '请输入规格型号',

            trigger: 'blur'

          }],

          alarmCount: [{

            required: true,

            message: '请输入预警数量',

            trigger: 'blur'

          }],

          correctionBefore: [{

            required: true,

            message: '请输入库存数量',

            trigger: 'blur'

          }],

          correctionNum: [{

            required: true,

            message: '请输入校正数量',

            trigger: 'blur'

          }],

          correctionAfter: [{

            required: true,

            message: '请输入校正后数量',

            trigger: 'blur'

          }],

        },

      }

    },

    watch: {

      asyncVisible(bol) {

        if(!bol) {

          this.ruleForm = {};

          this.$refs.ruleForm.resetFields();

        }

      }

    },

    mounted() {

      const that = this;

      // 根据窗口大小动态修改组件尺寸

      window.onresize = () => {

        that.size = changeSize();

      }

    },

    methods: {

      cellStyle({row,column}){

        if(row.stock <= row.alarmCount &&column.property =="stock"){

          return {

            'color':'red'

          }

        }

      },

      //计算出校正后重量

      changeAfter(){

        this.$set(this.ruleForm,'correctionAfter',this.ruleForm.correctionBefore+this.ruleForm.correctionNum*1)

      },

      // 转圈圈

        functionLoading() {

            this.loadingView = this.$loading({

                lock: true,

                text: '请稍后...',

                spinner: 'el-icon-loading',

                background: 'rgba(0, 0, 0, 0.7)'

            });

        },

      //导出Excel

      exportFile(){

        this.functionLoading();

        let params  = Object.assign({},this.search)

        this.$api.Auxiliary.exportInventDatas(params).then(res => {

            downFiles(res, '库存管理信息', 'xls')

            this.loadingView.close()

        })

        .catch(() => {

          this.loadingView.close();

        })

      },

      // 查询按钮列表信息

      searchButtonInfo(bol) {

        if(bol) {

          this.pageNum = 1;

        }

        let params = Object.assign({},this.search,{

          pageNum: this.pageNum,

          pageSize: this.pageSize

        })

        this.loading = true;

        this.$api.Auxiliary.searchAuxiliaryType(params).then((res) => {

          if(res.statusMsg === 'ok') {

            this.total = res.data.total;

            this.dataList = res.data.list;

          }

          this.loading = false;

        })

      },

      //预警设置按钮

      updatePropAlarm(row){

        this.assistId = row.id

        this.asyncTitle = true;

        this.asyncVisible = true;

        this.disabled = true

        this.$api.Auxiliary.detailsAuxiliaryType({assistId: row.id}).then(res=>{

            if(res.statusMsg === 'ok'){

                this.ruleForm = res.data

            }else{

                this.$message.warning(res.statusMsg)

            }

        })

      },

      //库存校正按钮

      updateProp(row) {

        this.assistId = row.id

        this.asyncTitle = false;

        this.asyncVisible = true;

        this.disabled = true

        this.$api.Auxiliary.detailsAuxiliaryType({assistId: row.id}).then(res=>{

            if(res.statusMsg === 'ok'){

                this.ruleForm = res.data

                this.$set(this.ruleForm,'correctionBefore',res.data.stock)

                this.$set(this.ruleForm,'remark','')

            }else{

                this.$message.warning(res.statusMsg)

            }

        })

      },

      // 提交库存校正按钮信息

      submitUpdate: throttle(function() {

        this.$refs.ruleForm.validate((valid) => {

          if(valid) {

            const params = Object.assign({}, this.ruleForm);

            params.correctionNum = this.ruleForm.correctionNum*1

            params.correctionBefore = this.ruleForm.correctionBefore*1

            params.assistId = this.assistId

            delete params.id

            this.$api.Auxiliary.addAuxiliaryCheck(params).then((res) => {

              if(res.statusMsg === 'ok') {

                this.asyncVisible = false;

                this.searchButtonInfo(true);

                this.$message.success('库存校正成功！');

              } else {

                this.$message.warning(res.statusMsg);

              }

            })

          }

        })

      }, 3000),

      // 提交预警设置按钮信息

      submitInsert: throttle(function() {

        this.$refs.ruleForm.validate((valid) => {

          if(valid) {

            const params = Object.assign({}, this.ruleForm);

            this.$api.Auxiliary.updateAuxiliaryType(params).then((res) => {

              if(res.statusMsg === 'ok') {

                this.asyncVisible = false;

                this.searchButtonInfo(true);

                this.$message.success('预警设置成功！');

              } else {

                this.$message.warning(res.statusMsg);

              }

            })

          }

        })

      }, 3000),

      // 判断按钮权限信息

      showButton(str) {

        const pinia = buttonPinia();

        return pinia.$state.buttonInfo.includes(str);

      },      
      // 切换页数

      changePageNum(page) {

        this.pageNum = page;

        this.searchButtonInfo();

      },

      // 切换每页条数

      changePageSize(size) {

        this.pageSize = size;

        this.searchButtonInfo();

      }

    }

  }

</script>



<style lang="scss" scoped>

@import'@/style/layout-main.scss';

</style>