ERP_override.git

<script setup>
 
import {onMounted, reactive, ref} from "vue";
import {useRouter} from  'vue-router'
import request from "@/utils/request";
import deepClone from "@/utils/deepClone";
import useUserInfoStore from "@/stores/userInfo";
import {ElMessage, ElMessageBox} from "element-plus";
import {Search} from "@element-plus/icons-vue";
import { useI18n } from 'vue-i18n'
import {addListener, toolbarButtonClickEvent} from "@/hook/mouseMove";
import {changeFilterEvent,filterChanged,filterChangeds} from "@/hook"
import {divideAuto, multiply} from "@/utils/decimal";
import companyInfo from "@/stores/sd/companyInfo";
import footSum from "@/hook/footSum";
import MaterialAddition from "@/views/mm/ingredientStock/MaterialAddition.vue"
import SelectAlienEditor from "@/components/sd/order/SelectAlienEditor.vue";
import {copyTableCellValue} from "@/hook/copyTableCellValue";
 
//语言获取
const { t } = useI18n()
const userStore = useUserInfoStore()
const company = companyInfo()
const router = useRouter()
let produceList = ref([])
let sheetIndex = ref(-1)
let rowIndexData = ref(null)
 
let dialogTableVisible = ref(false)
let refMaterialAddition=ref()
const getTableRow = (row,type) =>{
  switch (type) {
    case 'edit' :{
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/trader/CreateTrader', query: { id: row.id }})
      break
    }
    case 'delete':{
      alert('我接收到子组件传送的删除信息')
      break
    }
  }
}
 
const hasDecimal=(value)=>{
  const regex=/\./ // 定义正则表达式，查找小数点
  return regex.test(value) //返回true/false
}
 
const hasDecimalhtml=(item,row)=>{
  let aa=item.split('.').length
  if (aa===2){
    return row[item.split('.')[0]][item.split('.')[1]]
  }else if(aa===3){
    return row[item.split('.')[0]][item.split('.')[1]][item.split('.')[2]]
  }
 
 
}
 
let pageNum=ref(1)
let total = reactive({
  pageTotal : 0,
  dataTotal : 0,
  pageSize : 100
})
 
let filterData = ref({
 
})
 
const values = ref('')
const selectOptions = [
  {
    value: t('ingredientsStock.inventory'),
    label: t('ingredientsStock.inventory')
  },
  {
    value: t('ingredientsStock.engineering'),
    label: t('ingredientsStock.engineering'),
  }
]
 
let selectDate = ref(["",""])
let BasicData = ref([])
let materialStore= ref([])
 
 
let arr = [
 
  { type: 'checkbox',fixed:"left", title: t('basicData.check'), width: '80' },
  { type: 'seq',fixed:"left", title: t('basicData.Number'), width: '80' },
  {field: 'inventoryOrganization', width:'150', title: t('ingredientsStock.inventoryOrganization'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged },
  {field: 'materialCode', width: '150',title: t('ingredients.materialCode'), sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'producer', width: '100',title: t('ingredientsStock.producer'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'id',width: '100', title: t('ingredientsStock.id'), sortable: true,showOverflow:"ellipsis",filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'projectNo',width: '100', title: t('ingredientsStock.projectNo'), sortable: true,showOverflow:"ellipsis",filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  //{field: 'safetyStock', width: '100',title: '安全库存', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'inventoryQuantity',width: '100', title: t('productStock.inventoryQuantity'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'availableQuantity', width: '100',title: t('productStock.availableQuantity'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'planQuantity', width: '100',title: t('ingredientsStock.planQuantity'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'totalArea',width: '100', title: t('order.grossArea'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'dateOfManufacture',width: '100', title: t('ingredientsStock.dateOfManufacture'), sortable: true},
  {field: 'qualityGuaranteePeriod',width: '100', title: t('ingredientsStock.qualityGuaranteePeriod'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'inventoryArea',width: '100', title: t('productStock.inventoryArea'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  //{field: 'deadStock',width: '100', title: '积压库存', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'createTime',width: '100', title: t('productStock.storageTime'), sortable: true},
  {field: 'remarks',width: '80', title: t('basicData.remarks'), sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
]
 
 
 
onMounted(() => {
  addListener(xGrid.value,gridOptions)
 
  //第一次调用
  request.get(`/BasicWarehouse/BasicWarehouseType/`+t('ingredients.originalFilm')+'|'+t('ingredients.accessories')).then((res) => {
    if(res.code==200){
      gridOptions.columns.splice(0,gridOptions.columns.length)
      BasicData.value = res.data
      //添加列
      gridOptions.columns=arr.slice()
 
      for (let i=0;i<BasicData.value.length;i++){
        let aa=null
        if(BasicData.value[i].OperateType==="name"){
          aa={field: "json."+BasicData.value[i].OperateType, width: '150',title: BasicData.value[i].OperateTypeName, sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChangeds}
        }else{
          aa={field: "json."+BasicData.value[i].OperateType, width: '150',title: BasicData.value[i].OperateTypeName, sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged}
        }
        gridOptions.columns.push(aa)
 
      }
      values.value=t('ingredientsStock.inventory')
      getInventoryWorks()
 
    }else{
      ElMessage.warning(res.msg)
    }
  })
})
 
 
 
 
 
const getInventoryWorks = () => {
 
  request.post(`/materialInventory/getSelectMaterialInventoryDate/1/${total.pageSize}/${selectDate.value}`,filterData.value).then((res) => {
 
    if(res.code==200){
      materialStore.value=[]
      for (let i=0;i<res.data.data.length;i++){
        materialStore.value[i]=(res.data.data[i])
        materialStore.value[i].json=(JSON.parse(res.data.data[i].json))
 
      }
 
      total.dataTotal = res.data.total.total*1
      total.pageTotal= res.data.total.pageTotal
      pageNum.value=1
      selectDate.value = res.data.selectDate
      gridOptions.toolbarConfig.buttons[2].disabled = false
      produceList = deepClone(materialStore.value)
      xGrid.value.loadData(produceList)
      gridOptions.loading=false
    }else{
      ElMessage.warning(res.msg)
      router.push("/login")
    }
  })
}
 
const getInventoryWorkPaging = () => {
  request.post(`/materialInventory/getSelectMaterialInventoryDate/${pageNum.value}/${total.pageSize}/${selectDate.value}`,filterData.value).then((res) => {
 
    if(res.code==200){
      materialStore.value=[]
      for (let i=0;i<res.data.data.length;i++){
        materialStore.value[i]=(res.data.data[i])
        materialStore.value[i].json=(JSON.parse(res.data.data[i].json))
      }
      if (res.data.total!=null){
        total.dataTotal = res.data.total.total*1
        total.pageTotal= res.data.total.pageTotal
      }
      produceList = deepClone(materialStore.value)
      selectDate.value = res.data.selectDate
      xGrid.value.loadData(produceList)
      gridOptions.loading=false
    }else{
      ElMessage.warning(res.msg)
      router.push("/login")
    }
  })
}
 
const selectInventoryWork = () => {
  if(values.value===t('ingredientsStock.inventory')){
    getInventoryWorks()
  }else{
    getInventoryEngineeringWork()
  }
}
 
const getInventoryEngineeringWork = () => {
 
    request.post(`/materialInventory/getSelectMaterialInventoryEngineeringDate/${pageNum.value}/${total.pageSize}/${selectDate.value}`,filterData.value).then((res) => {
 
      if(res.code==200){
        materialStore.value=[]
        for (let i=0;i<res.data.data.length;i++){
          materialStore.value[i]=(res.data.data[i])
          materialStore.value[i].json=(JSON.parse(res.data.data[i].json))
 
        }
 
        total.dataTotal = res.data.total.total*1
        total.pageTotal= res.data.total.pageTotal
        pageNum.value=1
        selectDate.value = res.data.selectDate
        gridOptions.toolbarConfig.buttons[2].disabled = true
        produceList = deepClone(materialStore.value)
        xGrid.value.loadData(produceList)
        gridOptions.loading=false
      }else{
        ElMessage.warning(res.msg)
        router.push("/login")
      }
    })
 
 
}
 
 
 
const selectOrderList = ()=>{
  request.get(`/BasicWarehouse/BasicWarehouseType/`+t('ingredients.originalFilm')+'|'+t('ingredients.accessories')).then((res) => {
    if(res.code==200){
      gridOptions.columns.splice(0,gridOptions.columns.length)
      BasicData.value = res.data
      //添加列
      gridOptions.columns=arr.slice()
 
      for (let i=0;i<BasicData.value.length;i++){
        let aa=null
        if(BasicData.value[i].OperateType==="model"){
           aa={field: "json."+BasicData.value[i].OperateType, width: '150',title: BasicData.value[i].OperateTypeName, sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged}
        }else{
           aa={field: "json."+BasicData.value[i].OperateType, width: '150',title: BasicData.value[i].OperateTypeName, sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged}
        }
 
        gridOptions.columns.push(aa)
 
      }
      if(values.value===t('ingredientsStock.inventory')){
        getInventoryWorkPaging()
      }else{
        getInventoryEngineeringWork()
      }
 
    }else{
      ElMessage.warning(res.msg)
    }
  })
}
 
const changeDate =  ()=>{
  selectOrderList()
}
 
//页脚跳转
const handlePageChange = ({ currentPage, pageSize }) => {
  selectOrderList()
  total.pageTotal = pageSize
  pageNum.value=currentPage
}
 
 
 
//子组件接收参数
const xGrid = ref()
const gridOptions = reactive({
  border:  "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe:true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true,height: 30},//鼠标移动或选择高亮
  id: 'SelectIngredientsStock',
  showFooter: true,//显示脚
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  scrollX:{enabled: true},
  scrollY:{ enabled: true ,gt:0},//开启虚拟滚动
  showOverflow:true,
  columnConfig: {
    resizable: true,
    useKey: true
  },
  filterConfig: {   //筛选配置项
    //remote: true
  },
  customConfig: {
    storage: true
  },
  editConfig: {
    trigger: 'click',
    mode: 'row',
    showStatus: true
  },//表头参数
  columns:[
 
  ],//表头按钮
  toolbarConfig: {
    buttons: [
      {'code': 'out', 'name': t('ingredientsStock.materialOutbound'),status: 'primary'},
      {'code': 'add', 'name': t('ingredients.materialAddition'),status: 'primary'},
      {'code': 'delete', 'name': t('basicData.delete'),status: 'primary'},
      {'code': 'update', 'name': t('basicData.update'),status: 'primary'},
    ],
    /*import: false,
    export: true,
    print: true,*/
    export: true,
    zoom: true,
    custom: true
  },
  footerMethod ({ columns, data }) {//页脚函数
    return[
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return t('basicData.total')
        }
        const List = ["inventoryQuantity",'availableQuantity','totalArea']
        if (List.includes(column.field)) {
          return footSum(data, column.field)
        }
        return ''
      })
    ]
  }
 
})
 
 
const gridEvents = {
  async toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'out': {
          $grid.clearFilter()
          const selectRecords = $grid.getCheckboxRecords()
 
 
          if (selectRecords.length === 0) {
            ElMessage.warning(t('productStock.unselectedData'))
            return
          }
          let id = ""
          const array = [];
          if (values.value===t('ingredientsStock.inventory')){
            for (let i = 0; i < selectRecords.length; i++) {
              array.push(selectRecords[i].id)
              if (i + 1 === selectRecords.length) {
                id += selectRecords[i].id
              } else {
                id += selectRecords[i].id + "|"
              }
            }
          }else{
            for (let i = 0; i < selectRecords.length; i++) {
              array.push(selectRecords[i].useId)
              if (i + 1 === selectRecords.length) {
                id += selectRecords[i].useId
              } else {
                id += selectRecords[i].useId + "|"
              }
            }
          }
 
 
 
 
          router.push({path: '/main/ingredientsStock/CreateOutbound', query: {id: id,type:values.value}})
          break
 
 
        }
        case 'add': {
          dialogTableVisible.value=true
          rowIndexData.value=null
          sheetIndex.value=1
          break
        }
 
        case 'update': {
 
          $grid.clearFilter()
          const selectRecords = $grid.getCheckboxRecords()
          if (selectRecords.length === 1) {
            dialogTableVisible.value=true
            rowIndexData.value=selectRecords[0]
            sheetIndex.value=2
          }else{
            ElMessage.warning(t('ingredientsStock.pleaseSelectOneData'))
            return
          }
 
 
          break
        }
 
        case 'delete': {
          $grid.clearFilter()
          const selectRecords = $grid.getCheckboxRecords()
          if (selectRecords.length === 0) {
            ElMessage.warning(t('productStock.unselectedData'))
            return
          }
          ElMessageBox.confirm(t('searchOrder.deleteConfirm'),
              {
                confirmButtonText: t('basicData.confirmButtonText'),
                cancelButtonText: t('basicData.cancelButtonText'),
                distinguishCancelAndClose: true,
                type: 'warning',
              }
          ).then(()=>{
            let id = ""
            const array = [];
            if (values.value===t('ingredientsStock.inventory')){
              for (let i = 0; i < selectRecords.length; i++) {
                array.push(selectRecords[i].id)
                if (i + 1 === selectRecords.length) {
                  id += selectRecords[i].id
                } else {
                  id += selectRecords[i].id + "|"
                }
              }
            }else{
              for (let i = 0; i < selectRecords.length; i++) {
                array.push(selectRecords[i].useId)
                if (i + 1 === selectRecords.length) {
                  id += selectRecords[i].useId
                } else {
                  id += selectRecords[i].useId + "|"
                }
              }
            }
            let flowData = ref({
              materialInventory: selectRecords,
              ids: id,
              creator: userStore.user.userName
 
            })
            request.post(`/materialInventory/deleteMaterialInventory`,flowData.value).then((res) => {
              if(res.code==200 && res.data===true){
                ElMessage.success(t('searchOrder.msgDeleteSuccess'))
                router.push({path:'/main/ingredientsStock/selectIngredientsStock', query:{random:Math.random()}})
              }else{
                ElMessage.warning(res.msg)
              }
            })
          }).catch((action)=>{
          })
          break
 
 
        }
      }
    }
  },
  cellDblclick ({row,column}) {
    copyTableCellValue(row,column)
  }
}
 
 
 
const rowStyle = ({ row,rowIndex  }) => {
  if(company.materialOutboundColor){
    let date = new Date();
    let date1=new Date();
    let date2=new Date();
    date1.setMonth(date.getMonth()-3);
    date2.setMonth(date.getMonth()-6);
 
    const date3=new Date(row.createTime);
 
    const diff = date1.getTime() - date2.getTime();
    const diffInDays = diff / (1000 * 60 * 60 * 24);
    if(date3>=date1){
      return {
        backgroundColor: '#ffffff',
      }
    }else if(date3>=date2&&date1>date3){
      return {
        backgroundColor: '#e0e7c8',
      }
    }else{
      return {
        backgroundColor: '#afa7ab',
      }
    }
  }
 
}
 
 
 
</script>
 
<template>
  <div class="main-div-customer">
    <div class="head">
<!--      <el-date-picker
          v-model="selectDate"
          type="daterange"
          :start-placeholder="$t('basicData.startDate')"
          :end-placeholder="$t('basicData.endDate')"
          format="YYYY-MM-DD"
          value-format="YYYY-MM-DD"
 
      />
      <el-button @click="changeDate" style="margin-top: -5px"  id="searchButton" type="primary" :icon="Search">{{$t('basicData.search')}}</el-button>-->
      <div style="width: 200px;">
        <el-row>
          <el-select v-model="values" :placeholder="$t('ingredients.pleaseSelectACategory')" @change="selectInventoryWork">
            <el-option
                v-for="item in selectOptions"
                :key="item.value"
                :label="item.label"
                :value="item.value"
            />
          </el-select>
        </el-row>
      </div>
    </div>
 
    <div class="main-table">
      <vxe-grid
          height="100%"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          v-on="gridEvents"
          :row-style="rowStyle"
 
      >
        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <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>
 
        <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 #pager>
          &lt;!&ndash;使用 pager 插槽&ndash;&gt;
          <vxe-pager
              @page-change="handlePageChange"
              :layouts="[  'PrevPage', 'Jump','PageCount', 'NextPage',  'Total']"
              v-model:current-page="pageNum"
              v-model:page-size="total.pageSize"
              v-model:pager-count="total.pageTotal"
              :total="total.dataTotal"
          >
          </vxe-pager>
        </template>-->
 
 
      </vxe-grid>
    </div>
 
    <el-dialog v-model="dialogTableVisible" :title="$t('ingredients.materialAddition')" style="width: 70%;height:75% ">
      <material-addition v-if="sheetIndex===1" ref="refMaterialAddition" style="width: 100%;height: 100%"
                         :data=rowIndexData :type=1
                         :close-on-click-modal="false"
                         :close-on-press-escape="false"
      />
      <material-addition v-if="sheetIndex===2" ref="refMaterialAddition" style="width: 100%;height: 100%"
                         :data=rowIndexData :type=2
                         :close-on-click-modal="false"
                         :close-on-press-escape="false"
      />
    </el-dialog>
  </div>
</template>
 
<style scoped>
.main-div-customer{
  width: 99%;
  height: 100%;
}
.main-div-customers{
  width: 99%;
  height: 100%;
}
.el-col{
  margin-left: 15px;
  margin-bottom: 5px;
}
.order-primary{
  width: 100%;
}
.head{
  width: 100%;
  height: 35px;
}
 
.main-table{
  width: 100%;
  height: calc(100% - 35px);
}
.vxe-grid {
  /* 禁用浏览器默认选中 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
</style>