Merge branch 'master' of http://10.153.19.25:10101/r/ERP_override

guoyuji

2023-12-25 729857291aab73cfd0d61056887ce92657792ca0

Merge branch 'master' of http://10.153.19.25:10101/r/ERP_override

# Conflicts:
#	north-glass-erp/.idea/workspace.xml

 north-glass-erp/.idea/workspace.xml

@@ -45,37 +45,37 @@
    <option name="hideEmptyMiddlePackages" value="true" />
    <option name="showLibraryContents" value="true" />
  </component>
  <component name="PropertiesComponent"><![CDATA[{
  "keyToString": {
    "RequestMappingsPanelOrder0": "0",
    "RequestMappingsPanelOrder1": "1",
    "RequestMappingsPanelWidth0": "75",
    "RequestMappingsPanelWidth1": "75",
    "RunOnceActivity.OpenProjectViewOnStart": "true",
    "RunOnceActivity.ShowReadmeOnStart": "true",
    "SHARE_PROJECT_CONFIGURATION_FILES": "true",
    "WebServerToolWindowFactoryState": "false",
    "git-widget-placeholder": "master",
    "last_opened_file_path": "D:/Documents/ERP_override/north-glass-erp",
    "node.js.detected.package.eslint": "true",
    "node.js.detected.package.tslint": "true",
    "node.js.selected.package.eslint": "(autodetect)",
    "node.js.selected.package.tslint": "(autodetect)",
    "nodejs_package_manager_path": "npm",
    "project.structure.last.edited": "模块",
    "project.structure.proportion": "0.0",
    "project.structure.side.proportion": "0.0",
    "settings.editor.selected.configurable": "preferences.pluginManager",
    "spring.configuration.checksum": "def6d90e829e50c63f98c387daecd138",
    "ts.external.directory.path": "D:\\file\\IntelliJ IDEA 2023.2.1\\plugins\\javascript-impl\\jsLanguageServicesImpl\\external",
    "vue.rearranger.settings.migration": "true"
  <component name="PropertiesComponent">{
  &quot;keyToString&quot;: {
    &quot;RequestMappingsPanelOrder0&quot;: &quot;0&quot;,
    &quot;RequestMappingsPanelOrder1&quot;: &quot;1&quot;,
    &quot;RequestMappingsPanelWidth0&quot;: &quot;75&quot;,
    &quot;RequestMappingsPanelWidth1&quot;: &quot;75&quot;,
    &quot;RunOnceActivity.OpenProjectViewOnStart&quot;: &quot;true&quot;,
    &quot;RunOnceActivity.ShowReadmeOnStart&quot;: &quot;true&quot;,
    &quot;SHARE_PROJECT_CONFIGURATION_FILES&quot;: &quot;true&quot;,
    &quot;WebServerToolWindowFactoryState&quot;: &quot;false&quot;,
    &quot;git-widget-placeholder&quot;: &quot;master&quot;,
    &quot;last_opened_file_path&quot;: &quot;D:/GitRepository/ERP_override/north-glass-erp/northglass-erp/src/components/pp/processCard&quot;,
    &quot;node.js.detected.package.eslint&quot;: &quot;true&quot;,
    &quot;node.js.detected.package.tslint&quot;: &quot;true&quot;,
    &quot;node.js.selected.package.eslint&quot;: &quot;(autodetect)&quot;,
    &quot;node.js.selected.package.tslint&quot;: &quot;(autodetect)&quot;,
    &quot;nodejs_package_manager_path&quot;: &quot;npm&quot;,
    &quot;project.structure.last.edited&quot;: &quot;模块&quot;,
    &quot;project.structure.proportion&quot;: &quot;0.0&quot;,
    &quot;project.structure.side.proportion&quot;: &quot;0.0&quot;,
    &quot;settings.editor.selected.configurable&quot;: &quot;preferences.pluginManager&quot;,
    &quot;spring.configuration.checksum&quot;: &quot;def6d90e829e50c63f98c387daecd138&quot;,
    &quot;ts.external.directory.path&quot;: &quot;D:\\软件\\IntelliJ IDEA 2023.2\\plugins\\javascript-impl\\jsLanguageServicesImpl\\external&quot;,
    &quot;vue.rearranger.settings.migration&quot;: &quot;true&quot;
  },
  "keyToStringList": {
    "vue.recent.templates": [
      "Vue Composition API Component"
  &quot;keyToStringList&quot;: {
    &quot;vue.recent.templates&quot;: [
      &quot;Vue Composition API Component&quot;
    ]
  }
}]]></component>
}</component>
  <component name="RecentsManager">
    <key name="CreateClassDialog.RecentsKey">
      <recent name="com.example.erp.tools" />
@@ -104,7 +104,7 @@
      <command value="length" />
    </option>
  </component>
  <component name="RunManager" selected="Spring Boot.ErpApplication">
  <component name="RunManager" selected="npm.dev">
    <configuration default="true" type="ArquillianJUnit" factoryName="" nameIsGenerated="true">
      <option name="arquillianRunConfiguration">
        <value>
@@ -212,8 +212,7 @@
      <workItem from="1702631535326" duration="205000" />
      <workItem from="1702858329054" duration="9016000" />
      <workItem from="1703031064839" duration="55055000" />
      <workItem from="1703463546867" duration="1756000" />
      <workItem from="1703471994471" duration="1561000" />
      <workItem from="1703463546867" duration="5864000" />
    </task>
    <task id="LOCAL-00001" summary="第一次推送">
      <option name="closed" value="true" />

 north-glass-erp/northglass-erp/src/router/index.js

@@ -715,8 +715,20 @@
              path: 'PaymentPurchaseOrder',
              name: 'PaymentPurchaseOrder',
              component: () => import('../views/mm/purchaseOrder/Payment.vue')
            }
            , {
            },
            /*----------- 退货 ----------------*/
            {
              path: 'ReturnPurchaseOrder',
              name: 'ReturnPurchaseOrder',
              component: () => import('../views/mm/purchaseOrder/Return.vue')
            },
            /*----------- 入库 ----------------*/
            {
              path: 'StoragePurchaseOrder',
              name: 'StoragePurchaseOrder',
              component: () => import('../views/mm/purchaseOrder/Storage.vue')
            },
            {
              path: '',
              redirect: '/main/purchaseOrder/SelectPurchaseOrder'
            }

 north-glass-erp/northglass-erp/src/views/mm/purchaseOrder/Create.vue

@@ -1,130 +1,393 @@


<template>
<div>
  <el-form label-width="100px"   :inline="true" :model="formInline" class="demo-form-inline">
    <el-form-item label="采购类型" class="item-style" >
      <el-select v-model="form.buyType" class="m-2" placeholder="选择采购类型" clearable >
        <el-option
            v-for="item in CGTypeOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
        />
      </el-select>
    </el-form-item>

    <el-form-item label="采购部门" class="item-style" >
      <el-select v-model="cgBuMen" class="m-2" placeholder="选择采购部门" clearable >
        <el-option
            v-for="item in CGBuMenOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
        />
      </el-select>
    </el-form-item>

    <el-form-item label="供应商" class="item-style" >
      <el-cascader
          placeholder="选择供应商"
          :options="buyerOptions"
          filterable
          clearable
          empty-text="empty-text"
          :v-model="form.supplier"
      >
      </el-cascader>
    </el-form-item>


    <el-form-item label="采购员" class="item-style" >
      <el-select v-model="form.buyer" class="m-2" placeholder="选择采购部门" clearable >
        <el-option
            v-for="item in BuyerOptions"
            :key="item.value"
            :label="item.label"
            :value="item.value"
        />
      </el-select>
    </el-form-item>

    <el-form-item label="采购组织" class="item-style" >
     <el-input v-model="form.buyItem" placeholder="采购组织" clearable ></el-input>
    </el-form-item>

    <el-form-item label="制表日期" class="item-style" >

        <el-date-picker
            v-model="form.date"
            type="date"
            placeholder="选择制表日期"
            style="width: 100%"
        />

    </el-form-item>
    <el-form-item class="item-style" >
  <el-header height="auto">
    <el-form label-width="100px" :inline="true" :model="formInline" class="demo-form-inline">
      <el-row :gutter="10">

        <el-col :span="6" :offset="6">
          <el-button type="primary" @click="onSubmit">保存</el-button>
        <el-col :span="6">
          <el-form-item label="采购类型" class="item-style">
            <el-select v-model="form.buyType" class="m-2" placeholder="选择采购类型" clearable>
              <el-option
                  v-for="item in CGTypeOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
              />
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="6" :offset="6">
          <el-button>取消</el-button>
        <el-col :span="6">
          <el-form-item label="采购部门" class="item-style">
            <el-select v-model="cgBuMen" class="m-2" placeholder="选择采购部门" clearable>
              <el-option
                  v-for="item in CGBuMenOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
              />
            </el-select>
          </el-form-item>
        </el-col>



        <el-col :span="6">
          <el-form-item label="供应商" class="item-style">
            <el-cascader
                placeholder="选择供应商"
                :options="buyerOptions"
                filterable
                clearable
                empty-text="empty-text"
                :v-model="form.supplier"
            >
            </el-cascader>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="采购员" class="item-style">
            <el-select v-model="form.buyer" class="m-2" placeholder="选择采购部门" clearable>
              <el-option
                  v-for="item in BuyerOptions"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
              />
            </el-select>
          </el-form-item>
        </el-col>

      </el-row>

    </el-form-item>
  </el-form>
      <el-row :gutter="10">
        <el-col :span="6">
          <el-form-item label="采购组织" class="item-style">
            <el-input v-model="form.buyItem" placeholder="采购组织" clearable></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="制表日期" class="item-style">

<div>
  <el-button class="mt-4" style="width: 10%" @click="onAddItem"
  >添加</el-button>
  <el-table :data="tableData" style="width: 98%" max-height="500" border show-summary
            sum-text=" ">
    <el-table-column fixed="left" label="操作" width="60">
      <template #default="scope">
        <el-button
            link
            type="primary"
            size="small"
            @click.prevent="deleteRow(scope.$index)"
        >
          删除
        </el-button>
            <el-date-picker
                v-model="form.date"
                type="date"
                placeholder="选择制表日期"
                style="width: 100%"
            />

          </el-form-item>
        </el-col>
<!--        <el-col :span="6">
          <el-form-item class="item-style">
            <el-row :gutter="10">

              <el-col :span="6" :offset="6">
                <el-button type="primary" @click="onSubmit">保存</el-button>
              </el-col>
              <el-col :span="6" :offset="6">
                <el-button>返回订单查询</el-button>
              </el-col>


            </el-row>

          </el-form-item>
        </el-col>-->
        <el-col :span="6"></el-col>

      </el-row>


    </el-form>

  </el-header>

  <el-main style="padding-top: 5px;height:100%">
<!--    <el-button class="mt-4" style="width: 10%" @click="onAddItem"
    >添加
    </el-button>-->

    <vxe-grid

        max-height="500"
        @filter-change="filterChanged"
        class="mytable-scrollbar"
        ref="xGrid"
        v-bind="gridOptions"
        v-on="gridEvents"
    >

      <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
      <!--      下拉显示所有信息插槽-->
      <template #content="{ row}">
        <ul class="expand-wrapper">
          <li v-for="(item,key,index) in row">
            <span style="font-weight: bold">{{ key + ':  ' }}</span>
            <span>{{ item }}</span>
          </li>
        </ul>
      </template>
    </el-table-column>
    <el-table-column fixed prop="wlcode" label="物料编码" width="150" />
    <el-table-column prop="wlname" label="物料名称" width="180" />
    <el-table-column prop="cd" label="产地" width="100" />
    <el-table-column prop="kd" label="宽度" width="70" />
    <el-table-column prop="gd" label="高度" width="70" />
    <el-table-column prop="hd" label="厚度" width="60" />
    <el-table-column prop="xh" label="型号" width="80" />
    <el-table-column prop="hd" label="单位数量" width="100" />
    <el-table-column prop="hd" label="单位" width="60" />
    <el-table-column prop="hd" label="箱数" width="60" />
    <el-table-column prop="hd" label="单片面积" width="100" />
    <el-table-column prop="hd" label="单价" width="60" />
    <el-table-column prop="hd" label="总数量" width="80" />
    <el-table-column prop="hd" label="总面积" width="80" />
    <el-table-column prop="hd" label="总金额" width="80" />
    <el-table-column prop="hd" label="备注" width="120" />

  </el-table>
      <!--左边固定显示的插槽-->
      <template #button_slot="{ row }">
        <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
        <!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
        <!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>-->
      </template>

</div>
</div>
      <template #num1_filter="{ column, $panel }">
        <div>
          <div v-for="(option, index) in column.filters" :key="index">
            <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/>
          </div>
        </div>
      </template>
    </vxe-grid>

  </el-main>

</template>

<script setup>
import { ref,reactive } from 'vue'
import {ref, reactive} from 'vue'
let router = useRouter()

// do not use same name with ref
//组件接收参数
const gridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
    //{title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},
    {type: 'seq', fixed: "left", title: ' ', width: 50},
    {type: 'checkbox',fixed:"left", title: '', width: 50 },
    {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50},
    {field: 'cgdh', width: '10%', title: '物料编码', filters: [{data: ''}], slots: {filter: 'num1_filter'}, editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'cgzt', width: '10%', title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'},editRender: { name: 'input', attrs: { placeholder: '' } }, sortable: true},
    {field: 'gys', width: '10%',title: '产地', filters: [{data: ''}], slots: {filter: 'num1_filter'}, editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'w', width: '8%',title: '宽度', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/  editRender: { name: 'input', attrs: { placeholder: '' } }, sortable: true},
    {field: 'g', width: '8%',title: '高度', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/  editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'h', width: '8%',title: '厚度', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/  editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'xh', width: '8%',title: '型号',/*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/  editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'dw', width: '8%',title: '单位', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/ editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'sl', width: '8%',title: '数量', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/ editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'sl', width: '8%',title: '操作数量', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/ editRender: { name: 'input', attrs: { placeholder: '' } }},
    {field: 'sl', width: '12%',title: '箱数',    /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/ editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'je', width: '8%',title: '单片面积', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/  editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'je', width: '12%',title: '单价',   /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/   editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: '6', width: '8%',title: '总数量',   /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/  editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'sl', width: '8%',title: '总面积', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/   editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'yl', width: '10%',title: '总金额',/*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/   editRender: { name: 'input', attrs: { placeholder: '' } },sortable: true},
    {field: 'yl', width: '10%',title: '备注', /*filters: [{data: ''}], slots: {filter: 'num1_filter'},*/   editRender: { name: 'input', attrs: { placeholder: '' } }, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [
        {type:'text'},
      {
      'name': '新增',

      'code':'Add',
    },
      {
        'name': '移除',

        'code':'Remove'
      },
      {
        'name': '保存订单',
        status:'primary',
        'code':'Save'
      },{
        'name': '入库',
        status:'primary',
        'code':'Storage'
      },
      {
        'name': '退货',
        status:'primary',
        'code':'Return'
      },
      {
        'name': '返回查询',

        'code':'GoSelect'
      }],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    tools: [

    ],

  },//表头按钮
  /*data: [{},{},{},{},{},{}],//table body实际数据*/
  data: [{},{},{}],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 4}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },

})

const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'Add': {//新增
          const record = {
            checked: false
          }
          $grid.insertAt(record, 0).then(({row}) => {
            $grid.setEditRow(row)
          })
          break
        }
        case 'Remove': {//移除
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您移除了' + $grid.getCheckboxRecords().length + '条数据！');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Save': {//保存


          if(form.buyItem === null || form.buyItem === ''){
            openAlert({type: 'message', content: '采购组织不可为空', status: 'warning'})
          }

return

          if(buyerOptions.values() <= 0){

          }

            const type = VXETable.modal.confirm('是否确定保存当前订单信息？');
          openAlert({type: 'message', content: $grid.rows.number+'', status: 'warning'})
            return

          break
        }
        case 'GoSelect':{

          router.push({path: '/main/purchaseOrder/SelectPurchaseOrder'})
          break
        }

        case 'Storage': {//入库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认入库？');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Return': {//退库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            /*            async ()=>{
              const type = await.VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？');
            }*/
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认退库？');


            /* if(VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？' )){
              //openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success',lockView: false, mask: false })


            }*/

            /* if(type==='confirm'){
              openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            }

*/
            //openAlert({type:'alert', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }

      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}


const openAlert = (options) => {
  if(options.type==='message'){
    VXETable.modal.message(options)
  }else{
    VXETable.modal.alert(options)
  }

}





const form = reactive({
  name: '',
  region: '',
@@ -133,16 +396,18 @@
  type: [],
  resource: '',
  desc: '',
  supplier:'',
  buyer:'',
  buyItem:'',
  buyType:''
  supplier: '',
  buyer: '',
  buyItem: '',
  buyType: ''

})

const onSubmit = () => {
  console.log('submit!')
}

//供应商
const buyerOptions = [
  {value: '0', label: '供应商1'},
  {value: '1', label: '供应商2'},
@@ -153,10 +418,10 @@
]



const value = ref('')
const cgBuMen = ref('')

//采购类型
const CGTypeOptions = [
  {
    value: '1',
@@ -173,8 +438,8 @@

]


const CGBuMenOptions=[
//采购部门
const CGBuMenOptions = [
  {
    value: '0',
    label: '采购华北部',
@@ -198,7 +463,8 @@

]

const BuyerOptions=[
//采购人
const BuyerOptions = [
  {
    value: '0',
    label: '采购员1',
@@ -223,6 +489,8 @@
]

import dayjs from 'dayjs'
import {VXETable} from "vxe-table";
import {useRouter} from "vue-router";

const now = new Date()

@@ -234,7 +502,7 @@
    hd: '8',
    gd: '2440',
    kd: '3660',
    xh:'CN10P'
    xh: 'CN10P'
  },
  {
    wlcode: '202312305101',
@@ -243,7 +511,7 @@
    gd: '2440',
    kd: '3660',
    hd: '5',
    xh:'CN10P'
    xh: 'CN10P'
  },
  {
    wlcode: '202312405101',
@@ -252,20 +520,19 @@
    hd: '12',
    gd: '2440',
    kd: '3660',
    xh:'CN10P'
    xh: 'CN10P'
  },
])



const onAddItem = () => {
  now.setDate(now.getDate() + 1)
  tableData.value.push({
    wlcode: dayjs(now).format('YYYYMMDDss')+'01',
    wlcode: dayjs(now).format('YYYYMMDDss') + '01',
    wlname: '这是一个物料名称',
    cd: '产地1',
    hd: '6',
    xh:'CN10P',
    xh: 'CN10P',
    gd: '2440',
    kd: '3660',
  })
@@ -285,7 +552,8 @@
    height: unset;
  }
}
.item-style{
  width:300px;

.item-style {
  width: 300px;
}
</style>

 north-glass-erp/northglass-erp/src/views/mm/purchaseOrder/Payment.vue

@@ -15,7 +15,6 @@
              format="YYYY/MM/DD"
              value-format="YYYY-MM-DD"
          />

        </el-col>

        <el-col :span="2">
@@ -30,50 +29,44 @@

    </el-header>
    <el-main style="padding-top: 5px">
      <div>
      <vxe-grid

        <el-table :data="tableData" empty-text="暂无数据" style="width: 100%" max-height="550px" border
                  show-summary
                  sum-text=" ">
          <el-table-column fixed="left" prop="rIndex" label="" width="50" align="center"></el-table-column>
          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="PayOptions"
          @="gridEvents"

          <el-table-column fixed="left" label="操作" width="100%">
            <template #default="scope">
              <el-button
                  link
                  type="primary"
                  size="small"
                  @click.prevent="editRow(scope.$index)"
              >
                编辑
              </el-button>
              <el-button
                  link
                  type="primary"
                  size="small"
                  @click.prevent="deleteRow(scope.$index)"
              >
                删除
              </el-button>
            </template>
          </el-table-column>
      >
        <!--            @="gridEvents"-->
        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <template #content="{ row}">
          <ul class="expand-wrapper">
            <li v-for="(item,key,index) in row">
              <span style="font-weight: bold">{{ key + ':  ' }}</span>
              <span>{{ item }}</span>
            </li>
          </ul>
        </template>

        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
          <!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
          <!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>-->
        </template>


          <el-table-column prop="ordernumber" label="采购单号" width="200%"/>
          <el-table-column prop="name" label="月份" width="100%"/>
          <el-table-column prop="strockNumber" label="供应商" width="200%"/>
          <el-table-column prop="city" label="期初金额" width="100%"/>
          <el-table-column prop="width" sortable label="本期应付" width="150%"/>
          <el-table-column prop="height" sortable label="本期已付" width="150%"/>
          <el-table-column prop="thick" sortable label="期末余额" width="150%"/>
          <el-table-column prop="zip" label="税率" width="150%"/>
          <el-table-column prop="zip" label="备注" width="200"/>


        </el-table>


      </div>
        <template #num1_filter="{ column, $panel }">
          <div>
            <div v-for="(option, index) in column.filters" :key="index">
              <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
      </vxe-grid>
    </el-main>
  </el-container>
</template>
@@ -81,46 +74,192 @@

<script setup>
import {ref} from 'vue'
import {Plus, Search} from "@element-plus/icons-vue";

import dayjs from 'dayjs'
import {Search} from "@element-plus/icons-vue";
import 'dayjs/locale/zh-cn'
import {VXETable} from "vxe-table";
import {reactive} from "vue";
import {useRouter} from 'vue-router'

const now = new Date()
//组件接收参数
const PayOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
   /* {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},*/
    {type: 'seq', fixed: "left", title: ' ', width: '5%'},
    {type: 'checkbox', fixed: "left", title: '', width: '5%'},
    {type: 'expand', title: '详情', fixed: "left", slots: {content: 'content'}, width: '5%'},
    {
      field: 'cgdh',
      width: '10%',
      title: '采购单号',
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      sortable: true
    },
    {field: 'cgzt', width: '10%', title: '月份', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {
      field: 'gys',
      width: '10%',
      title: '供应商',
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      sortable: true
    },
    {
      field: 'wlbh',
      width: '10%',
      title: '期初金额',
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      sortable: true
    },
    {
      field: 'wlmc',
      width: '10%',
      title: '本期应付',
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      sortable: true
    },
    {field: 'w', width: '10%', title: '本期已付', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'g', width: '10%', title: '期末余额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'h', width: '9%', title: '税率', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%', title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [{type:'text'},{
      'name': '应付确认',
      status:'primary',
      'code': 'Sure',
    }],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    style: 'paddling-left:10px'
  },//表头按钮
  data: [{},{},{},{}],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 3}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },

const tableData = ref([])
})

const autoAddRow = () => {
  for (let i = 0; i < 10; i++) {
    now.setDate(now.getDate() + 1)
    const randomInt = Math.floor(Math.random() * 999) + 1000;
    const randomOrderInt = Math.floor(Math.random() * 99) + 100;
    const randomSumInt = Math.floor(Math.random() * 99) + 10;
    var t = i % 2 === 0 ? 5 : 6;
    var s = i % 3 === 0 ? '' : i % 4 === 0 ? '已采购' : '待审核';
    var oNo = 'NGNO100000' + randomOrderInt;//订单编号
    var wlNo = 'NGWL100000' + randomInt
    tableData.value.push({

      date: dayjs(now).format('YYYY-MM-DD'),
      name: '供应商' + randomSumInt,
      state: s,
      city: 'Los Angeles',
      address: 'No. 189, Grove St, Los Angeles',
      zip: 'CA 90036',
      number: randomInt,
      width: '3660',
      height: '2440',
      rIndex: tableData.value.length + 1,
      ordernumber: oNo,
      strockNumber: wlNo,
      thick: t
    })
  }
const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'Add': {//新增
          router.push({path: '/main/purchaseOrder/CreatePurchaseOrder'})
          break
        }
        case 'Storage': {//入库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认入库？');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Return': {//退库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            /*            async ()=>{
              const type = await.VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？');
            }*/
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认退库？');


            /* if(VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？' )){
              //openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success',lockView: false, mask: false })


            }*/

            /* if(type==='confirm'){
              openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            }

*/
            //openAlert({type:'alert', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}

const CreatePurchaseOrder = () => {

const openAlert = (options) => {
  if (options.type === 'message') {
    VXETable.modal.message(options)
  } else {
    VXETable.modal.alert(options)
  }

}

@@ -155,7 +294,6 @@
    },
  },
]

</script>



 north-glass-erp/northglass-erp/src/views/mm/purchaseOrder/PurchaseOrder.vue

@@ -1,27 +1,33 @@
<template>
  <div class="common-layout">
    <el-container>
   <el-container>
      <el-header style="height: 30px">
        <el-breadcrumb :separator-icon="ArrowRight" >
          <el-breadcrumb-item>采购与物资</el-breadcrumb-item>
<!--          <el-breadcrumb-item>采购与物资</el-breadcrumb-item>
          <el-breadcrumb-item>采购订单
          </el-breadcrumb-item>-->
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/SelectPurchaseOrder'}">查询订单
          </el-breadcrumb-item>
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/SelectPurchaseOrder'}">查询
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/CreatePurchaseOrder'}">创建订单
          </el-breadcrumb-item>
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/CreatePurchaseOrder'}">创建
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/StoragePurchaseOrder'}">订单入库
          </el-breadcrumb-item>
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/PaymentPurchaseOrder'}">应付
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/ReturnPurchaseOrder'}">订单退货
          </el-breadcrumb-item>
          <el-breadcrumb-item >
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/PaymentPurchaseOrder'}">应付订单
          </el-breadcrumb-item>
          <el-breadcrumb-item style="display: none"></el-breadcrumb-item>
        </el-breadcrumb>
      </el-header>
      <el-main style="padding: 0">
        <router-view/>
<router-view/>
      </el-main>
      <!--      <el-footer>Footer</el-footer>-->
<!--     <el-footer>Footer</el-footer>-->
    </el-container>


  </div>

</template>



 north-glass-erp/northglass-erp/src/views/mm/purchaseOrder/Return.vue

New file
@@ -0,0 +1,375 @@
<template>
  <el-container>
    <el-header class="m-header" style="height: auto">
      <el-row :gutter="10" style="margin-bottom: 5px">
        <el-col :span="7">
          <el-date-picker
              v-model="datevalue"
              type="daterange"
              unlink-panels
              range-separator="到"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :shortcuts="shortcuts"
              :size="size"
              format="YYYY/MM/DD"
              value-format="YYYY-MM-DD"
          />

        </el-col>

        <el-col :span="2">
          <el-button
              id="select"
              type="primary"
              :icon="Search"
              @click="BtnSearchPurchaseOrder">查询
          </el-button>
        </el-col>
      </el-row>
    </el-header>
    <el-main style="padding-top: 5px;height:100%">
      <vxe-grid

          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          v-on="gridEvents"
      >

        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <template #content="{ row}">
          <ul class="expand-wrapper">
            <li v-for="(item,key,index) in row">
              <span style="font-weight: bold">{{ key + ':  ' }}</span>
              <span>{{ item }}</span>
            </li>
          </ul>
        </template>

        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
          <!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
          <!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</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" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
      </vxe-grid>


      <vxe-modal v-model="showDetails" title="查看详情" width="600" height="400" :mask="false" :lock-view="false" resize>
        <template #default>
          <vxe-table
              border="inner"
              auto-resize
              show-overflow
              height="auto"
              :row-config="{isHover: true}"
              :show-header="false"
              :sync-resize="showDetails"
              :data="detailData">
            <vxe-column field="label" width="40%"></vxe-column>
            <vxe-column field="value"></vxe-column>
          </vxe-table>
        </template>
      </vxe-modal>


    </el-main>
  </el-container>
</template>


<script setup>
import {ref} from "vue";
import {reactive} from "vue";
import {useRouter} from 'vue-router'
import {Search} from "@element-plus/icons-vue";
import dayjs from "dayjs";
import {VXETable} from "vxe-table";

let router = useRouter()
const getTableRow = (row, type) => {
  switch (type) {
    case 'edit' : {
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}})
      break
    }
    case 'delete': {



      alert('我接收到子组件传送的删除信息'+row.id)
      break
    }
  }
}

const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'Add': {//新增
          router.push({path: '/main/purchaseOrder/CreatePurchaseOrder'})
          break
        }
        case 'Sure':{
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认退货？');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Log':{

          openAlert({type: 'alert', content: '点击了退货记录', status: 'success'})
          break
        }

      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}

const openAlert = (options) => {
  if(options.type==='message'){
    VXETable.modal.message(options)
  }else{
    VXETable.modal.alert(options)
  }

}
const closeAlert = (id) => {
  VXETable.modal.close(id)
}

const confirmEvent = async () => {
  const type = await VXETable.modal.confirm('您确定要删除吗？')
  VXETable.modal.message({ content: `点击了 ${type}` })
}

const BtnSearchPurchaseOrder =()=>{
  for (let i = 1; i < 6; i++) {
    const randomInt = Math.floor(Math.random() * 999) + 1000;//4位数随机数
    const randomSumInt = Math.floor(Math.random() * 99) + 10;//2位数随机数
    const randomOrderInt = Math.floor(Math.random() * 99) + 100;//3位数随机数
    const t = i % 2 === 0 ? 5 : 6;
    const s = i % 2 === 0 ?  '入库' :i % 3 === 0?'退货':'部分入库';
    const thdh = i % 2 === 0 ?  '' :i % 3 === 0?'THID'+randomOrderInt:'';
    const CGNo = 'NGCG231200' + randomOrderInt;//采购编号
    const wlNo = 'NGWL1000' + randomInt;
    const xh = 'NGXH' + randomSumInt;
    const wlmc = 'WLMC' + randomInt;
    const gys = '供应商' + randomSumInt;
    const xhdh='NG231200'+randomOrderInt;
    const w = i % 2 === 0 ? '3300' : i % 3 === 0 ? '3660' : i % 4 === 0 ? '2250' : '2580';
    const h = i % 2 === 0 ? '2440' : i % 3 === 0 ? '2440' : i % 4 === 0 ? '2000' : '2300';
    const dw = i % 2 === 0 ? '片' : i % 3 === 0 ? '平米' : i % 4 === 0 ? '包' : '吨';
    now.setDate(now.getDate() + 1);
    gridOptions.data.push({
      cgdh: CGNo,
      thdh:thdh,
      h: t,
      xh: xh,
      wlbh: wlNo,
      wlmc: wlmc,
      gys: gys,
      w: w,
      g: h,
      dw: dw,
      cgzt:s,
      rq:dayjs(now).format('YYYY-MM-DD'),
      yl:randomSumInt,
      sl:randomOrderInt,
      xsdh:xhdh,
      je:randomInt,
      6: '139xxxxxxxx',

    })
  }

}



//组件接收参数
const gridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
    {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},
    {type: 'seq', fixed: "left", title: ' ', width: 50},
    { type: 'checkbox',fixed:"left", title: '', width: 50 },
    {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50},
    {field: 'thdh', width: '10%', title: '退货单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgdh', width: '10%', title: '采购单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%', title: '状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'gys', width: '10%',title: '供应商', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlbh', width: '10%',title: '物料编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlmc', width: '10%', title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xh', width: '8%',title: '型号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'dw', width: '8%',title: '单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '12%',title: '不含税单价', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '12%',title: '已采购数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '8%',title: '金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '12%',title: '不含税金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '8%',title: '税率', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '周用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '月用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%',title: '单据状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xsdh', width: '10%',title: '销售单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'rq', width: '10%',title: '制单日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%', title: '制单人', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '采购部门', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '采购组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [{type:'text'},{
        'name': '退货记录',

        'code':'Log'
      },
      {
        'name': '确认退货',
        status:'primary',
        'code':'Sure'
      }],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    style: 'paddling-left:10px'
  },//表头按钮
  data: [],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 4}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },

})

/*const showDetails = ref(false)
const detailData = ref([])
const cellClickEvent = ({ row }) => {
  detailData.value = ['采购单号', 'wlbh', 'wlmc', 'gys', 'h', 'k', 'g'].map(field => {
    return { label: field, value: row[field] }
  })
  showDetails.value = true
}*/


const now = new Date()

//时间快捷选择
const datevalue = ref('')
const shortcuts = [
  {
    text: '近一周',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
      return [start, end]
    },
  },
  {
    text: '近一个月',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
      return [start, end]
    },
  },
  {
    text: '近三个月',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
      return [start, end]
    },
  },
]

</script>


<style scoped>

</style>

 north-glass-erp/northglass-erp/src/views/mm/purchaseOrder/Select.vue

@@ -23,189 +23,304 @@
              id="select"
              type="primary"
              :icon="Search"
              @click="autoAddRow">查询
              @click="BtnSearchPurchaseOrder">查询
          </el-button>
        </el-col>
      </el-row>

    </el-header>
    <el-main style="padding-top: 5px">
      <div @scroll="handleTableScroll">
    <el-main style="padding-top: 5px;height:100%">
      <vxe-grid

        <el-table :data="tableData" empty-text="暂无数据" style="width: 100%" max-height="550px" border
                  show-summary
                  sum-text=" ">
          <el-table-column fixed="left" prop="rIndex" label="" width="50" align="center"></el-table-column>
          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          v-on="gridEvents"
      >

          <el-table-column fixed="left" label="操作" width="120">
            <template #default="scope">
              <el-button
                  link
                  type="primary"
                  size="small"
                  @click.prevent="editRow(scope.$index)"
              >
                编辑
              </el-button>
              <el-button
                  link
                  type="primary"
                  size="small"
                  @click.prevent="deleteRow(scope.$index)"
              >
                删除
              </el-button>
            </template>
          </el-table-column>
        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <template #content="{ row}">
          <ul class="expand-wrapper">
            <li v-for="(item,key,index) in row">
              <span style="font-weight: bold">{{ key + ':  ' }}</span>
              <span>{{ item }}</span>
            </li>
          </ul>
        </template>

        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
<!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
<!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>-->
        </template>


          <el-table-column prop="ordernumber" label="采购单号" width="150"/>
          <el-table-column prop="name" label="供应商" width="120"/>
          <el-table-column prop="strockNumber" label="物料编号" width="200"/>
          <el-table-column prop="city" label="物料名称" width="120"/>
          <el-table-column prop="width" sortable label="宽度" width="120"/>
          <el-table-column prop="height" sortable label="高度" width="120"/>
          <el-table-column prop="thick" sortable label="厚度" width="120"/>
          <el-table-column prop="zip" label="型号" width="120"/>
          <el-table-column prop="number" label="单位" width="120"/>
          <el-table-column prop="number" sortable label="不含税单价" width="120"/>
          <el-table-column prop="number" label="数量" width="120" show-summary="ture"/>
          <el-table-column prop="number" label="已采购数量" width="120"/>
          <el-table-column prop="zip" sortable label="金额" width="120"/>
          <el-table-column prop="zip" label="不含税金额" width="120"/>
          <el-table-column prop="date" label="税率" width="120"/>
          <el-table-column prop="date" label="库存" width="120"/>
          <el-table-column prop="zip" label="周用量" width="120"/>
          <el-table-column prop="zip" label="月用量" width="120"/>
          <el-table-column prop="state" label="单据状态" width="120"/>
          <el-table-column prop="ordernumber" label="销售单号" width="200"/>
          <el-table-column prop="date" label="制单日期" width="120"/>
          <el-table-column prop="zip" label="制单人" width="120"/>
          <el-table-column prop="zip" label="采购部门" width="120"/>
          <el-table-column prop="zip" label="采购组织" width="120"/>
          <el-table-column prop="zip" label="备注" width="200"/>
        <template #num1_filter="{ column, $panel }">
          <div>
            <div v-for="(option, index) in column.filters" :key="index">
              <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
      </vxe-grid>


        </el-table>
      <vxe-modal v-model="showDetails" title="查看详情" width="600" height="400" :mask="false" :lock-view="false" resize>
        <template #default>
          <vxe-table
              border="inner"
              auto-resize
              show-overflow
              height="auto"
              :row-config="{isHover: true}"
              :show-header="false"
              :sync-resize="showDetails"
              :data="detailData">
            <vxe-column field="label" width="40%"></vxe-column>
            <vxe-column field="value"></vxe-column>
          </vxe-table>
        </template>
      </vxe-modal>


      </div>
    </el-main>
  </el-container>
</template>


<script setup>
import {ref} from 'vue'
import {Plus, Search} from "@element-plus/icons-vue";
import {ref} from "vue";
import {reactive} from "vue";
import {useRouter} from 'vue-router'
import {Search} from "@element-plus/icons-vue";
import dayjs from "dayjs";
import {VXETable} from "vxe-table";

const s_wuliaomingcheng = ref('')
const s_buyOrderNumber = ref('')
const s_width = ref('')
const s_height = ref('')
const s_thick = ref('')
let router = useRouter()
const getTableRow = (row, type) => {
  switch (type) {
    case 'edit' : {
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}})
      break
    }
    case 'delete': {


const options = [
  {
    value: '0',
    label: '全部'
  },
  {
    value: '1',
    label: '原片'
  },
  {
    value: '2',
    label: '化学品'
  },
  {
    value: '3',
    label: '工具'
  },
  {
    value: '4',
    label: '木箱'
  },
  {
    value: '5',
    label: '白玻'
  },
]

const buyerOptions = [
  {
    value: '0',
    label: '全部'
  },
  {
    value: '1',
    label: '采购甲'
  },
  {
    value: '2',
    label: '采购乙'
  },
]

const stateOptions = [
  {
    value: '0',
    label: '待审核'
  },
  {
    value: '1',
    label: '待采购'
  },
  {
    value: '2',
    label: '已采购'
  },
]

import dayjs from 'dayjs'
import 'dayjs/locale/zh-cn'

const now = new Date()

const tableData = ref([])

const autoAddRow = () => {
  for (let i = 0; i < 10; i++) {
    now.setDate(now.getDate() + 1)
    const randomInt = Math.floor(Math.random() * 999) + 1000;
    const randomOrderInt = Math.floor(Math.random() * 99) + 100;
    const randomSumInt = Math.floor(Math.random() * 99) + 10;
    var t = i % 2 === 0 ? 5 : 6;
    var s = i % 3 === 0 ? '' : i % 4 === 0 ? '已采购' : '待审核';
    var oNo = 'NGNO100000' + randomOrderInt;//订单编号
    var wlNo = 'NGWL100000' + randomInt
    tableData.value.push({

      date: dayjs(now).format('YYYY-MM-DD'),
      name: '供应商' + randomSumInt,
      state: s,
      city: 'Los Angeles',
      address: 'No. 189, Grove St, Los Angeles',
      zip: 'CA 90036',
      number: randomInt,
      width: '3660',
      height: '2440',
      rIndex: tableData.value.length + 1,
      ordernumber: oNo,
      strockNumber: wlNo,
      thick: t
    })
      alert('我接收到子组件传送的删除信息'+row.id)
      break
    }
  }
}

const CreatePurchaseOrder = () => {
const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'Add': {//新增
          router.push({path: '/main/purchaseOrder/CreatePurchaseOrder'})
          break
        }
        case 'AddNo': {//无单新增
          openAlert({type: 'alert', content: '点击了无单新增', status: 'success'})
          break
        }

      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}

const openAlert = (options) => {
  if(options.type==='message'){
    VXETable.modal.message(options)
  }else{
    VXETable.modal.alert(options)
  }

}
const closeAlert = (id) => {
  VXETable.modal.close(id)
}

const confirmEvent = async () => {
  const type = await VXETable.modal.confirm('您确定要删除吗？')
  VXETable.modal.message({ content: `点击了 ${type}` })
}

const BtnSearchPurchaseOrder =()=>{
  for (let i = 1; i < 6; i++) {
    const randomInt = Math.floor(Math.random() * 999) + 1000;//4位数随机数
    const randomSumInt = Math.floor(Math.random() * 99) + 10;//2位数随机数
    const randomOrderInt = Math.floor(Math.random() * 99) + 100;//3位数随机数
    const t = i % 2 === 0 ? 5 : 6;
    const s = i % 2 === 0 ? '入库':i % 3 === 0 ? '待审核' : i % 5 === 0 ? '已采购' :'退库';
    const CGNo = 'NGCG231200' + randomOrderInt;//采购编号
    const wlNo = 'NGWL1000' + randomInt;
    const xh = 'NGXH' + randomSumInt;
    const wlmc = 'WLMC' + randomInt;
    const gys = '供应商' + randomSumInt;
    const xhdh='NG231200'+randomOrderInt;
    const w = i % 2 === 0 ? '3300' : i % 3 === 0 ? '3660' : i % 4 === 0 ? '2250' : '2580';
    const h = i % 2 === 0 ? '2440' : i % 3 === 0 ? '2440' : i % 4 === 0 ? '2000' : '2300';
    const dw = i % 2 === 0 ? '片' : i % 3 === 0 ? '平米' : i % 4 === 0 ? '包' : '吨';
    now.setDate(now.getDate() + 1);
    gridOptions.data.push({
      cgdh: CGNo,
      h: t,
      xh: xh,
      wlbh: wlNo,
      wlmc: wlmc,
      gys: gys,
      w: w,
      g: h,
      dw: dw,
      cgzt:s,
      rq:dayjs(now).format('YYYY-MM-DD'),
      yl:randomSumInt,
      sl:randomOrderInt,
      xsdh:xhdh,
      je:randomInt,
      6: '139xxxxxxxx',

    })
  }

}

const datevalue = ref('')


//组件接收参数
const gridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
    {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},
    {type: 'seq', fixed: "left", title: ' ', width: 50},
    { type: 'checkbox',fixed:"left", title: '', width: 50 },
    {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50},
    {field: 'cgdh', width: '10%', title: '采购单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%', title: '状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'gys', width: '10%',title: '供应商', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlbh', width: '10%',title: '物料编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlmc', width: '10%', title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xh', width: '8%',title: '型号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'dw', width: '8%',title: '单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '12%',title: '不含税单价', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '12%',title: '已采购数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '8%',title: '金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '12%',title: '不含税金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '8%',title: '税率', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '周用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '月用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%',title: '单据状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xsdh', width: '10%',title: '销售单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'rq', width: '10%',title: '制单日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%', title: '制单人', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '采购部门', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '采购组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [{type:'text'},{
      'name': '创建订单',

      'code':'Add',
    },

      {
        'name': '无单新增',

        'code':'AddNo'
      }],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    style: 'paddling-left:10px'
  },//表头按钮
  data: [],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 4}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },

})

/*const showDetails = ref(false)
const detailData = ref([])
const cellClickEvent = ({ row }) => {
  detailData.value = ['采购单号', 'wlbh', 'wlmc', 'gys', 'h', 'k', 'g'].map(field => {
    return { label: field, value: row[field] }
  })
  showDetails.value = true
}*/


const now = new Date()

//时间快捷选择
const datevalue = ref('')
const shortcuts = [
  {
    text: '近一周',
@@ -240,19 +355,5 @@


<style scoped>
.el-row {
  margin-bottom: 20px;
}

.el-row:last-child {
  margin-bottom: 0;
}

.el-col {
  border-radius: 4px;
}

.m-header {
  height: 32px;
}
</style>

 north-glass-erp/northglass-erp/src/views/mm/purchaseOrder/Storage.vue

New file
@@ -0,0 +1,370 @@
<template>
  <el-container>
    <el-header class="m-header" style="height: auto">
      <el-row :gutter="10" style="margin-bottom: 5px">
        <el-col :span="7">
          <el-date-picker
              v-model="datevalue"
              type="daterange"
              unlink-panels
              range-separator="到"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              :shortcuts="shortcuts"
              :size="size"
              format="YYYY/MM/DD"
              value-format="YYYY-MM-DD"
          />

        </el-col>

        <el-col :span="2">
          <el-button
              id="select"
              type="primary"
              :icon="Search"
              @click="BtnSearchPurchaseOrder">查询
          </el-button>
        </el-col>
      </el-row>
    </el-header>
    <el-main style="padding-top: 5px;height:100%">
      <vxe-grid

          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          v-on="gridEvents"
      >

        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <template #content="{ row}">
          <ul class="expand-wrapper">
            <li v-for="(item,key,index) in row">
              <span style="font-weight: bold">{{ key + ':  ' }}</span>
              <span>{{ item }}</span>
            </li>
          </ul>
        </template>

        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
          <!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
          <!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</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" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
      </vxe-grid>


      <vxe-modal v-model="showDetails" title="查看详情" width="600" height="400" :mask="false" :lock-view="false" resize>
        <template #default>
          <vxe-table
              border="inner"
              auto-resize
              show-overflow
              height="auto"
              :row-config="{isHover: true}"
              :show-header="false"
              :sync-resize="showDetails"
              :data="detailData">
            <vxe-column field="label" width="40%"></vxe-column>
            <vxe-column field="value"></vxe-column>
          </vxe-table>
        </template>
      </vxe-modal>


    </el-main>
  </el-container>
</template>


<script setup>
import {ref} from "vue";
import {reactive} from "vue";
import {useRouter} from 'vue-router'
import {Search} from "@element-plus/icons-vue";
import dayjs from "dayjs";
import {VXETable} from "vxe-table";

let router = useRouter()
const getTableRow = (row, type) => {
  switch (type) {
    case 'edit' : {
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}})
      break
    }
    case 'delete': {



      alert('我接收到子组件传送的删除信息'+row.id)
      break
    }
  }
}

const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'Sure':{
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认退货？');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Log':{

          openAlert({type: 'alert', content: '点击了退货记录', status: 'success'})
          break
        }
      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}

const openAlert = (options) => {
  if(options.type==='message'){
    VXETable.modal.message(options)
  }else{
    VXETable.modal.alert(options)
  }

}
const closeAlert = (id) => {
  VXETable.modal.close(id)
}

const confirmEvent = async () => {
  const type = await VXETable.modal.confirm('您确定要删除吗？')
  VXETable.modal.message({ content: `点击了 ${type}` })
}

const BtnSearchPurchaseOrder =()=>{
  for (let i = 1; i < 6; i++) {
    const randomInt = Math.floor(Math.random() * 999) + 1000;//4位数随机数
    const randomSumInt = Math.floor(Math.random() * 99) + 10;//2位数随机数
    const randomOrderInt = Math.floor(Math.random() * 99) + 100;//3位数随机数
    const t = i % 2 === 0 ? 5 : 6;
    const s = i % 2 === 0 ? '入库':i % 3 === 0 ? '待审核' : '已采购';
    const rkdh = i % 2 === 0 ? 'RKID'+randomOrderInt:i % 3 === 0 ? '' : '';
    const CGNo = 'NGCG231200' + randomOrderInt;//采购编号
    const wlNo = 'NGWL1000' + randomInt;
    const xh = 'NGXH' + randomSumInt;
    const wlmc = 'WLMC' + randomInt;
    const gys = '供应商' + randomSumInt;
    const xhdh='NG231200'+randomOrderInt;
    const w = i % 2 === 0 ? '3300' : i % 3 === 0 ? '3660' : i % 4 === 0 ? '2250' : '2580';
    const h = i % 2 === 0 ? '2440' : i % 3 === 0 ? '2440' : i % 4 === 0 ? '2000' : '2300';
    const dw = i % 2 === 0 ? '片' : i % 3 === 0 ? '平米' : i % 4 === 0 ? '包' : '吨';
    now.setDate(now.getDate() + 1);
    gridOptions.data.push({
      cgdh: CGNo,
      rkdh:rkdh,
      h: t,
      xh: xh,
      wlbh: wlNo,
      wlmc: wlmc,
      gys: gys,
      w: w,
      g: h,
      dw: dw,
      cgzt:s,
      rq:dayjs(now).format('YYYY-MM-DD'),
      yl:randomSumInt,
      sl:randomOrderInt,
      xsdh:xhdh,
      je:randomInt,
      6: '139xxxxxxxx',

    })
  }

}



//组件接收参数
const gridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
    {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},
    {type: 'seq', fixed: "left", title: ' ', width: 50},
    { type: 'checkbox',fixed:"left", title: '', width: 50 },
    {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50},
    {field: 'rkdh', width: '10%', title: '入库单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgdh', width: '10%', title: '采购单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%', title: '状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'gys', width: '10%',title: '供应商', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlbh', width: '10%',title: '物料编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlmc', width: '10%', title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xh', width: '8%',title: '型号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'dw', width: '8%',title: '单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '12%',title: '不含税单价', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '12%',title: '已采购数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '8%',title: '金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '12%',title: '不含税金额', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '8%',title: '税率', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '周用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '月用量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%',title: '单据状态', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xsdh', width: '10%',title: '销售单号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'rq', width: '10%',title: '制单日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%', title: '制单人', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '采购部门', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '采购组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [{type:'text'/*,name:'订单入库'*/},{
      'name': '入库记录',

      'code':'Log'
    },
      {
        'name': '确认入库',
        status:'primary',
        'code':'Sure'
      }],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    style: 'paddling-left:10px'
  },//表头按钮
  data: [],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 4}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },

})

/*const showDetails = ref(false)
const detailData = ref([])
const cellClickEvent = ({ row }) => {
  detailData.value = ['采购单号', 'wlbh', 'wlmc', 'gys', 'h', 'k', 'g'].map(field => {
    return { label: field, value: row[field] }
  })
  showDetails.value = true
}*/


const now = new Date()

//时间快捷选择
const datevalue = ref('')
const shortcuts = [
  {
    text: '近一周',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 7)
      return [start, end]
    },
  },
  {
    text: '近一个月',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 30)
      return [start, end]
    },
  },
  {
    text: '近三个月',
    value: () => {
      const end = new Date()
      const start = new Date()
      start.setTime(start.getTime() - 3600 * 1000 * 24 * 90)
      return [start, end]
    },
  },
]

</script>


<style scoped>

</style>

 north-glass-erp/northglass-erp/src/views/mm/stockReport/StockMonthReport.vue

@@ -1,6 +1,6 @@
<template>
  <el-container>
    <el-header class="m-header" style="height: auto">
    <el-header class="m-header">
      <el-row :gutter="10">
        <el-col :span="6">
          <el-date-picker
@@ -27,57 +27,43 @@
      </el-row>
    </el-header>
    <el-main style="padding-top: 5px">
      <el-table :data="tableData" style="width: 100%" max-height="550" border show-summary sum-text=" "
                empty-text="暂无数据">
        <el-table-column fixed="left" prop="rIndex" label="" width="50" align="center"></el-table-column>
      <vxe-grid
          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          @="gridEvents"
      >

        <el-table-column fixed="left" label="操作" width="120">
          <template #default="scope">
            <el-button
                link
                type="primary"
                size="small"
                @click.prevent="deleteRow(scope.$index)"
            >
              删除
            </el-button>
            <el-button
                link
                type="primary"
                size="small"
                @click.prevent="deleteRow(scope.$index)"
            >
              编辑
            </el-button>
          </template>
        </el-table-column>
        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <template #content="{ row}">
          <ul class="expand-wrapper">
            <li v-for="(item,key,index) in row">
              <span style="font-weight: bold">{{ key + ':  ' }}</span>
              <span>{{ item }}</span>
            </li>
          </ul>
        </template>

        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
          <!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
          <!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>-->
        </template>


        <el-table-column prop="name" label="库存组织" width="150"/>
        <el-table-column prop="wlNumber" label="物料编码" width="150"/>
        <el-table-column prop="state" label="物料名称" width="120"/>
        <el-table-column prop="city" label="产地" width="120"/>
        <el-table-column prop="kcNumber" label="库存编号" width="150"/>
        <el-table-column prop="width" sortable label="宽度" width="120"/>
        <el-table-column prop="height" sortable label="高度" width="120"/>
        <el-table-column prop="thick" sortable label="厚度" width="120"/>
        <el-table-column prop="zip" label="主单位" width="120"/>
        <el-table-column prop="number" label="安全库存" width="120"/>
        <el-table-column prop="number" sortable label="库存数" width="120"/>
        <el-table-column prop="number" label="可用库存" width="120" show-summary="ture"/>
        <el-table-column prop="number" label="未领数量" width="120"/>
        <el-table-column prop="zip" sortable label="总面积" width="120"/>
        <el-table-column prop="zip" label="单片面积" width="120"/>
        <el-table-column prop="date" label="生产日期" width="120"/>
        <el-table-column prop="date" label="保质期" width="120"/>
        <el-table-column prop="zip" label="库存编号" width="120"/>
        <el-table-column prop="zip" label="库区" width="120"/>
        <el-table-column prop="zip" label="库位" width="120"/>
        <el-table-column prop="zip" label="积压库存" width="120"/>
        <el-table-column prop="zip" label="备注" width="120"/>
        <template #num1_filter="{ column, $panel }">
          <div>
            <div v-for="(option, index) in column.filters" :key="index">
              <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
      </vxe-grid>


      </el-table>
    </el-main>
  </el-container>
</template>
@@ -85,73 +71,207 @@

<script setup>

import {ref} from 'vue'
import dayjs from 'dayjs'
import {ref} from "vue";
import {reactive} from "vue";
import {useRouter} from 'vue-router'
import {Search} from "@element-plus/icons-vue";
import dayjs from "dayjs";
import {VXETable} from "vxe-table";
let router = useRouter()

const now = new Date()
//组件接收参数
const gridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
    /* {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},*/
    {type: 'seq', fixed: "left", title: ' ', width: 50},
    /*{ type: 'checkbox',fixed:"left", title: '', width: 50 },*/
    {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50},
    {field: 'cgdh', width: '10%', title: '库存组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%', title: '物料编码', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'gys', width: '10%',title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlbh', width: '10%',title: '产地', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlmc', width: '10%', title: '库存编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xh', width: '8%',title: '主单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'dw', width: '8%',title: '安全库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '12%',title: '库存数', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '可用库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '12%',title: '未领数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '8%',title: '总面积', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '12%',title: '单片面积', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '8%',title: '生产日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '保质期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '库存编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '库区', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%',title: '库位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xsdh', width: '10%',title: '积压库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [{type:'text'},{type:'text',name:'原片月结报表'}],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    style: 'paddling-left:10px'
  },//表头按钮
  data: [
    {},{},{},{},{},{},{},{},{},{},{},

const tableData = ref([])
  ],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 2}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },
})

const autoAddRow = () => {
  for (let i = 0; i < 10; i++) {
    const randomKCInt = Math.floor(Math.random() * 9999) + 10000;
    const randomInt = Math.floor(Math.random() * 999) + 1000;
    const randomZZInt = Math.floor(Math.random() * 99) + 100;
    const randomSumInt = Math.floor(Math.random() * 99) + 10;
    const kcThick = i % 3 === 0 ? 5 : i % 4 === 0 ? 6 : i % 5 === 0 ? 8 : 10;
    now.setDate(now.getDate() + 1)
    tableData.value.push({
      date: dayjs(now).format('YYYY-MM-DD'),
      name: '物料组织' + randomZZInt,
      state: '物料' + randomSumInt,
      city: '产地' + (randomSumInt * 6),
      address: 'No. 189, Grove St, Los Angeles',
      zip: 'CA 90036',
      number: 666 + 66 * i,
      width: '3660',
      height: '2440',
      rIndex: tableData.value.length + 1,
      wlNumber: 'NGWL1000' + randomInt,
      kcNumber: 'NGKC100' + randomKCInt,
      thick: kcThick
    })



const getTableRow = (row, type) => {
  switch (type) {
    case 'edit' : {
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}})
      break
    }
    case 'delete': {



      alert('我接收到子组件传送的删除信息'+row.id)
      break
    }
  }
}




const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'Add': {//新增
          router.push({path: '/main/purchaseOrder/CreatePurchaseOrder'})
          break
        }
        case 'Storage': {//入库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认入库？');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Return': {//退库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            /*            async ()=>{
              const type = await.VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？');
            }*/
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认退库？');


            /* if(VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？' )){
              //openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success',lockView: false, mask: false })


            }*/

            /* if(type==='confirm'){
              openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            }

*/
            //openAlert({type:'alert', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}

const openAlert = (options) => {
  if(options.type==='message'){
    VXETable.modal.message(options)
  }else{
    VXETable.modal.alert(options)
  }

}

</script>


<style scoped>
.el-row {
  margin-bottom: 20px;
}

.el-row:last-child {
  margin-bottom: 0;
}

.el-col {
  border-radius: 4px;
}

.m-header {
  height: 32px;
}

#main {
  width: 100%;
  height: 100%;
}

#div-title {
  height: 5%;
  width: 100%;
  padding-left: 20px;
}

#main-body {
  width: 100%;
  height: 64%;
  margin-top: 1%;
  height: auto
}
</style>

 north-glass-erp/northglass-erp/src/views/mm/stockReport/StockReport.vue

@@ -3,9 +3,9 @@
    <el-container>
      <el-header style="height: 30px">
        <el-breadcrumb :separator-icon="ArrowRight">
          <el-breadcrumb-item>采购与物资</el-breadcrumb-item>
<!--          <el-breadcrumb-item>采购与物资</el-breadcrumb-item>
          <el-breadcrumb-item>仓储报表
          </el-breadcrumb-item>
          </el-breadcrumb-item>-->
          <el-breadcrumb-item :to="{path:'/main/stockReport/WarehouseReport'}">原材料报表
          </el-breadcrumb-item>
          <el-breadcrumb-item :to="{path:'/main/stockReport/StockWarehouseReport'}">成品报表
@@ -15,7 +15,7 @@
          <el-breadcrumb-item :to="{path:'/main/stockReport/SubsidiaryMonthReport'}">
            辅料月结
          </el-breadcrumb-item>
          <el-breadcrumb-item></el-breadcrumb-item>
          <el-breadcrumb-item style="display: none"></el-breadcrumb-item>
        </el-breadcrumb>
      </el-header>
      <el-main style="padding: 0;width: 99%;height: 100%;">

 north-glass-erp/northglass-erp/src/views/mm/stockReport/StockWarehouseReport.vue

@@ -1,144 +1,255 @@
<template>
  <div style="padding: 0;width: 100%;height: 100%">
<div style="padding: 0;width: 100%;height: 100%">

    <el-header class="m-header" style="height: auto">

    </el-header>
    <el-main style="padding-top: 5px">
      <el-table :data="tableData" style="width: 100%" max-height="620px"  border show-summary sum-text=" "
                empty-text="暂无数据">
        <el-table-column fixed="left" prop="rIndex" label="" width="50" align="center"></el-table-column>
      <vxe-grid
          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          v-on="gridEvents"
      >

        <el-table-column fixed="left" label="操作" width="120">
          <template #default="scope">
            <el-button
                link
                type="primary"
                size="small"
                @click.prevent="deleteRow(scope.$index)"
            >
              删除
            </el-button>
            <el-button
                link
                type="primary"
                size="small"
                @click.prevent="deleteRow(scope.$index)"
            >
              编辑
            </el-button>
          </template>
        </el-table-column>
        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <template #content="{ row}">
          <ul class="expand-wrapper">
            <li v-for="(item,key,index) in row">
              <span style="font-weight: bold">{{ key + ':  ' }}</span>
              <span>{{ item }}</span>
            </li>
          </ul>
        </template>

        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
          <!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
          <!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>-->
        </template>


        <el-table-column prop="name" label="成品库存组织" width="150"/>
        <el-table-column prop="wlNumber" label="物料编码" width="150"/>
        <el-table-column prop="state" label="物料名称" width="120"/>
        <el-table-column prop="city" label="产地" width="120"/>
        <el-table-column prop="kcNumber" label="库存编号" width="150"/>
        <el-table-column prop="width" sortable label="宽度" width="120"/>
        <el-table-column prop="height" sortable label="高度" width="120"/>
        <el-table-column prop="thick" sortable label="厚度" width="120"/>
        <el-table-column prop="zip" label="主单位" width="120"/>
        <el-table-column prop="number" label="安全库存" width="120"/>
        <el-table-column prop="number" sortable label="库存数" width="120"/>
        <el-table-column prop="number" label="可用库存" width="120" show-summary="ture"/>
        <el-table-column prop="number" label="未领数量" width="120"/>
        <el-table-column prop="zip" sortable label="总面积" width="120"/>
        <el-table-column prop="zip" label="单片面积" width="120"/>
        <el-table-column prop="date" label="生产日期" width="120"/>
        <el-table-column prop="date" label="保质期" width="120"/>
        <el-table-column prop="zip" label="库存编号" width="120"/>
        <el-table-column prop="zip" label="库区" width="120"/>
        <el-table-column prop="zip" label="库位" width="120"/>
        <el-table-column prop="zip" label="积压库存" width="120"/>
        <el-table-column prop="zip" label="备注" width="120"/>


      </el-table>
        <template #num1_filter="{ column, $panel }">
          <div>
            <div v-for="(option, index) in column.filters" :key="index">
              <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
      </vxe-grid>
    </el-main>
  </div>
</template>


<script setup>

import {ref} from 'vue'
const wuliaoxinxi = ref('')
const wuliaokuan = ref('')
const wuliaogao = ref('')
const options = [
  {
    value: '0',
    label: '全部'
  },
  {
    value: '1',
    label: '原片'
  },
  {
    value: '2',
    label: '化学品'
  },
  {
    value: '3',
    label: '工具'
  },
  {
    value: '4',
    label: '木箱'
  },
  {
    value: '5',
    label: '白玻'
  },
]
import {reactive} from "vue";
import {useRouter} from 'vue-router'
import {Search} from "@element-plus/icons-vue";
import dayjs from "dayjs";
import {VXETable} from "vxe-table";
let router = useRouter()

import dayjs from 'dayjs'
//组件接收参数
const gridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
   /* {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},*/
    {type: 'seq', fixed: "left", title: ' ', width: 50},
    /*{ type: 'checkbox',fixed:"left", title: '', width: 50 },*/
    {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50},
    {field: 'cgdh', width: '10%', title: '库存组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%', title: '物料编码', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'gys', width: '10%',title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlbh', width: '10%',title: '产地', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlmc', width: '10%', title: '库存编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xh', width: '8%',title: '主单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'dw', width: '8%',title: '安全库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '12%',title: '库存数', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '可用库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '12%',title: '未领数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '8%',title: '总面积', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '12%',title: '单片面积', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '8%',title: '生产日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '保质期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '库存编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '库区', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%',title: '库位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xsdh', width: '10%',title: '积压库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [{type:'text'},{
      'name': '成品库存',
      'code': 'ProductStockList',
    },{
      'name': '入库记录',
      'code': 'StorageRecord',
    }],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    style: 'paddling-left:10px'
  },//表头按钮
  data: [
    {},{},{},{},{},{},{},{},{},{},{},

const now = new Date()
  ],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 2}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },
})

const tableData = ref([
  {
    date: '2016-05-01',
    name: 'Tom',
    state: 'California',
    city: 'Los Angeles',
    address: 'No. 189, Grove St, Los Angeles',
    zip: 'CA 90036',
    number: '999',
    width: '3660',
    height: '2440',
    rIndex: 1,
  }
])

const autoAddRow = () => {
  for (let i = 0; i < 10; i++) {
    const randomKCInt = Math.floor(Math.random() * 9999) + 10000;
    const randomInt = Math.floor(Math.random() * 999) + 1000;
    const randomZZInt = Math.floor(Math.random() * 99) + 100;
    const randomSumInt = Math.floor(Math.random() * 99) + 10;
    const kcThick = i % 3 === 0 ? 5 : i % 4 === 0 ? 6 : i % 5 === 0 ? 8 : 10;
    now.setDate(now.getDate() + 1)
    tableData.value.push({
      date: dayjs(now).format('YYYY-MM-DD'),
      name: '物料组织' + randomZZInt,
      state: '物料' + randomSumInt,
      city: '产地' + (randomSumInt * 6),
      address: 'No. 189, Grove St, Los Angeles',
      zip: 'CA 90036',
      number: 666 + 66 * i,
      width: '3660',
      height: '2440',
      rIndex: tableData.value.length + 1,
      wlNumber: 'NGWL1000' + randomInt,
      kcNumber: 'NGKC100' + randomKCInt,
      thick: kcThick
    })


const getTableRow = (row, type) => {
  switch (type) {
    case 'edit' : {
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}})
      break
    }
    case 'delete': {



      alert('我接收到子组件传送的删除信息'+row.id)
      break
    }
  }
}




const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'ProductStockList': {//新增
          router.push({path: '/main/productStock/ProductStockList'})
          break
        }
        case 'StorageRecord': {//入库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'alert', content: '您点击了查看入库记录', status: 'success'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认入库？');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Return': {//退库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            /*            async ()=>{
              const type = await.VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？');
            }*/
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认退库？');


            /* if(VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？' )){
              //openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success',lockView: false, mask: false })


            }*/

            /* if(type==='confirm'){
              openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            }

*/
            //openAlert({type:'alert', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}

const openAlert = (options) => {
  if(options.type==='message'){
    VXETable.modal.message(options)
  }else{
    VXETable.modal.alert(options)
  }

}


</script>



 north-glass-erp/northglass-erp/src/views/mm/stockReport/SubsidiaryMonthReport.vue

@@ -1,6 +1,6 @@
<template>
  <el-container>
    <el-header class="m-header" style="height: auto">
    <el-header class="m-header">
      <el-row :gutter="10">
        <el-col :span="6">
          <el-date-picker
@@ -23,63 +23,47 @@
              :icon="Search"
              @click="autoAddRow">查询
          </el-button>

        </el-col>

      </el-row>
    </el-header>
    <el-main style="padding-top: 5px">
      <el-table :data="tableData" style="width: 100%" max-height="550" border show-summary sum-text=" "
                empty-text="暂无数据">
        <el-table-column fixed="left" prop="rIndex" label="" width="50" align="center"></el-table-column>
      <vxe-grid
          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          @="gridEvents"
      >

        <el-table-column fixed="left" label="操作" width="120">
          <template #default="scope">
            <el-button
                link
                type="primary"
                size="small"
                @click.prevent="deleteRow(scope.$index)"
            >
              删除
            </el-button>
            <el-button
                link
                type="primary"
                size="small"
                @click.prevent="deleteRow(scope.$index)"
            >
              编辑
            </el-button>
          </template>
        </el-table-column>
        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <template #content="{ row}">
          <ul class="expand-wrapper">
            <li v-for="(item,key,index) in row">
              <span style="font-weight: bold">{{ key + ':  ' }}</span>
              <span>{{ item }}</span>
            </li>
          </ul>
        </template>

        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
          <!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
          <!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>-->
        </template>


        <el-table-column prop="name" label="库存组织" width="150"/>
        <el-table-column prop="wlNumber" label="物料编码" width="150"/>
        <el-table-column prop="state" label="物料名称" width="120"/>
        <el-table-column prop="city" label="产地" width="120"/>
        <el-table-column prop="kcNumber" label="库存编号" width="150"/>
        <el-table-column prop="width" sortable label="宽度" width="120"/>
        <el-table-column prop="height" sortable label="高度" width="120"/>
        <el-table-column prop="thick" sortable label="厚度" width="120"/>
        <el-table-column prop="zip" label="主单位" width="120"/>
        <el-table-column prop="number" label="安全库存" width="120"/>
        <el-table-column prop="number" sortable label="库存数" width="120"/>
        <el-table-column prop="number" label="可用库存" width="120" show-summary="ture"/>
        <el-table-column prop="number" label="未领数量" width="120"/>
        <el-table-column prop="zip" sortable label="总面积" width="120"/>
        <el-table-column prop="zip" label="单片面积" width="120"/>
        <el-table-column prop="date" label="生产日期" width="120"/>
        <el-table-column prop="date" label="保质期" width="120"/>
        <el-table-column prop="zip" label="库存编号" width="120"/>
        <el-table-column prop="zip" label="库区" width="120"/>
        <el-table-column prop="zip" label="库位" width="120"/>
        <el-table-column prop="zip" label="积压库存" width="120"/>
        <el-table-column prop="zip" label="备注" width="120"/>
        <template #num1_filter="{ column, $panel }">
          <div>
            <div v-for="(option, index) in column.filters" :key="index">
              <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
      </vxe-grid>


      </el-table>
    </el-main>
  </el-container>
</template>
@@ -87,75 +71,198 @@

<script setup>

import {ref} from 'vue'
import dayjs from 'dayjs'
import {ref} from "vue";
import {reactive} from "vue";
import {useRouter} from 'vue-router'
import {Search} from "@element-plus/icons-vue";
import dayjs from "dayjs";
import {VXETable} from "vxe-table";
let router = useRouter()

const now = new Date()
//组件接收参数
const gridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
    /* {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},*/
    {type: 'seq', fixed: "left", title: ' ', width: 50},
    /*{ type: 'checkbox',fixed:"left", title: '', width: 50 },*/
    {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50},
    {field: 'cgdh', width: '10%', title: '库存组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%', title: '物料编码', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'gys', width: '10%',title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlbh', width: '10%',title: '产地', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlmc', width: '10%', title: '库存编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xh', width: '8%',title: '主单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'dw', width: '8%',title: '安全库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '12%',title: '库存数', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '可用库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '12%',title: '未领数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '8%',title: '总面积', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'je', width: '12%',title: '单片面积', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '8%',title: '生产日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'sl', width: '8%',title: '保质期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '库存编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'yl', width: '10%',title: '库区', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cgzt', width: '10%',title: '库位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'xsdh', width: '10%',title: '积压库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: '6', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [{type:'text'},{type:'text',name:'辅料月结报表'}],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    style: 'paddling-left:10px'
  },//表头按钮
  data: [
    {},{},{},{},{},{},{},{},{},{},{},
  ],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 2}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },
})
const getTableRow = (row, type) => {
  switch (type) {
    case 'edit' : {
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}})
      break
    }
    case 'delete': {

const tableData = ref([

])

const autoAddRow = () => {
  for (let i = 0; i < 10; i++) {
    const randomKCInt = Math.floor(Math.random() * 9999) + 10000;
    const randomInt = Math.floor(Math.random() * 999) + 1000;
    const randomZZInt = Math.floor(Math.random() * 99) + 100;
    const randomSumInt = Math.floor(Math.random() * 99) + 10;
    const kcThick = i % 3 === 0 ? 5 : i % 4 === 0 ? 6 : i % 5 === 0 ? 8 : 10;
    now.setDate(now.getDate() + 1)
    tableData.value.push({
      date: dayjs(now).format('YYYY-MM-DD'),
      name: '物料组织' + randomZZInt,
      state: '物料' + randomSumInt,
      city: '产地' + (randomSumInt * 6),
      address: 'No. 189, Grove St, Los Angeles',
      zip: 'CA 90036',
      number: 666 + 66 * i,
      width: '3660',
      height: '2440',
      rIndex: tableData.value.length + 1,
      wlNumber: 'NGWL1000' + randomInt,
      kcNumber: 'NGKC100' + randomKCInt,
      thick: kcThick
    })
      alert('我接收到子组件传送的删除信息'+row.id)
      break
    }
  }
}
const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'Add': {//新增
          router.push({path: '/main/purchaseOrder/CreatePurchaseOrder'})
          break
        }
        case 'Storage': {//入库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认入库？');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Return': {//退库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            /*            async ()=>{
              const type = await.VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？');
            }*/
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认退库？');


            /* if(VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？' )){
              //openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success',lockView: false, mask: false })


            }*/

            /* if(type==='confirm'){
              openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            }

*/
            //openAlert({type:'alert', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}

const openAlert = (options) => {
  if(options.type==='message'){
    VXETable.modal.message(options)
  }else{
    VXETable.modal.alert(options)
  }

}

</script>


<style scoped>
.el-row {
  margin-bottom: 20px;
}

.el-row:last-child {
  margin-bottom: 0;
}

.el-col {
  border-radius: 4px;
}

.m-header {
  height: 32px;
}

#main {
  width: 100%;
  height: 100%;
}

#div-title {
  height: 5%;
  width: 100%;
  padding-left: 20px;
}

#main-body {
  width: 100%;
  height: 64%;
  margin-top: 1%;
  height: auto
}
</style>

 north-glass-erp/northglass-erp/src/views/mm/stockReport/WarehouseReport.vue

@@ -5,140 +5,267 @@

    </el-header>
    <el-main style="padding-top: 5px">
      <el-table :data="tableData" style="width: 100%" max-height="620px"  border show-summary sum-text=" "
                empty-text="暂无数据">
        <el-table-column fixed="left" prop="rIndex" label="" width="50" align="center"></el-table-column>
      <vxe-grid
          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          v-on="gridEvents"
      >

        <el-table-column fixed="left" label="操作" width="120">
          <template #default="scope">
            <el-button
                link
                type="primary"
                size="small"
                @click.prevent="deleteRow(scope.$index)"
            >
              删除
            </el-button>
            <el-button
                link
                type="primary"
                size="small"
                @click.prevent="deleteRow(scope.$index)"
            >
              编辑
            </el-button>
          </template>
        </el-table-column>
        <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
        <!--      下拉显示所有信息插槽-->
        <template #content="{ row}">
          <ul class="expand-wrapper">
            <li v-for="(item,key,index) in row">
              <span style="font-weight: bold">{{ key + ':  ' }}</span>
              <span>{{ item }}</span>
            </li>
          </ul>
        </template>

        <!--左边固定显示的插槽-->
        <template #button_slot="{ row }">
          <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>
          <!--          <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>-->
          <!--          <el-button @click="cellClickEvent" link type="primary" size="small">详情</el-button>-->
        </template>


        <el-table-column prop="name" label="原材料库存组织" width="150"/>
        <el-table-column prop="wlNumber" label="物料编码" width="150"/>
        <el-table-column prop="state" label="物料名称" width="120"/>
        <el-table-column prop="city" label="产地" width="120"/>
        <el-table-column prop="kcNumber" label="库存编号" width="150"/>
        <el-table-column prop="width" sortable label="宽度" width="120"/>
        <el-table-column prop="height" sortable label="高度" width="120"/>
        <el-table-column prop="thick" sortable label="厚度" width="120"/>
        <el-table-column prop="zip" label="主单位" width="120"/>
        <el-table-column prop="number" label="安全库存" width="120"/>
        <el-table-column prop="number" sortable label="库存数" width="120"/>
        <el-table-column prop="number" label="可用库存" width="120" show-summary="ture"/>
        <el-table-column prop="number" label="未领数量" width="120"/>
        <el-table-column prop="zip" sortable label="总面积" width="120"/>
        <el-table-column prop="zip" label="单片面积" width="120"/>
        <el-table-column prop="date" label="生产日期" width="120"/>
        <el-table-column prop="date" label="保质期" width="120"/>
        <el-table-column prop="zip" label="库存编号" width="120"/>
        <el-table-column prop="zip" label="库区" width="120"/>
        <el-table-column prop="zip" label="库位" width="120"/>
        <el-table-column prop="zip" label="积压库存" width="120"/>
        <el-table-column prop="zip" label="备注" width="120"/>


      </el-table>
        <template #num1_filter="{ column, $panel }">
          <div>
            <div v-for="(option, index) in column.filters" :key="index">
              <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </template>
      </vxe-grid>
    </el-main>
  </div>
</template>


<script setup>

import {ref} from 'vue'
const wuliaoxinxi = ref('')
const wuliaokuan = ref('')
const wuliaogao = ref('')
const options = [
  {
    value: '0',
    label: '全部'
  },
  {
    value: '1',
    label: '原片'
  },
  {
    value: '2',
    label: '化学品'
  },
  {
    value: '3',
    label: '工具'
  },
  {
    value: '4',
    label: '木箱'
  },
  {
    value: '5',
    label: '白玻'
  },
]
import {reactive} from "vue";
import {useRouter} from 'vue-router'
import {Search} from "@element-plus/icons-vue";
import dayjs from "dayjs";
import {VXETable} from "vxe-table";
let router = useRouter()

import dayjs from 'dayjs'

const now = new Date()

const tableData = ref([
  {
    date: '2016-05-01',
    name: 'Tom',
    state: 'California',
    city: 'Los Angeles',
    address: 'No. 189, Grove St, Los Angeles',
    zip: 'CA 90036',
    number: '999',
    width: '3660',
    height: '2440',
    rIndex: 1,
  }
])

const autoAddRow = () => {
  for (let i = 0; i < 10; i++) {
    const randomKCInt = Math.floor(Math.random() * 9999) + 10000;
    const randomInt = Math.floor(Math.random() * 999) + 1000;
    const randomZZInt = Math.floor(Math.random() * 99) + 100;
    const randomSumInt = Math.floor(Math.random() * 99) + 10;
    const kcThick = i % 3 === 0 ? 5 : i % 4 === 0 ? 6 : i % 5 === 0 ? 8 : 10;
    now.setDate(now.getDate() + 1)
    tableData.value.push({
      date: dayjs(now).format('YYYY-MM-DD'),
      name: '物料组织' + randomZZInt,
      state: '物料' + randomSumInt,
      city: '产地' + (randomSumInt * 6),
      address: 'No. 189, Grove St, Los Angeles',
      zip: 'CA 90036',
      number: 666 + 66 * i,
      width: '3660',
      height: '2440',
      rIndex: tableData.value.length + 1,
      wlNumber: 'NGWL1000' + randomInt,
      kcNumber: 'NGKC100' + randomKCInt,
      thick: kcThick
    })
const list =  (i) => {
  return {
    'kczz':'人工库',
    'wlbm':'NGWL202312000'+i,
    'wlmc':'这是物料名称',
    'cd':'地球村',
    'kcbh':'KC202300'+i,
    'w':'0',
    'g':'0',
    'h':'0',
    'zdw':'件',
    'aqkc':'0',
    'kcs':'20',
    'kykc':'30',
    'wlsl':'20',
    'zmj':'0',
    'dpmj':'0',
    'scrq':'2023-12-20',
    'bzq':'2025-12-20',
    'kq':'2000',
    'kw':'23',
    'jykc':'5',
    'bz':'这是备注*10086'
  }
}

//组件接收参数
const gridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 50},//鼠标移动或选择高亮
  id: 'CustomerList',
  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: [
    /* {title: '操作', width: '8%', slots: {default: 'button_slot'}, fixed: "left"},*/
    {type: 'seq', fixed: "left", title: ' ', width: 50},
    /*{ type: 'checkbox',fixed:"left", title: '', width: 50 },*/
    {type: 'expand', title:'详情', fixed: "left", slots: {content: 'content'}, width: 50},
    {field: 'kczz', width: '13%', title: '库存组织', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlbm', width: '10%', title: '物料编码', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlmc', width: '10%',title: '物料名称', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'cd', width: '10%',title: '产地', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'kcbh', width: '10%', title: '库存编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'w', width: '8%',title: '宽度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'g', width: '8%',title: '高度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'h', width: '8%',title: '厚度', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'zdw', width: '8%',title: '主单位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'aqkc', width: '8%',title: '安全库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'kcs', width: '12%',title: '库存数', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'kykc', width: '8%',title: '可用库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'wlsl', width: '12%',title: '未领数量', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'zmj', width: '8%',title: '总面积', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'dpmj', width: '12%',title: '单片面积', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'scrq', width: '8%',title: '生产日期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'bzq', width: '8%',title: '保质期', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    /*{field: 'kcbh', width: '10%',title: '库存编号', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},*/
    {field: 'kq', width: '10%',title: '库区', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'kw', width: '10%',title: '库位', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'jykc', width: '10%',title: '积压库存', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true},
    {field: 'bz', width: '10%',title: '备注', filters: [{data: ''}], slots: {filter: 'num1_filter'}, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [{type:'text'},{
      'name': '入库记录',
      'code': 'StorageRecord',
    }],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true,
    style: 'paddling-left:10px'
  },//表头按钮
  data: [
    list(0),list(1),list(2),list(3),list(4),list(5),list(6),list(7),list(8),list(9),

  ],//table body实际数据
  mergeFooterItems: [
    {row: 0, col: 0, rowspan: 1, colspan: 2}
  ],//合并脚
  footerMethod({columns, data}) {//页脚函数
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        /* if (props.tableProp.footList.includes(column.field)) {
           return sumNum(data, column.field)
         }*/
        return ''
      })
    ]
  },
})

const getTableRow = (row, type) => {
  switch (type) {
    case 'edit' : {
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}})
      break
    }
    case 'delete': {



      alert('我接收到子组件传送的删除信息'+row.id)
      break
    }
  }
}

const xGrid = ref()
const gridEvents = {
  toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'ProductStockList': {//新增
          router.push({path: '/main/productStock/ProductStockList'})
          break
        }
        case 'StorageRecord': {//入库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'alert', content: '您点击了查看入库记录', status: 'success'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认入库？');
            //openAlert({type:'alert', content: '成功入库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
        case 'Return': {//退库
          if ($grid.getCheckboxRecords().length === 0) {
            openAlert({type: 'message', content: '请选择至少一条数据', status: 'warning'})
            //VXETable.modal.message( '请选择一条数据！')
            return
          } else {
            /*            async ()=>{
              const type = await.VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？');
            }*/
            const type = VXETable.modal.confirm('您选择了' + $grid.getCheckboxRecords().length + '条数据！,是否确认退库？');


            /* if(VXETable.modal.confirm('您选择了'+$grid.getCheckboxRecords().length+'条数据！,是否确认退库？' )){
              //openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success',lockView: false, mask: false })


            }*/

            /* if(type==='confirm'){
              openAlert({type:'message', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            }

*/
            //openAlert({type:'alert', content: '成功退库'+$grid.getCheckboxRecords().length+'条数据！', status: 'success' })
            //VXETable.modal.message( '请选择一条数据！')
            return
          }
          break
        }
      }
    }
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  },
}

const openAlert = (options) => {
  if(options.type==='message'){
    VXETable.modal.message(options)
  }else{
    VXETable.modal.alert(options)
  }
}


</script>



 north-glass-erp/northglass-erp/src/views/pp/BOM/OrderBOMDetails.vue

@@ -74,9 +74,9 @@
    {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
    { type: 'seq',fixed:"left", title: '自序', width: 50 },
    {title: '操作', width: 60, slots: { default: 'button_slot' },fixed:"left"},
    { type: 'checkbox',fixed:"left", title: '基准BOM', width: 110 },
    { type: 'checkbox',fixed:"left", title: '标准BOM', width:110 },
    { type: 'checkbox',fixed:"left", title: '审核', width: 80 },
    { slots: { default: 'state' }, title: '基准BOM', width: 110 },
    { slots: { default: 'state' }, title: '标准BOM', width: 110 },
    { slots: { default: 'state' }, title: '审核', width: 80 },
    {field: 'customerNumber', width: 120, title: '客户编号',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true, },
    {field: 'customerName',width: 120, title: '客户名称', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
    {field: 'productNumber', width: 130,title: '产品编号', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
@@ -238,6 +238,10 @@
        </ul>
      </template>

      <template #state="{ row}">
        <el-checkbox checked/>
      </template>

      <!--左边固定显示的插槽-->
      <template #button_slot="{ row }">
        <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>

 north-glass-erp/northglass-erp/src/views/pp/BOM/SelectBOM.vue

@@ -73,9 +73,9 @@
    {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
    { type: 'seq',fixed:"left", title: '自序', width: 50 },
    {title: '操作', width: 80, slots: { default: 'button_slot' },fixed:"left"},
    { type: 'checkbox',fixed:"left", title: '基准BOM', width: 110 },
    { type: 'checkbox',fixed:"left", title: '标准BOM', width: 110 },
    { type: 'checkbox',fixed:"left", title: '审核', width: 80 },
    { slots: { default: 'state' }, title: '基准BOM', width: 110 },
    { slots: { default: 'state' }, title: '标准BOM', width: 110 },
    { slots: { default: 'state' }, title: '审核', width: 80 },
    {field: 'customerNumber', width: 120, title: '客户编号',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true, },
    {field: 'customerName',width: 120, title: '客户名称', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
    {field: 'productNumber', width: 130,title: '产品编号', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
@@ -207,6 +207,10 @@
        </ul>
      </template>

      <template #state="{ row}">
        <el-checkbox checked/>
      </template>

      <!--左边固定显示的插槽-->
      <template #button_slot="{ row }">
        <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>

 north-glass-erp/northglass-erp/src/views/pp/BOM/StandardBOM.vue

@@ -73,9 +73,9 @@
    {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
    { type: 'seq',fixed:"left", title: '自序', width: 50 },
    {title: '操作', width: 80, slots: { default: 'button_slot' },fixed:"left"},
    { type: 'checkbox',fixed:"left", title: '基准BOM', width: 110 },
    { type: 'checkbox',fixed:"left", title: '标准BOM', width: 110 },
    { type: 'checkbox',fixed:"left", title: '审核', width: 80 },
    { slots: { default: 'state' }, title: '基准BOM', width: 110 },
    { slots: { default: 'state' }, title: '标准BOM', width: 110 },
    { slots: { default: 'state' }, title: '审核', width: 80 },
    {field: 'customerNumber', width: 120, title: '客户编号',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true, },
    {field: 'customerName',width: 120, title: '客户名称', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
    {field: 'productNumber', width: 130,title: '产品编号', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
@@ -207,6 +207,10 @@
        </ul>
      </template>

      <template #state="{ row}">
        <el-checkbox checked/>
      </template>

      <!--左边固定显示的插槽-->
      <template #button_slot="{ row }">
        <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button>

 north-glass-erp/northglass-erp/src/views/pp/Replenish/SelectReplenish.vue

@@ -270,14 +270,17 @@

<template>
  <div class="main-div-customer">
    <div id="head" style="width: 900px;">
    <div id="head" >
      <el-row :gutter="0">
      <el-date-picker
          v-model="value"
          type="daterange"
          start-placeholder="报工开始时间"
          end-placeholder="结束时间"
      />
      &nbsp;
      <el-button type="primary">查询</el-button>
      </el-row>
    </div>
    <vxe-grid
        max-height="100%"
@@ -321,4 +324,7 @@
  width: 99%;
  height: 100%;
}
#head{
  width:40%;
}
</style>

 north-glass-erp/northglass-erp/src/views/pp/report/DamageReport.vue

@@ -208,7 +208,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/EquipmentOutput.vue

@@ -183,7 +183,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/OrderBOMOutside.vue

@@ -204,7 +204,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/OrderPlanDecomposition.vue

@@ -209,7 +209,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/ProcessToBeCompleted.vue

@@ -160,7 +160,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/QualityReport.vue

@@ -203,7 +203,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/RawMaterialRequisition.vue

@@ -198,7 +198,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/TaskCompletionStatus.vue

@@ -213,7 +213,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/TeamOutput.vue

@@ -218,7 +218,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/WorkInProgress.vue

@@ -208,7 +208,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/report/Yield.vue

@@ -184,7 +184,7 @@
      <el-row :gutter="0">
        <!--        <el-input placeholder="销售单号" v-model="form.name" style="width: 150px"/>-->
        <!--        <el-input placeholder="项目名称" v-model="form.name" style="width: 150px"/>-->
        &nbsp;&nbsp;

        <el-date-picker
            v-model="form.date1"
            type="daterange"

 north-glass-erp/northglass-erp/src/views/pp/rework/SelectRework.vue

@@ -185,13 +185,16 @@
<template>
  <div class="main-div-customer">
    <div id="head" >
      <el-row :gutter="0">
      <el-date-picker
          v-model="value"
          type="daterange"
          start-placeholder="开始时间"
          end-placeholder="结束时间"
      />
        &nbsp;
      <el-button type="primary">查询</el-button>
      </el-row>
    </div>
    <vxe-grid
        max-height="100%"
@@ -257,4 +260,8 @@
  width: 99%;
  height: 100%;
}
#head{
  width:40%;

}
</style>