廖井涛
2025-11-18 b85a6fbf48fb3ce159e266db4bb760041b1514d9
north-glass-erp/northglass-erp/src/views/mm/ingredientStock/MaterialAddition.vue
New file
@@ -0,0 +1,438 @@
<!-- 领出记录  -->
<script setup>
import {onMounted, reactive, ref} from "vue";
import {useRoute, useRouter} from "vue-router"
import request from "@/utils/request";
import deepClone from "@/utils/deepClone";
import useUserInfoStore from "@/stores/userInfo";
import {ElMessage} from "element-plus";
import {Search} from "@element-plus/icons-vue";
import { useI18n } from 'vue-i18n'
import footSum from "@/hook/footSum";
import {changeFilterEvent, filterChanged} from "@/hook";
import {divideAuto, multiply} from "@/utils/decimal";
//语言获取
const { t } = useI18n()
const router = useRouter()
const route = useRoute()
const userStore = useUserInfoStore()
const username = userStore.user.userName
const userid = userStore.user.userId
let BasicData = ref([])
let produceLists = ref([])
let isDisabled = ref(false)
let arrs = [
  { type: 'radio',fixed:"left", title: t('basicData.check'), width: '80' },
  { type: 'seq',fixed:'left', title: t('basicData.Number'), width: '80' },
  {field: 'id', width: '150',title: t('ingredients.materialCode'), sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged}
]
const value = ref('')
const options = [
  {
    value: t('ingredients.originalFilm'),
    label: t('ingredients.originalFilm')
  },
  {
    value: t('ingredients.accessories'),
    label: t('ingredients.accessories'),
  }
]
let filterDatas = ref({
  type:''
})
let BasicDatas = ref([])
let materialStores= ref([])
//定义接收加载表头下拉数据
const titleSelectJson = ref({
  inventoryOrganization:""
})
// 定义表头上传数据
let titleUploadData = ref({
  id:'',
  materialCode:'',
  producer:'',
  dateOfManufacture:'',
  qualityGuaranteePeriod:'',
  inventoryOrganization:'',
  inventoryArea:'',
  inventoryQuantity:'',
  availableQuantity:'',
  remarks:''
})
//物料新增
const xGrids = ref()
const gridOption = reactive({
  border:  "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe:true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true,height: 30},//鼠标移动或选择高亮
  id: 'SelectIngredientsStocks',
  showFooter: true,//显示脚
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  scrollY:{ enabled: true },//开启虚拟滚动
  showOverflow:true,
  columnConfig: {
    resizable: true,
    useKey: true
  },
  filterConfig: {   //筛选配置项
                    //remote: true
  },
  customConfig: {
    storage: true
  },
  editConfig: {
    trigger: 'click',
    mode: 'row',
    showStatus: true
  },//表头参数
  columns:[
  ],//表头按钮
  toolbarConfig: {
    buttons: [
      {'code': 'add', 'name': t('basicData.save'),status: 'primary',icon: 'vxe-icon-save'},
    ],
  }
})
const select= async() =>{
  request.get(`/BasicWarehouse/BasicWarehouseTypes/`+t('ingredientsStock.inventoryOrganization')).then((res) => {
    if(res.code==200){
      titleSelectJson.value=deepClone(res.data)
      titleUploadData.value.inventoryOrganization=titleSelectJson.value.inventoryOrganization[0].operateTypeName
    }else{
      ElMessage.warning(res.msg)
    }
  })
}
//列查询
const getStoreWork = () => {
  filterDatas.value.type=value.value
  request.get(`/BasicWarehouse/BasicWarehouseType/${value.value}`).then((res) => {
    if(res.code==200){
      gridOption.columns=[]
      BasicData.value = res.data
      //添加列
      gridOption.columns=arrs.slice()
      for (let i=0;i<BasicData.value.length;i++){
        let column={field: BasicData.value[i].OperateType,
          width: '150',title: BasicData.value[i].OperateTypeName,
          sortable: true,showOverflow:'ellipsis' ,
          filters:[{ data: '' }],
          slots: { filter: 'num1_filter' },
          filterMethod:filterChanged}
        gridOption.columns.push(column)
      }
      /*if(value.value==t('ingredients.accessories')){
        titleUploadData.value.inventoryOrganization=titleSelectJson.value.inventoryOrganization[1].operateTypeName
      }else{
        titleUploadData.value.inventoryOrganization=titleSelectJson.value.inventoryOrganization[0].operateTypeName
      }*/
      getStoreWorks()
    }else{
      ElMessage.warning(res.msg)
    }
  })
}
//数据绑定
const getStoreWorks = () => {
  request.post(`/materialStore/getSelectMaterialStore`,filterDatas.value).then((res) => {
    if(res.code==200){
      materialStores.value=[]
      for (let i=0;i<res.data.data.length;i++){
        materialStores.value[i]=JSON.parse(res.data.data[i].json)
        materialStores.value[i].id=(res.data.data[i].id)
      }
      produceLists = deepClone(materialStores.value)
      xGrids.value.loadData(produceLists)
      gridOption.loading=false
    }else{
      ElMessage.warning(res.msg)
      router.push("/login")
    }
  })
}
const update = () => {
  gridOption.toolbarConfig.buttons[0].disabled = true
  let flowData = ref({
    title: titleUploadData.value,
    materialInventoryId: props.data.id,
    userName:userStore.user.userName,
    userId:userStore.user.userId
  })
  request.post("/materialInventory/updateMaterialInventory", flowData.value).then((res) => {
    if(res.code==200 && res.data==="true"){
      ElMessage.success(t('basicData.msg.saveSuccess'))
      router.push({path: '/main/ingredientsStock/SelectIngredientsStock', query:{random:Math.random()}})
    }else if(res.data==="false1") {
      ElMessage.warning(t('ingredientsStock.msg1'))
    }else {
      ElMessage.warning(t('basicData.msg.ServerConnectionError'))
    }
  }).finally(()=>{
    gridOption.toolbarConfig.buttons[0].disabled = false
  })
}
const gridEvent = {
  async toolbarButtonClick({code}) {
    const $grid = xGrids.value
    if ($grid) {
      switch (code) {
        case 'add': {
          if(props.type==1){
            const selectRecords = $grid.getRadioRecord()
            if (selectRecords == null) {
              ElMessage.warning(t('productStock.unselectedData'))
              return
            }
            const errMap = await $grid.validate(selectRecords)
            if (errMap) {
              ElMessage.warning(t('productStock.dataVerificationFailed'))
              return
            }
            //表头数据校验
            const outboundType = titleUploadData.value.inventoryOrganization
            if(outboundType === null || outboundType === undefined || outboundType === ''){
              ElMessage.error(t('ingredientsStock.pleaseSelectInventoryOrganization'))
              return
            }
            const materialRequisitionPersonnel = titleUploadData.value.inventoryQuantity
            if(materialRequisitionPersonnel === null || materialRequisitionPersonnel === undefined || materialRequisitionPersonnel === ''){
              ElMessage.error(t('ingredientsStock.pleaseEnterTheQuantity'))
              return
            }
            const  dateOfManufacture= titleUploadData.value.dateOfManufacture
            if(dateOfManufacture === null || dateOfManufacture === undefined || dateOfManufacture === ''){
              titleUploadData.value.dateOfManufacture=null
            }
            /*const inventoryArea = titleUploadData.value.inventoryArea
            if(inventoryArea === null || inventoryArea === undefined || inventoryArea === ''){
              ElMessage.error("请输入库存区域")
              return
            }*/
            let  flowData
            if(selectRecords.height===undefined){
              flowData = ref({
                title: titleUploadData.value,
                materialCode: selectRecords.id,
                userName:userStore.user.userName,
                userId:userStore.user.userId
              })
            }else{
              flowData = ref({
                totalArea: parseFloat(divideAuto(multiply(selectRecords.height,selectRecords.width),1000000,2))*titleUploadData.value.inventoryQuantity,
                singlePieceArea: parseFloat(divideAuto(multiply(selectRecords.height,selectRecords.width),1000000,2)),
                title: titleUploadData.value,
                materialCode: selectRecords.id,
                userName:userStore.user.userName,
                userId:userStore.user.userId
              })
            }
            gridOption.toolbarConfig.buttons[0].disabled = true
            request.post("/materialInventory/saveMaterialInventory", flowData.value).then((res) => {
              if(res.code==200 && res.data==="true"){
                ElMessage.success(t('basicData.msg.saveSuccess'))
                router.push({path: '/main/ingredientsStock/SelectIngredientsStock', query:{random:Math.random()}})
              }else {
                ElMessage.warning(t('basicData.msg.ServerConnectionError'))
              }
            }).finally(()=>{
              gridOption.toolbarConfig.buttons[0].disabled = false
            })
          }
          break
        }
      }
    }
  }
}
let props = defineProps({
  type:0,
  data:null
})
onMounted(async ()=>{
  if(props.data!=null){
    titleUploadData.value.dateOfManufacture=props.data.dateOfManufacture
    titleUploadData.value.qualityGuaranteePeriod=props.data.qualityGuaranteePeriod
    titleUploadData.value.producer=props.data.producer
    titleUploadData.value.inventoryArea=props.data.inventoryArea
    titleUploadData.value.inventoryQuantity=props.data.inventoryQuantity
    titleUploadData.value.remarks=props.data.remarks
    titleUploadData.value.materialCode=props.data.materialCode
    titleUploadData.value.id=props.data.id
    titleUploadData.value.availableQuantity=props.data.availableQuantity
    titleUploadData.value.inventoryOrganization=props.data.inventoryOrganization
    isDisabled=true
  }else{
    await select()
    isDisabled=false
    value.value=t('ingredients.originalFilm')
    getStoreWork()
  }
})
</script>
<template>
  <div  style="width: 100%;height: 100%">
    <div class="order-primary" >
      <el-row>
        <el-col  :span="2"><el-text>{{$t('ingredientsStock.dateOfManufacture')}}:</el-text></el-col>
        <el-col  :span="4">
          <el-date-picker
              :disabled="isDisabled"
              v-model="titleUploadData.dateOfManufacture"
              type="date"
              format="YYYY-MM-DD"
              value-format="YYYY-MM-DD"
              :placeholder="$t('ingredientsStock.pleaseDateOfManufacture')"/>
        </el-col>
        <el-col  :span="2"><el-text>{{$t('ingredientsStock.qualityGuaranteePeriod')}}:</el-text></el-col>
        <el-col  :span="3"><el-input v-model="titleUploadData.qualityGuaranteePeriod" /></el-col>
        <el-col  :span="1"><el-text>{{$t('ingredientsStock.producer')}}:</el-text></el-col>
        <el-col  :span="3"><el-input v-model.trim="titleUploadData.producer" /></el-col>
      </el-row>
      <el-row>
        <el-col  :span="2"><el-text>{{$t('ingredientsStock.inventoryOrganization')}}:</el-text></el-col>
        <el-col  :span="4">
          <el-select  :disabled="isDisabled" v-model="titleUploadData.inventoryOrganization"  clearable :placeholder="$t('processCard.pleaseSelect')"  >
            <el-option
                v-for="item in titleSelectJson['inventoryOrganization']"
                :key="item.id"
                :label="item.operateTypeName"
                :value="item.operateTypeName"
            />
          </el-select>
        </el-col>
        <el-col  :span="2"><el-text>{{$t('productStock.inventoryArea')}}:</el-text></el-col>
        <el-col  :span="3"><el-input v-model="titleUploadData.inventoryArea" /></el-col>
        <el-col  :span="1"><el-text>{{$t('order.quantity')}}:</el-text></el-col>
        <el-col  :span="3"><el-input  :disabled="isDisabled" v-model="titleUploadData.inventoryQuantity" /></el-col>
        <el-col  :span="1"><el-text>{{$t('basicData.remarks')}}:</el-text></el-col>
        <el-col  :span="3"><el-input v-model="titleUploadData.remarks" /></el-col>
      </el-row>
    </div>
    <div>
      <el-row v-if="props.type===1">
        <el-select v-model="value" style="width: 200px" :placeholder="$t('ingredientsStock.pleaseSelectACategory')" @change="getStoreWork">
          <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value"
          />
        </el-select>
      </el-row>
    </div>
    <div class="main-div-customers"  style="height: 350px">
      <el-button v-if="props.type===2" type="primary" @click="update">{{$t('basicData.save')}}</el-button>
      <vxe-grid
          height="100%"
          class="mytable-scrollbar"
          ref="xGrids"
          v-bind="gridOption"
          v-on="gridEvent"
          v-if="props.type===1"
      >
        <template #num1_filter="{ column, $panel }">
          <div>
            <div v-for="(option, index) in column.filters" :key="index">
              <input type="type" v-model="option.data" @keyup.enter.native="$panel.confirmFilter()" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
        <template #content="{ row }">
          <ul class="expand-wrapper">
            <li  v-for="(item,index) in gridOptions.columns" v-show="item.field!=undefined ">
              <span style="font-weight: bold">{{item.title+':  '}}</span>
              <span v-if="hasDecimal(item.field)">{{ hasDecimalhtml(item.field,row) }}</span>
              <span v-else>{{ row[item.field] }}</span>
            </li>
          </ul>
        </template>
        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')"
                     link type="primary" size="small">{{$t('basicData.edit')}}</el-button>
          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">{{$t('basicData.delete')}}</el-button>
        </template>
      </vxe-grid>
    </div>
  </div>
</template>
<style scoped>
.head{
  width: 100%;
  height: 35px;
}
.main-table{
  width: 100%;
  height: calc(100% - 35px);
}
.order-primary{
  width: 100%;
}
.el-col{
  margin-left: 15px;
  margin-bottom: 5px;
}
</style>