Your Name
2023-01-06 50d33c74675a9d9eee957a685d9e55b77974f6f9
src/views/specialWorkSystem/workTicket/zysq/components/materialDialog.vue
对比新文件
@@ -0,0 +1,293 @@
<template>
    <el-dialog v-model="equipmentDialog" title="关联物资标准" width="40%" center @close="closeMaterial">
      <div class="standard" v-for="item in materialList">
        <div>{{ item.name }}</div>
        <el-button @click="openList(item)" type="success">选用</el-button>
      </div>
      <el-dialog v-model="equipDetailDialog" title="物资标准详情" width="75%" center @open="openDetail">
        <div class="choose-receiver">
          <span>选择其他作业关联人员</span>
          <el-select v-model="receiveUids" multiple @change="changeReceiver">
            <el-option
                v-for="item in workerList"
                :key="item.uid"
                :label="item.username"
                :value="item.uid"
            />
          </el-select>
        </div>
        <table class="table">
          <tr>
            <th class="w-25">物资名称</th>
            <th class="w-15">标准值</th>
            <th class="w-15">级别</th>
            <th class="w-30">关联人员与个数</th>
            <th class="w-15">实际使用</th>
          </tr>
          <tr v-for="(item,index) in materialDetail">
            <td class="w-25">{{item.materialName}}</td>
<!--              <td class="w-1">-->
<!--                <el-select v-model="addList[index].depId" @change="changeDep($event,index)">-->
<!--                  <el-option-->
<!--                      v-for="i in item.msList"-->
<!--                      :key="i.depId"-->
<!--                      :label="i.depName"-->
<!--                      :value="i.depId"-->
<!--                  />-->
<!--                </el-select>-->
<!--              </td>-->
<!--              <td class="w-15">-->
<!--                  {{stockCount[index]}}-->
<!--              </td>-->
            <td class="w-15">{{item.standVal}}</td>
            <td class="w-15">{{item.configurationLevelName}}</td>
            <td class="w-30">
              {{item.receiveUnames}}
            </td>
<!--              <td class="w-15">-->
<!--                <el-input type="number" v-model.number="addList[index].useCount"/>-->
<!--              </td>-->
            <td class="w-15">
              {{item.receiveCount}}
            </td>
          </tr>
        </table>
        <template #footer>
          <span class="dialog-footer">
            <el-button @click="closeChoose()" size="default">取消</el-button>
            <el-button type="primary" @click="submitMaterials" size="default">确认</el-button>
          </span>
        </template>
      </el-dialog>
    </el-dialog>
</template>
<script lang="ts">
import {workApplyApi} from "/@/api/specialWorkSystem/workApply";
interface stateType {
  equipmentDialog:boolean
  materialList: Array<any>
  equipDetailDialog: boolean
  materialDetail: Array<any>
  stockCount: Array<number>
  chosenId: number | null,
  receiveUids: Array<number>
}
import { reactive, toRefs, ref } from 'vue';
import { approveBasicApi } from '/@/api/specialWorkSystem/approveBasic';
import {ElMessage, ElMessageBox} from 'element-plus';
import {useUserInfo} from "/@/stores/userInfo";
import {storeToRefs} from "pinia";
export default {
    name: 'materialDialog',
    setup(props: any, context: any) {
        const userInfo = useUserInfo()
        const { userInfos } = storeToRefs(userInfo);
        const approveBasicFormRef = ref();
        const state = reactive<stateType>({
          chosenId: null,
          equipmentDialog: false,
          materialList: [],
          equipDetailDialog: false,
          materialDetail: [],
          stockCount: [],
          receiveUids: []
        });
      // 确认物资标准
      const getMaList = async(type:number,level:number) =>{
          const data = {workType: type,workLevel: level}
          const res = await workApplyApi().getMaterial(data)
          if (res.data.code === '200') {
            if(res.data.data && res.data.data.length>0){
              state.materialList = JSON.parse(JSON.stringify(res.data.data))
              state.equipmentDialog = true
            }else{
              ElMessage({
                type: 'warning',
                message: '暂时查询不到物资标准信息'
              });
            }
          } else {
            ElMessage({
              type: 'warning',
              message: res.data.msg
            });
          }
      }
      const openList = async(item:object)=>{
        state.chosenId = item.id
        const data = {maBaseId: state.chosenId,receiveUids:state.receiveUids}
        const res = await workApplyApi().getMaterialDetail(data)
        if (res.data.code === '200') {
          if(res.data.data && res.data.data.length>0){
            state.materialDetail = res.data.data
            state.equipDetailDialog = true
          }else{
            ElMessage({
              type: 'warning',
              message: '暂时查询不到物资标准信息'
            });
          }
        } else {
          ElMessage({
            type: 'warning',
            message: res.data.msg
          });
        }
        // state.stockCount = []
        // if(item.mcList && item.mcList.length>0){
        //   for(let j in item.mcList){
        //     if(item.mcList[j].msList == null || item.mcList[j].msList.length==0){
        //       item.mcList.splice(j,1)
        //     }
        //   }
        //   state.materialDetail = item.mcList
        //   for(let i in state.materialDetail){
        //       state.addList.push(
        //           {
        //             materialId: state.materialDetail[i].materialId,
        //             depId: null,
        //             depName: '',
        //             useCount: null
        //           }
        //       )
        //     for(let x in state.materialDetail[i].msList){
        //       if(state.materialDetail[i].msList[x].depId == userInfos.value.depId){
        //         state.addList[i].depId = userInfos.value.depId
        //         state.addList[i].depName = state.materialDetail[i].msList[x].depName
        //         state.stockCount[i] = state.materialDetail[i].msList.find((e) => e.depId == state.addList[i].depId).stockCount
        //       }
        //     }
        //   }
        // }
      }
      const changeReceiver = async ()=>{
        const data = {maBaseId: state.chosenId,receiveUids:state.receiveUids}
        const res = await workApplyApi().getMaterialDetail(data)
        if (res.data.code === '200') {
          if(res.data.data && res.data.data.length>0){
            state.materialDetail = res.data.data
          }else{
            ElMessage({
              type: 'warning',
              message: '暂时查询不到物资标准信息'
            });
          }
        } else {
          ElMessage({
            type: 'warning',
            message: res.data.msg
          });
        }
      }
      const openDetail = ()=>{
      }
      const submitMaterials = ()=>{
        // if(state.addList.length > 0 && (state.addList.some((e) => e.depId == null && e.useCount != null ) || state.addList.some((e) => e.useCount == null && e.depId != null))){
        //   ElMessage({
        //     type: 'warning',
        //     message: '出库部门或实际使用值不可为空'
        //   });
        //   return
        // }
        // for(let i in state.materialDetail){
        //   if(state.materialDetail[i].configurationLevelName == '必选' && state.addList[i].depId != null && state.addList[i].useCount <= 0){
        //     ElMessage({
        //       type: 'warning',
        //       message: '必选物资数量不能小于等于0'
        //     });
        //     return
        //   }
        //   if((state.stockCount[i] !=null && state.addList[i].useCount !=null) && (state.stockCount[i] < state.addList[i].useCount)){
        //     ElMessage({
        //       type: 'warning',
        //       message: '物资配置数量超出库存量,请重新配置'
        //     });
        //     return
        //   }
        // }
        // if(state.addList.length > 0){
        //   for(let n in state.addList){
        //     if(state.addList[n].depId == null && state.addList[n].useCount == null){
        //       state.addList.splice(n,1)
        //     }
        //   }
        // }
        console.log(state.receiveUids,state.chosenId,'666666666')
        context.emit('conFirmMaterials',state.receiveUids,state.chosenId)
        state.equipDetailDialog = false
        state.equipmentDialog = false
      }
      const closeMaterial = ()=>{
      }
      const closeChoose = () =>{
        state.equipDetailDialog = false
      }
        return {
            ...toRefs(state),
            getMaList,
            openList,
            changeReceiver,
            openDetail,
            closeChoose,
            closeMaterial,
            submitMaterials
        };
    }
};
</script>
<style lang="scss" scoped>
  .standard{
    width: 100%;
    display: flex;
    margin-bottom: 20px;
    align-items: center;
    justify-content: space-between;
  }
  .table{
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    tr{
      width: 100%;
      border: 1px solid #ccc;
      th,td{
        padding: 6px 0;
        border-left: 1px solid #ccc;
        &:first-of-type{
          border-left: none;
        }
      }
      td{
        font-weight: bolder;
      }
      .w-15{
        width: 15%;
        text-align: center;
      }
      .w-20{
        width: 20%;
        text-align: center;
      }
      .w-25{
        width: 25%;
        text-align: center;
      }
      .w-30{
        width: 30%;
        text-align: center;
      }
    }
  }
</style>