oa-system/src/components/OP/SuppliesInventory.vue

<template>
    <div class="SuppliesInventory-all">
        <el-dialog top="10vh" class="Approval-dialog" width="1100px" title="领用审核" :visible.sync="ApprovalVisible">
            <div class="Approval-table">
                <el-table
                    :data="ApprovalData"
                    border
                    style="width: 100%">
                    <el-table-column
                    prop="goodsName"
                    label="物品名称"
                    width="180">
                    </el-table-column>
                    <el-table-column
                    prop="quantity"
                    label="数量"
                    width="50">
                    </el-table-column>
                    <el-table-column
                    prop="createTime"
                    label="申请时间"
                    width="150">
                    </el-table-column>
                    <el-table-column
                    prop="createUserName"
                    label="申请人"
                    width="70">
                    </el-table-column>
                    <el-table-column
                    prop="reason"
                    label="申请原因"
                    width="80">
                    <template slot-scope="scope">
                        <el-popover
                        placement="top"
                        width="300"
                        trigger="hover">
                            {{scope.row.reason}}
                            <span style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;cursor: pointer;color: #48a2ff;" slot="reference">{{scope.row.reason}}</span>
                        </el-popover>
                    </template>
                    </el-table-column>
                    <el-table-column
                    prop="remark"
                    label="备注">
                    <template slot-scope="scope">
                        <el-popover
                        placement="top"
                        width="300"
                        trigger="hover">
                            {{scope.row.remark}}
                            <span style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;cursor: pointer;color: #48a2ff;" slot="reference">{{scope.row.remark}}</span>
                        </el-popover>
                    </template>
                    </el-table-column>
                    <el-table-column
                    prop="auditStatusText"
                    label="审核状态"
                    width="100">
                    </el-table-column>
                    <el-table-column
                    label="操作"
                    width="250">
                    <template slot-scope="scope">
                        <el-button v-if="scope.row.auditStatus==0||scope.row.auditStatus==2" size="mini" type="primary" title="通过" @click="GoodsReceiveAudit(scope.row.id,1)" >通过</el-button>
                        <el-button v-if="scope.row.auditStatus==0" size="mini" type="info" title="不通过" @click="GoodsReceiveAudit(scope.row.id,2)">不通过</el-button>
                        <el-button v-if="scope.row.auditStatus==1" size="mini" type="warning" title="取消通过" @click="GoodsReceiveAudit(scope.row.id,0)">取消通过</el-button>
                        <el-button size="mini" title="删除" type="danger" @click="Deleteintolibraryreceives(scope.row)">删除</el-button>
                    </template>
                    </el-table-column>
                </el-table>
                <div v-if="Approvalcount>Approvalpagesize" class="block">
                    <el-pagination
                    @size-change="ApprovalhandleSizeChange"
                    @current-change="ApprovalhandleCurrentChange"
                    :current-page="ApprovalcurrentPage"
                    :page-sizes="[6, 10, 15, 40]"
                    :page-size="Approvalpagesize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="Approvalcount">
                    </el-pagination>
                </div>
            </div>
        </el-dialog>
        <el-dialog top="10vh" width="1200px" title="入库物品" :visible.sync="warehousingsVisible">
            <el-form :model="warehousingsruleForm" :rules="warehousingsrules" ref="warehousingsruleForm" label-width="100px" class="demo-ruleForm">
                <div class="warehousingsrule-input">
                    <el-form-item label="入库数量" prop="quantity">
                        <el-input-number @blur="Sumup" size="small" :precision="2" :controls="false" v-model="warehousingsruleForm.quantity"></el-input-number>
                    </el-form-item>
                    <el-form-item label="物品单价" prop="unitPrice">
                        <el-input-number @blur="Sumup" size="small" :precision="1" :controls="false" v-model="warehousingsruleForm.unitPrice"></el-input-number>
                    </el-form-item>
                    <el-form-item label="物品总价" prop="totalPrice">
                        <el-input-number size="small" :precision="2" :controls="false" v-model="warehousingsruleForm.totalPrice"></el-input-number>
                    </el-form-item>
                    <el-form-item label="供应商名称" prop="supplierName">
                        <el-input size="small" placeholder="请输入物资名称" v-model="warehousingsruleForm.supplierName" clearable></el-input>
                    </el-form-item>
                    <el-form-item label="供应商电话" prop="supplierTel">
                        <el-input size="small" placeholder="请输入供应商电话" v-model="warehousingsruleForm.supplierTel" clearable></el-input>
                    </el-form-item>
                    <el-form-item label="供应商地址" prop="supplierAddress">
                        <el-input size="small" placeholder="请输入供应商地址" v-model="warehousingsruleForm.supplierAddress" clearable></el-input>
                    </el-form-item>
                    <el-form-item label="供应商来源" prop="supplierSource">
                        <el-input size="small" placeholder="请输入供应商来源" v-model="warehousingsruleForm.supplierSource" clearable></el-input>
                    </el-form-item>
                    <el-form-item label="入库人员" prop="storageUserId">
                        <el-select size="small" v-model="warehousingsruleForm.storageUserId" clearable filterable
                            placeholder="请选择">
                            <el-option v-for="item in userNameData" :key="item.id" :label="item.userName"
                                :value="item.id">
                            </el-option>
                        </el-select>
                        <!-- <el-input size="small" placeholder="请输入供应商来源" v-model="warehousingsruleForm.storageUserId" clearable></el-input> -->
                    </el-form-item>
                    <el-form-item label="入库时间" prop="storageTime">
                        <el-date-picker
                        size="small"
                        style="width:100%"
                        v-model="warehousingsruleForm.storageTime"
                        type="datetime"
                        placeholder="选择日期时间"
                        align="right"
                        :picker-options="pickerOptions">
                        </el-date-picker>
                        <!-- <el-input size="small" placeholder="请输入供应商来源" v-model="warehousingsruleForm.storageTime" clearable></el-input> -->
                    </el-form-item>
                    <el-form-item style="width:100%;" label="备注" prop="remark">
                        <el-input size="small" placeholder="请输入备注称" v-model="warehousingsruleForm.remark" clearable></el-input>
                    </el-form-item>
                </div>
                <el-form-item style="text-align: right;">
                    <el-button size="small" @click="resetForm('warehousingsruleForm')">清空</el-button>
                    <el-button size="small" type="primary" @click="submitForm('warehousingsruleForm')">保存</el-button>
                </el-form-item>
            </el-form>
            <div class="warehousingsrule-table">
                <el-table
                    height="400"
                    :data="warehousingslist"
                    border
                    style="width: 100%">
                    <el-table-column
                    prop="unitPrice"
                    label="物品单价"
                    width="80">
                    <template slot-scope="scope">
                        {{townum(scope.row.unitPrice)}}
                    </template>
                    </el-table-column>
                    <el-table-column
                    prop="quantity"
                    label="物品数量"
                    width="70">
                    </el-table-column>
                    <el-table-column
                    prop="totalPrice"
                    label="物品总价"
                    width="80">
                    <template slot-scope="scope">
                        {{townum(scope.row.totalPrice)}}
                    </template>
                    </el-table-column>
                    <el-table-column
                    prop="supplierName"
                    label="供应商名称">
                        <template slot-scope="scope">
                            <el-popover
                            placement="top"
                            width="300"
                            trigger="hover">
                                {{scope.row.supplierName}}
                                <span style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;cursor: pointer;color: #48a2ff;" slot="reference">{{scope.row.supplierName}}</span>
                            </el-popover>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="supplierTel"
                    label="供应商电话">
                        <template slot-scope="scope">
                            <el-popover
                            placement="top"
                            width="300"
                            trigger="hover">
                                {{scope.row.supplierTel}}
                                <span style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;cursor: pointer;color: #48a2ff;" slot="reference">{{scope.row.supplierTel}}</span>
                            </el-popover>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="supplierAddress"
                    label="供应商地址">
                        <template slot-scope="scope">
                            <el-popover
                            placement="top"
                            width="300"
                            trigger="hover">
                                {{scope.row.supplierAddress}}
                                <span style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;cursor: pointer;color: #48a2ff;" slot="reference">{{scope.row.supplierAddress}}</span>
                            </el-popover>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="supplierSource"
                    label="供应商来源">
                        <template slot-scope="scope">
                            <el-popover
                            placement="top"
                            width="300"
                            trigger="hover">
                                {{scope.row.supplierSource}}
                                <span style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;cursor: pointer;color: #48a2ff;" slot="reference">{{scope.row.supplierSource}}</span>
                            </el-popover>
                        </template>
                    </el-table-column>
                    <el-table-column
                    prop="storageTime"
                    label="入库时间"
                    width="150">
                    </el-table-column>
                    <el-table-column
                    prop="storageUserName"
                    label="入库人"
                    width="80">
                    </el-table-column>
                    <el-table-column 
                    label="操作"
                    width="155">
                    <template slot-scope="scope">
                        <el-button size="mini" title="编辑" @click="Editentry(scope.row)">编辑</el-button>
                        <el-button size="mini" title="删除" type="danger" @click="Deleteintolibrary(scope.row)">删除</el-button>
                    </template>
                    </el-table-column>
                </el-table>
                <div  v-if="WScount>WSpagesize" class="block">
                    <el-pagination
                    @size-change="WShandleSizeChange"
                    @current-change="WShandleCurrentChange"
                    :current-page="WScurrentPage"
                    :page-sizes="[6, 10, 15, 40]"
                    :page-size="WSpagesize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="WScount">
                    </el-pagination>
                </div>
            </div>
        </el-dialog>
        <el-dialog width="400px" title="添加物品" :visible.sync="AddItemsVisible">
            <div class="additems-ul">
                <div class="additems-li">
                    <label>物资类型:</label>
                    <el-select style="width:250px" @change="AddMaterialTypechange(0)" v-model="AddMaterialType" clearable filterable
                        placeholder="请选择">
                        <el-option v-for="item in AddMaterialTypearr" :key="item.id" :label="item.name"
                            :value="item.id">
                        </el-option>
                    </el-select>
                </div>
                <div class="additems-li">
                    <label>物资详细类型:</label>
                    <el-select style="width:250px" v-model="AddMaterialinfoType" clearable filterable
                        placeholder="请选择">
                        <el-option v-for="item in AddMaterialinfoTypearr" :key="item.id" :label="item.name"
                            :value="item.id">
                        </el-option>
                    </el-select>
                </div>
                <div class="additems-li">
                    <label>物资名称:</label>
                    <el-input
                    style="width:250px"
                    placeholder="请输入物资名称"
                    v-model="AdditemsName"
                    clearable>
                    </el-input>
                </div>
            </div>
            <div>
                <label>备注:</label>
                <el-input
                style="width:100%;"
                type="textarea"
                :autosize="{ minRows: 2, maxRows: 4}"
                placeholder="请输入内容"
                v-model="Additemstextarea">
                </el-input>
            </div>
            <div class="additems-btn">
                <el-button @click="AddItemsVisible=false">取消</el-button>
                <el-button @click="GoodsOP" type="primary">保存</el-button>
            </div>
        </el-dialog>
        <el-dialog title="领用物品" width="1000px" :visible.sync="ClaimitemVisible">
            <el-form :model="ClaimsruleForm" :rules="Claimrules" ref="ClaimsruleForm" label-width="100px" class="demo-ruleForm">
                <div class="Claimitem-input">
                    <el-form-item label="关联团组" prop="groupId">
                        <el-select size="small" v-model="ClaimsruleForm.groupId" clearable filterable
                            placeholder="请选择">
                            <el-option v-for="item in groupNameData" :key="item.id" :label="item.groupName"
                                :value="item.id">
                            </el-option>
                        </el-select>
                        <!-- <el-input-number size="small" :precision="2" :controls="false" v-model="ClaimsruleForm.groupId"></el-input-number> -->
                    </el-form-item>
                    <el-form-item label="领用数量" prop="quantity">
                        <el-input-number size="small" :precision="2" :controls="false" v-model="ClaimsruleForm.quantity"></el-input-number>
                    </el-form-item>
                    <el-form-item label="领用原因" prop="reason">
                        <el-input size="small" placeholder="请输入领用原因" v-model="ClaimsruleForm.reason"></el-input>
                    </el-form-item>
                </div>
                <el-form-item label="备注" prop="remark">
                    <el-input size="small" placeholder="请输入备注" v-model="ClaimsruleForm.remark"></el-input>
                </el-form-item>
                <el-form-item style="text-align: right;">
                    <el-button size="small" @click="ClaimresetForm('ClaimsruleForm')">清空</el-button>
                    <el-button size="small" type="primary" @click="ClaimsubmitForm('ClaimsruleForm')">保存</el-button>
                </el-form-item>
            </el-form>
            <div class="claimitem-table">
                <el-table
                    height="400"
                    :data="ClaimitemData"
                    border
                    style="width: 100%">
                    <el-table-column
                    prop="goodsName"
                    label="物品名称"
                    width="180">
                    </el-table-column>
                    <el-table-column
                    prop="quantity"
                    label="数量"
                    width="45">
                    </el-table-column>
                    <el-table-column
                    prop="createTime"
                    label="申请时间"
                    width="150">
                    </el-table-column>
                    <el-table-column
                    prop="createUserName"
                    label="申请人"
                    width="70">
                    </el-table-column>
                    <el-table-column
                    prop="reason"
                    label="申请原因"
                    width="80">
                    <template slot-scope="scope">
                        <el-popover
                        placement="top"
                        width="300"
                        trigger="hover">
                            {{scope.row.reason}}
                            <span style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;cursor: pointer;color: #48a2ff;" slot="reference">{{scope.row.reason}}</span>
                        </el-popover>
                    </template>
                    </el-table-column>
                    <el-table-column
                    prop="remark"
                    label="备注">
                    <template slot-scope="scope">
                        <el-popover
                        placement="top"
                        width="300"
                        trigger="hover">
                            {{scope.row.remark}}
                            <span style="display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; overflow: hidden;cursor: pointer;color: #48a2ff;" slot="reference">{{scope.row.remark}}</span>
                        </el-popover>
                    </template>
                    </el-table-column>
                    <el-table-column
                    prop="auditStatusText"
                    label="审核状态"
                    width="80">
                    </el-table-column>
                    <el-table-column
                    label="操作"
                    width="200">
                    <template slot-scope="scope">
                        <el-button size="mini" title="编辑" @click="Editentryreceive(scope.row)">编辑</el-button>
                        <el-button size="mini" title="删除" type="danger" @click="Deleteintolibraryreceive(scope.row)">删除</el-button>
                    </template>
                    </el-table-column>
                </el-table>
                <div v-if="Claimitemcount>Claimitempagesize" class="block">
                    <el-pagination
                    @size-change="ClaimitemhandleSizeChange"
                    @current-change="ClaimitemhandleCurrentChange"
                    :current-page="ClaimitemcurrentPage"
                    :page-sizes="[6, 10, 15, 40]"
                    :page-size="Claimitempagesize"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="Claimitemcount">
                    </el-pagination>
                </div>
            </div>
        </el-dialog>
        <div class="SuppliesInventory-head">
            <div class="SuppliesInventory-head-ul">
                <div class="SuppliesInventory-head-li">
                    <label>物资类型:</label>
                    <el-select style="width:220px" @change="MaterialTypechange" v-model="MaterialType" clearable filterable
                        placeholder="请选择">
                        <el-option v-for="item in MaterialTypearr" :key="item.id" :label="item.name"
                            :value="item.id">
                        </el-option>
                    </el-select>
                </div>
                <div class="SuppliesInventory-head-li">
                    <label>物资详细类型:</label>
                    <el-select @change="MaterialinfoTypechange" style="width:220px" multiple collapse-tags v-model="MaterialinfoType" clearable filterable
                        placeholder="请选择">
                        <el-option v-for="item in MaterialinfoTypearr" :key="item.id" :label="item.name"
                            :value="item.id">
                        </el-option>
                    </el-select>
                </div>
                <div class="SuppliesInventory-head-li">
                    <label>物资名称:</label>
                    <el-input
                    style="width:220px"
                    placeholder="请输入内容"
                    v-model="Materialname"
                    clearable>
                    </el-input>
                </div>
                <div class="SuppliesInventory-head-li">
                    <el-button @click="GoodsList" type="primary">查 询</el-button>
                </div>
            </div>
            <div>
                <el-button v-if="evocationdownloadqx" @click="GoodsReceiveLists" type="primary">审核</el-button>
                <el-button @click="addbtnclick" type="primary">新增物品</el-button>
            </div>
        </div>
        <div class="SuppliesInventory-table">
            <el-table
                :data="tableData"
                border
                style="width: 100%">
                <el-table-column
                prop="name"
                label="物品名称"
                width="180">
                </el-table-column>
                <el-table-column
                prop="typeName"
                label="物品类型"
                width="180">
                </el-table-column>
                <el-table-column
                prop="stockQuantity"
                label="物品数量"
                width="100">
                </el-table-column>
                <el-table-column
                prop="lastUpdateUserName"
                label="录入人"
                width="100">
                </el-table-column>
                <el-table-column
                prop="lastUpdateTime"
                label="录入时间"
                width="180">
                </el-table-column>
                <el-table-column
                prop="remark"
                label="备注">
                </el-table-column>
                <el-table-column
                label="操作"
                width="300">
                    <template slot-scope="scope">
                        <el-button size="mini" title="编辑" @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
                        <el-button size="mini" @click="instorage(scope.row)" type="primary">入库</el-button>
                        <el-button size="mini" @click="GoodsReceiveList(scope.row)" type="success">领用</el-button>
                        <el-button size="mini" title="删除" type="danger" @click="handleDelete(scope.$index, scope.row)">删除</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div v-if="count>pagesize" class="block">
                <el-pagination
                  @size-change="handleSizeChange"
                  @current-change="handleCurrentChange"
                  :current-page="currentPage"
                  :page-sizes="[10, 15, 30, 40]"
                  :page-size="pagesize"
                  layout="total, sizes, prev, pager, next, jumper"
                  :total="count">
                </el-pagination>
            </div>
        </div>
    </div>
</template>
<script>
export default {
    data() {
        return {
            pickerOptions: {
            shortcuts: [{
                text: '今天',
                onClick(picker) {
                picker.$emit('pick', new Date());
                }
            }, {
                text: '昨天',
                onClick(picker) {
                const date = new Date();
                date.setTime(date.getTime() - 3600 * 1000 * 24);
                picker.$emit('pick', date);
                }
            }, {
                text: '一周前',
                onClick(picker) {
                const date = new Date();
                date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
                picker.$emit('pick', date);
                }
            }]
            },
            Userid:'',
            token:"",
            MaterialType:'',
            MaterialTypearr:[],
            MaterialinfoType:[],
            MaterialinfoTypes:'',
            MaterialinfoTypearr:[],
            Materialname:'',
            tableData:[],
            AddItemsVisible:false,
            currentPage:1,
            pagesize:10,
            count:0,
            WScurrentPage:1,
            WSpagesize:6,
            WScount:0,
            ClaimitemcurrentPage:1,
            Claimitempagesize:6,
            Claimitemcount:0,
            ApprovalcurrentPage:1,
            Approvalpagesize:6,
            Approvalcount:0,
            //新增物品参数
            AddMaterialType:"",
            AddMaterialTypearr:[],
            AddMaterialinfoType:"",
            AddMaterialinfoTypearr:[],
            AdditemsName:"",
            Additemstextarea:"",
            ID:0,
            groupNameData:[],
            //入库参数
            userNameData:[],
            warehousingslist:[],
            warehousingsVisible:false,
            warehousingsruleForm: {
                id:0,
                quantity: 0,
                unitPrice: 0,
                totalPrice: 0,
                supplierName: '',
                supplierTel: '',
                supplierAddress: '',
                supplierSource: '',
                storageUserId:'',
                storageTime:'',
                remark: ''
            },
            warehousingsrules: {
                quantity: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                unitPrice: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                totalPrice: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                supplierName: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                supplierTel: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                supplierAddress: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                supplierSource: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                storageUserId: [
                    { required: true, message: '请选择', trigger: 'change' },
                ],
                storageTime: [
                    { required: true, message: '请选择', trigger: 'blur' },
                ],
                remark: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
            },
            //领用参数
            ClaimitemVisible:false,
            ClaimitemData:[],
            ClaimsruleForm:{
                id:0,
                groupId:'',
                quantity:0,
                reason:'',
                remark:'',
            },
            Claimrules:{
                groupId: [
                    { required: true, message: '请选择', trigger: 'change' },
                ],
                quantity: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                reason: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
                remark: [
                    { required: true, message: '请输入', trigger: 'blur' },
                ],
            },
            //审核参数
            ApprovalVisible:false,
            ApprovalData:[],
            //shqx
            evocationdownloadqx:false,
        }
    },
    methods:{
        //保留两位小数
        townum(val){
            val=Number(val);
            return val.toFixed(2);
        },
        //处理日期
        datetime(val){
            var date=new Date(val);
            var y=date.getFullYear();
            var m=date.getMonth()+1>=10?date.getMonth()+1:'0'+(date.getMonth()+1).toString();
            var d=date.getDate()>=10?date.getDate():'0'+(date.getDate()).toString();
            var s=date.getHours()>=10?date.getHours():'0'+(date.getHours()).toString();
            var f=date.getMinutes()>=10?date.getMinutes():'0'+(date.getMinutes()).toString();
            var mm=date.getSeconds()>=10?date.getSeconds():'0'+(date.getSeconds()).toString();
            return y+'-'+m+'-'+d+' '+s+':'+f+':'+mm
        },
        //获取
        GoodsInitDataSource() {
            var url = "/api/PersonnelModule/GoodsInitDataSource"
            var that = this
            this.$axios({
                method: 'get',
                url: url,
                headers: {
                    Authorization: 'Bearer '
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.MaterialTypearr=res.data.data.goodsTypeData;
                    that.AddMaterialTypearr=res.data.data.goodsTypeData;
                    that.userNameData=res.data.data.userNameData;
                    that.groupNameData=res.data.data.groupNameData;
                    that.MaterialType=that.MaterialTypearr[0].id;
                    that.MaterialTypechange();
                } else {
                    that.$message.error(res.data.msg);
                }
            })
        },
        //物资类型切换
        MaterialTypechange(){
            this.MaterialinfoType="";
            this.MaterialinfoTypearr=[];
            for(let i=0;i<this.MaterialTypearr.length;i++){
                if(this.MaterialType==this.MaterialTypearr[i].id){
                    this.MaterialinfoTypearr=this.MaterialTypearr[i].subTypeItems;
                }
            }
        },
        //物资详情选择
        MaterialinfoTypechange(){
            this.MaterialinfoTypes=""
            for(let i=0;i<this.MaterialinfoType.length;i++){
                this.MaterialinfoTypes+=this.MaterialinfoType[i]+','
            }
            this.MaterialinfoTypes=this.MaterialinfoTypes.substring(0, this.MaterialinfoTypes.length - 1);
        },
        //add物资类型切换
        AddMaterialTypechange(val){
            if(val==0){
                this.AddMaterialinfoType="";
            }
            this.AddMaterialinfoTypearr=[];
            for(let i=0;i<this.AddMaterialTypearr.length;i++){
                if(this.AddMaterialType==this.AddMaterialTypearr[i].id){
                    this.AddMaterialinfoTypearr=this.AddMaterialTypearr[i].subTypeItems;
                }
            }
        },
        //获取列表
        GoodsList() {
            var url = "/api/PersonnelModule/GoodsList"
            var that = this
            this.$axios({
                method: 'post',
                url: url,
                headers: {
                    Authorization: 'Bearer ' 
                },
                data: {
                    portType: 1,
                    pageIndex: that.currentPage,
                    pageSize: that.pagesize,
                    typeIds: that.MaterialinfoTypes,
                    goodsName: that.Materialname,
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.count=res.data.count;
                    that.tableData=res.data.data;
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部！");
            });
        },
        //分页
        handleSizeChange(val) {
            this.currentPage=1;
            this.pagesize=val;
            this.GoodsList();
        },
        handleCurrentChange(val) {
            this.currentPage=val;
            this.GoodsList();
        },
        WShandleSizeChange(val) {
            this.WScurrentPage=1;
            this.WSpagesize=val;
            this.instorage({'id':this.ID});
        },
        WShandleCurrentChange(val) {
            this.WScurrentPage=val;
            this.instorage({'id':this.ID});
        },
        ClaimitemhandleSizeChange(val) {
            this.ClaimitemcurrentPage=1;
            this.Claimitempagesize=val;
            this.GoodsReceiveList({'id':this.ID});
        },
        ClaimitemhandleCurrentChange(val) {
            this.ClaimitemcurrentPage=val;
            this.GoodsReceiveList({'id':this.ID});
        },
        ApprovalhandleSizeChange(val) {
            this.ApprovalcurrentPage=1;
            this.Approvalpagesize=val;
            this.GoodsReceiveLists();
        },
        ApprovalhandleCurrentChange(val) {
            this.ApprovalcurrentPage=val;
            this.GoodsReceiveLists();
        },
        //新增按钮
        addbtnclick(){
            this.ID=0;
            this.AdditemsName="";
            this.AddMaterialType="";
            this.AddMaterialinfoType="";
            this.Additemstextarea="";
            this.AddItemsVisible=true;
        },
        //编辑
        handleEdit(index,row){
            console.log(row);
            this.ID=row.id;
            var url = "/api/PersonnelModule/GoodsInfo?portType=1&id="+this.ID
            var that = this
            this.$axios({
                method: 'get',
                url: url,
                headers: {
                    Authorization: 'Bearer ' 
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    var datainfo=res.data.data;
                    that.Additemstextarea=datainfo.remark;
                    that.AdditemsName=datainfo.name;
                    that.AddMaterialType=datainfo.parentType;
                    that.AddMaterialinfoType=datainfo.type;
                    that.AddItemsVisible=true;
                    that.AddMaterialTypechange(2);
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
        //删除
        handleDelete(index,row){
            this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                var url = "/api/PersonnelModule/GoodsDel/"+row.id
                var that = this
                this.$axios({
                    method: 'delete',
                    url: url,
                    headers: {
                        Authorization: 'Bearer ' +that.token
                    }
                }).then(function (res) {
                    if (res.data.code == 200) {
                        that.$message({
                            type: 'success',
                            message: res.data.msg
                        });
                        that.GoodsList();
                    }else{
                        that.$message.error(res.data.msg);
                    }
                }).catch(function (error) {
                    that.$message.error("操作错误，联系信息部!");
                });
                
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });          
            });
        },
        //计算总价
        Sumup(){
            console.log(123);
            this.warehousingsruleForm.totalPrice=this.warehousingsruleForm.quantity*this.warehousingsruleForm.unitPrice;
        },
        //新增物品api
        GoodsOP() {
            var url = "/api/PersonnelModule/GoodsOP"
            var that = this
            if (that.AdditemsName==""||that.AddMaterialinfoType==""||that.Additemstextarea=="") {
                that.$message.error("检查是否填写完全！");
                return
            }
            this.$axios({
                method: 'post',
                url: url,
                headers: {
                    Authorization: 'Bearer ' +that.token
                },
                data: {
                    currUserId:that.Userid,
                    id:that.ID,
                    name:that.AdditemsName,
                    type:that.AddMaterialinfoType,
                    remark:that.Additemstextarea,
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.$message({
                        message:res.data.msg ,
                        type: 'success',
                        offset:50
                    });
                    that.AddItemsVisible=false;
                    that.GoodsList();
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部！");
            });
        },
        //入库数据初始化
        rkcsh(){
            this.warehousingsruleForm={
                id:0,
                quantity: 0,
                unitPrice: 0,
                totalPrice: 0,
                supplierName: '',
                supplierTel: '',
                supplierAddress: '',
                supplierSource: '',
                storageUserId:'',
                storageTime:'',
                remark: ''
            }
        },
        //入库列表
        instorage(row){
            this.rkcsh();
            this.ID=row.id;
            this.warehousingsVisible=true;
            var url = "/api/PersonnelModule/GoodsStorageList"
            var that = this
            this.$axios({
                method: 'POST',
                url: url,
                headers: {
                    Authorization: 'Bearer ' 
                },
                data:{
                    portType:1,
                    pageIndex:that.WScurrentPage,
                    pageSize:that.WSpagesize,
                    goodsId:row.id,
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.WScount=res.data.count;
                    that.warehousingslist=res.data.data;
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
        //入库api
        GoodsStorageOP(){
            var url = "/api/PersonnelModule/GoodsStorageOP"
            var that = this
            this.$axios({
                method: 'POST',
                url: url,
                headers: {
                    Authorization: 'Bearer ' +that.token
                },
                data:{
                    id:that.warehousingsruleForm.id,
                    goodsId:that.ID,
                    quantity:that.warehousingsruleForm.quantity,
                    unitPrice:that.warehousingsruleForm.unitPrice,
                    totalPrice:that.warehousingsruleForm.totalPrice,
                    supplierName:that.warehousingsruleForm.supplierName,
                    supplierTel:that.warehousingsruleForm.supplierTel,
                    supplierAddress:that.warehousingsruleForm.supplierAddress,
                    supplierSource:that.warehousingsruleForm.supplierSource,
                    storageUserId:that.warehousingsruleForm.storageUserId,
                    storageTime:that.datetime(that.warehousingsruleForm.storageTime),
                    remark:that.warehousingsruleForm.remark,
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.$message({
                        message:res.data.msg ,
                        type: 'success'
                    });
                    that.instorage({'id':that.ID});
                    that.resetForm('warehousingsruleForm');
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
        //编辑入库
        Editentry(val){
            var url = "/api/PersonnelModule/GoodsStorageInfo/"+val.id+"?portType=1"
            var that = this
            this.$axios({
                method: 'get',
                url: url,
                headers: {
                    Authorization: 'Bearer ' 
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    var datainfo=res.data.data;
                    that.warehousingsruleForm.id=datainfo.id;
                    that.warehousingsruleForm.quantity=datainfo.quantity;
                    that.warehousingsruleForm.unitPrice=datainfo.unitPrice;
                    that.warehousingsruleForm.totalPrice=datainfo.totalPrice;
                    that.warehousingsruleForm.supplierName=datainfo.supplierName;
                    that.warehousingsruleForm.supplierTel=datainfo.supplierTel;
                    that.warehousingsruleForm.supplierAddress=datainfo.supplierAddress;
                    that.warehousingsruleForm.supplierSource=datainfo.supplierSource;
                    that.warehousingsruleForm.storageUserId=datainfo.storageUserId;
                    that.warehousingsruleForm.storageTime=datainfo.storageTime;
                    that.warehousingsruleForm.remark=datainfo.remark;
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
        //删除入裤
        Deleteintolibrary(row){
            this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                var url = "/api/PersonnelModule/GoodsStorageDel/"+row.id
                var that = this
                this.$axios({
                    method: 'delete',
                    url: url,
                    headers: {
                        Authorization: 'Bearer ' +that.token
                    }
                }).then(function (res) {
                    if (res.data.code == 200) {
                        that.$message({
                            type: 'success',
                            message: res.data.msg
                        });
                        that.instorage({'id':that.ID});
                    }else{
                        that.$message.error(res.data.msg);
                    }
                }).catch(function (error) {
                    that.$message.error("操作错误，联系信息部!");
                });
                
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });          
            });
        },
        //入库
        submitForm(formName) {
            this.$refs[formName].validate((valid) => {
            if (valid) {
                this.GoodsStorageOP();
            } else {
                console.log(this.datetime(this.warehousingsruleForm.storageTime));
                return false;
            }
            });
        },
        resetForm(formName) {
            this.warehousingsruleForm.id=0;
            this.$refs[formName].resetFields();
        },
        //领用
        ClaimsubmitForm(formName) {
            this.$refs[formName].validate((valid) => {
            if (valid) {
                this.GoodsReceiveOP();
            } else {
                console.log('error submit!!');
                return false;
            }
            });
        },

        ClaimresetForm(formName) {
            this.ClaimsruleForm.id=0;
            this.$refs[formName].resetFields();
        },
        //领用审核列表
        GoodsReceiveLists(){
            this.ApprovalData=[];
            this.ApprovalVisible=true
            var url = "/api/PersonnelModule/GoodsReceiveList"
            var that = this
            this.$axios({
                method: 'POST',
                url: url,
                headers: {
                    Authorization: 'Bearer ' +that.token
                },
                data:{
                    portType:1,
                    pageIndex:that.ApprovalcurrentPage,
                    pageSize:that.Approvalpagesize,
                    goodsId:0,
                    currUserId:0,
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.ApprovalData=res.data.data;
                    that.Approvalcount=res.data.count;
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
        //领用列表
        GoodsReceiveList(row){
            this.bjcsh();
            this.ClaimitemData=[];
            this.ID=row.id;
            this.ClaimitemVisible=true;
            var url = "/api/PersonnelModule/GoodsReceiveList"
            var that = this
            this.$axios({
                method: 'POST',
                url: url,
                headers: {
                    Authorization: 'Bearer ' +that.token
                },
                data:{
                    portType:1,
                    pageIndex:that.ClaimitemcurrentPage,
                    pageSize:that.Claimitempagesize,
                    goodsId:row.id,
                    currUserId:that.Userid,
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.ClaimitemData=res.data.data;
                    that.Claimitemcount=res.data.count;
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
        //领用api
        GoodsReceiveOP(){
            var url = "/api/PersonnelModule/GoodsReceiveOP"
            var that = this
            this.$axios({
                method: 'POST',
                url: url,
                headers: {
                    Authorization: 'Bearer ' +that.token
                },
                data:{
                    id:that.ClaimsruleForm.id,
                    groupId:that.ClaimsruleForm.groupId,
                    goodsId:that.ID,
                    quantity:that.ClaimsruleForm.quantity,
                    reason:that.ClaimsruleForm.reason,
                    remark:that.ClaimsruleForm.remark,
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.$message({
                        type: 'success',
                        message: res.data.msg
                    });
                    that.ClaimresetForm("ClaimsruleForm");
                    that.GoodsReceiveList({'id':that.ID});
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
        //编辑初始化
        bjcsh(){
            this.ClaimsruleForm={
                id:0,
                groupId:'',
                quantity:0,
                reason:'',
                remark:'',
            }
        },
        //编辑领用
        Editentryreceive(val){
            var url = "/api/PersonnelModule/GoodsReceiveInfo/"+val.id+"?portType=1"
            var that = this
            this.$axios({
                method: 'get',
                url: url,
                headers: {
                    Authorization: 'Bearer ' +that.token
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    var datainfo=res.data.data;
                    that.ClaimsruleForm.id=datainfo.id;
                    that.ClaimsruleForm.groupId=datainfo.groupId;
                    that.ClaimsruleForm.quantity=datainfo.quantity;
                    that.ClaimsruleForm.reason=datainfo.reason;
                    that.ClaimsruleForm.remark=datainfo.remark;
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
        //审核列表删除
        Deleteintolibraryreceives(row){
            this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                var url = "/api/PersonnelModule/GoodsReceiveDel/"+row.id
                var that = this
                this.$axios({
                    method: 'delete',
                    url: url,
                    headers: {
                        Authorization: 'Bearer ' +that.token
                    }
                }).then(function (res) {
                    if (res.data.code == 200) {
                        that.$message({
                            type: 'success',
                            message: res.data.msg
                        });
                        that.GoodsReceiveLists();
                    }else{
                        that.$message.error(res.data.msg);
                    }
                }).catch(function (error) {
                    that.$message.error("操作错误，联系信息部!");
                });
                
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });          
            });
        },
        //删除领用
        Deleteintolibraryreceive(row){
            this.$confirm('此操作将永久删除, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                var url = "/api/PersonnelModule/GoodsReceiveDel/"+row.id
                var that = this
                this.$axios({
                    method: 'delete',
                    url: url,
                    headers: {
                        Authorization: 'Bearer ' +that.token
                    }
                }).then(function (res) {
                    if (res.data.code == 200) {
                        that.$message({
                            type: 'success',
                            message: res.data.msg
                        });
                        that.GoodsReceiveList({'id':that.ID});
                    }else{
                        that.$message.error(res.data.msg);
                    }
                }).catch(function (error) {
                    that.$message.error("操作错误，联系信息部!");
                });
                
            }).catch(() => {
                this.$message({
                    type: 'info',
                    message: '已取消删除'
                });          
            });
        },
        //审核领用
        GoodsReceiveAudit(row,val){
            var url = "/api/PersonnelModule/GoodsReceiveAudit"
            var that = this
            this.$axios({
                method: 'post',
                url: url,
                headers: {
                    Authorization: 'Bearer ' +that.token
                },
                data:{
                    label:row+'',
                    auditEnum:val,
                }
            }).then(function (res) {
                if (res.data.code == 200) {
                    that.$message({
                        type: 'success',
                        message: res.data.msg
                    });
                    that.GoodsReceiveLists();
                }else{
                    that.$message.error(res.data.msg);
                }
            }).catch(function (error) {
                that.$message.error("操作错误，联系信息部!");
            });
        },
    },

    mounted(){
        //权限
        let authData=JSON.parse(localStorage.getItem('userinif')).authData;
        let Permissions=[];
        for(let k=0;k<authData.length;k++){
            for(let m=0;m<authData[k].pageList.length;m++){
                if (authData[k].pageList[m].webUrl=='/SuppliesInventory') {
                    Permissions=authData[k].pageList[m].pageAuth;
                }
            }
        }
        for (let r = 0; r < Permissions.length; r++) {
            if (Permissions[r].funid==12) {
                this.evocationdownloadqx=true;
            }
        }

        this.Userid=JSON.parse(localStorage.getItem('userinif')).userInfo.userId;
        this.token=JSON.parse(localStorage.getItem('userinif')).token;
        this.GoodsInitDataSource();
    }
}
</script>
<style>
.SuppliesInventory-all {
    background-color: #fff;
    padding: 10px;
    box-shadow: 0 0 5px #0005;
    border-radius: 10px;
    min-height: 830px;
    min-width: 900px;
}
.SuppliesInventory-head{
    display: flex;
    justify-content: space-between;
}
.SuppliesInventory-head-li{
    margin-right: 15px;
}
.SuppliesInventory-head-li label{
    font-size: 14px;
    color: #555;
}
.SuppliesInventory-table{
    margin-top: 15px;
}
.SuppliesInventory-head-ul{
    display: flex;
}
.additems-li{
    margin-bottom: 10px;
}
.additems-btn{
    text-align: right;
    margin-top: 20px;
}
.warehousingsrule-input{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.warehousingsrule-input .el-form-item{
    width: 33%;
}
.warehousingsrule-input .el-input-number{
    width: 100%;
}
.warehousingsrule-input .el-form-item{
    margin-bottom: 10px;
}
.warehousingsrule-input .el-form-item__error{
    top: 82%;
}
.warehousingsrule-input .el-select{
    width: 100%;
}
.warehousingsrule-table .el-table th.el-table__cell>.cell{
    text-align: center;
    font-size: 12px;
}
.warehousingsrule-table .el-table td.el-table__cell div{
    font-size: 12px;
}
.SuppliesInventory-table .block{
    text-align: center;
    margin-top: 10px;
}
.warehousingsrule-table .block{
    text-align: center;
    margin-top: 10px;
}
.additems-li label{
    display: inline-block;
    width: 105px;
}
.Claimitem-input{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.Claimitem-input .el-form-item{
    width: 33%;
}
.Claimitem-input .el-input-number{
    width: 100%;
}
.Claimitem-input .el-form-item{
    margin-bottom: 10px;
}
.Claimitem-input .el-form-item__error{
    top: 82%;
}
.claimitem-table .el-table th.el-table__cell>.cell{
    text-align: center;
    font-size: 12px;
}
.claimitem-table .el-table td.el-table__cell div{
    font-size: 12px;
}
.claimitem-table .block{
    text-align: center;
    margin-top: 10px;
}
.Approval-table .el-table th.el-table__cell>.cell{
    text-align: center;
    font-size: 12px;
}
.Approval-table .el-table td.el-table__cell div{
    font-size: 12px;
}
.Approval-table .block{
    text-align: center;
    margin-top: 10px;
}
</style>