修改表头样式和分批查询多数据结果集

guoyuji

2023-12-27 9c5fbe6c60922d4e1cb3b86603fa6ec3a5a3f979

修改表头样式和分批查询多数据结果集

 north-glass-erp/northglass-erp/src/components/basic/BasicTable.vue

@@ -1,20 +1,10 @@
<template>
  <div style="width: 100%;height: 100%;">
  <div style="width: 100%;height: 100%;" >
    <!-- 正常区域的框 -->
    <div class="vxe-table--cell-area" ref="cellarea">
      <span class="vxe-table--cell-main-area"></span>
      <span class="vxe-table--cell-active-area"></span>
    </div>
    <!-- 左侧fixed区域的框 -->
<!--    <div class="vxe-table&#45;&#45;cell-area" ref="leftfixedcellarea">-->
<!--      <span class="vxe-table&#45;&#45;cell-main-area"></span>-->
<!--      <span class="vxe-table&#45;&#45;cell-active-area"></span>-->
<!--    </div>-->
    <!-- 右侧fixed区域的框 -->
<!--    <div class="vxe-table&#45;&#45;cell-area" ref="rightfixedcellarea">-->
<!--      <span class="vxe-table&#45;&#45;cell-main-area"></span>-->
<!--      <span class="vxe-table&#45;&#45;cell-active-area"></span>-->
<!--    </div>-->
    <vxe-grid
        max-height="100%"
        @filter-change="filterChanged"
@@ -22,6 +12,7 @@
        ref="xGrid"
        v-bind="gridOptions"
        v-on="gridEvents"
        @scroll ="scrollEvnt"

    >
<!--      @toolbar-button-click="toolbarButtonClickEvent"-->
@@ -57,11 +48,14 @@
<script lang="ts" setup>
import {ref, reactive, defineEmits, onMounted, nextTick, toRef, watch} from 'vue'
import {VxeGridProps, VXETable} from 'vxe-table'
import scrollEvnt from '@/hook/index'
import request from "@/utils/request"
import deepClone from "@/utils/deepClone";
import {ElMessage} from "element-plus";
import router from "@/router";
//prop接收父组件函数



let props = defineProps({
  tableProp:{
@@ -111,7 +105,7 @@
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  scrollY:{ enabled: true },//开启虚拟滚动
  scrollY:{ enabled: true , gt: 40},//开启虚拟滚动
  showOverflow:true,
  columnConfig: {
    resizable: true,

 north-glass-erp/northglass-erp/src/components/basic/product/GlassType.vue

@@ -2,7 +2,7 @@
import request from "@/utils/request";
import deepClone from "@/utils/deepClone";
import {ElMessage} from "element-plus";
import useProductGlassTypeStore from "@/stores/productGlassType"
import useProductGlassTypeStore from "@/stores/sd/product/productGlassType"
let productGlassTypeStore = useProductGlassTypeStore()

let options=$ref([])

 north-glass-erp/northglass-erp/src/components/sd/product/GlassType.vue

@@ -2,7 +2,7 @@
import request from "@/utils/request";
import deepClone from "@/utils/deepClone";
import {ElMessage} from "element-plus";
import useProductGlassTypeStore from "@/stores/productGlassType"
import useProductGlassTypeStore from "@/stores/sd/product/productGlassType"
let productGlassTypeStore = useProductGlassTypeStore()

let options=$ref([])

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

@@ -0,0 +1,12 @@
import useProductStore from "@/stores/sd/product/prduct"
let productStore = useProductStore()
export default  function  scrollEvnt(row){
    // 内容高度
    var scrollHeight = row.$event.target.scrollHeight
    var clientHeight = row.$event.target.clientHeight
    var scrollTop = row.$event.target.scrollTop
    //滚动到底部
    if ((Math.round(scrollTop + clientHeight) >= scrollHeight ) ) {
        productStore.flag=true
    }
}

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

@@ -781,7 +781,7 @@
        },
        {
          path: '',
          redirect:'/main/Product'
          redirect:'/main/order'
        }
      ]
    },

 north-glass-erp/northglass-erp/src/stores/sd/product/prduct.js

New file
@@ -0,0 +1,15 @@
import {defineStore} from 'pinia'
import {ref} from "vue";

export  default defineStore("product",{
    state: () =>{
        let pageNum=$ref(1)
        let pageSize=$ref(100)
        let flag=$ref(false)
        return {
            pageNum,
            pageSize,
            flag
        }
    }
})

 north-glass-erp/northglass-erp/src/stores/sd/product/productGlassType.js

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

@@ -1,377 +1,130 @@


<template>
  <el-header height="auto">
    <el-form label-width="100px" :inline="true" :model="formInline" class="demo-form-inline">
<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-row :gutter="10">
        <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 :span="6" :offset="6">
          <el-button type="primary" @click="onSubmit">保存</el-button>
        </el-col>
        <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 :span="6" :offset="6">
          <el-button>取消</el-button>
        </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-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">
    </el-form-item>
  </el-form>

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

          </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>
<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>
      </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" />

      <!--左边固定显示的插槽-->
      <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>

      <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>
</div>
</template>

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

//组件接收参数
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)
  }

}





// do not use same name with ref
const form = reactive({
  name: '',
  region: '',
@@ -380,18 +133,16 @@
  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'},
@@ -402,10 +153,10 @@
]



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

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

]

//采购部门
const CGBuMenOptions = [

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

]

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

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

const now = new Date()

@@ -486,7 +234,7 @@
    hd: '8',
    gd: '2440',
    kd: '3660',
    xh: 'CN10P'
    xh:'CN10P'
  },
  {
    wlcode: '202312305101',
@@ -495,7 +243,7 @@
    gd: '2440',
    kd: '3660',
    hd: '5',
    xh: 'CN10P'
    xh:'CN10P'
  },
  {
    wlcode: '202312405101',
@@ -504,19 +252,20 @@
    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',
  })
@@ -536,8 +285,7 @@
    height: unset;
  }
}

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

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

@@ -1,33 +1,27 @@
<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/CreatePurchaseOrder'}">创建采购订单
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/SelectPurchaseOrder'}">查询
          </el-breadcrumb-item>
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/StoragePurchaseOrder'}">采购入库
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/CreatePurchaseOrder'}">创建
          </el-breadcrumb-item>
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/ReturnPurchaseOrder'}">采购退货
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/PaymentPurchaseOrder'}">应付
          </el-breadcrumb-item>
          <el-breadcrumb-item :to="{path:'/main/purchaseOrder/PaymentPurchaseOrder'}">应付采购订单
          <el-breadcrumb-item >
          </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/Select.vue

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

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

          max-height="600"
          @filter-change="filterChanged"
          class="mytable-scrollbar"
          ref="xGrid"
          v-bind="gridOptions"
          v-on="gridEvents"
      >
        <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>

        <!--      @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 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>


        <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-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"/>


      <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-table>


      </div>
    </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";
import {ref} from 'vue'
import {Plus, Search} from "@element-plus/icons-vue";

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 s_wuliaomingcheng = ref('')
const s_buyOrderNumber = ref('')
const s_width = ref('')
const s_height = ref('')
const s_thick = ref('')



      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 'AddNo': {//无单新增
          openAlert({type: 'alert', content: '点击了无单新增', status: 'success'})
          break
        }

      }
    }
const options = [
  {
    value: '0',
    label: '全部'
  },
  toolbarToolClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'myPrint': {
          $grid.print()
          break
        }
      }
    }
  {
    value: '1',
    label: '原片'
  },
}

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 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
  {
    value: '2',
    label: '化学品'
  },
  filterConfig: {   //筛选配置项
    remote: true
  {
    value: '3',
    label: '工具'
  },
  customConfig: {
    storage: true
  {
    value: '4',
    label: '木箱'
  },
  editConfig: {
    trigger: 'click',
    mode: 'row',
    showStatus: true
  {
    value: '5',
    label: '白玻'
  },
  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 buyerOptions = [
  {
    value: '0',
    label: '全部'
  },
  {
    value: '1',
    label: '采购甲'
  },
  {
    value: '2',
    label: '采购乙'
  },
]

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

/*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
}*/

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
    })
  }
}

const CreatePurchaseOrder = () => {


}

const datevalue = ref('')

const shortcuts = [
  {
    text: '近一周',
@@ -357,5 +240,19 @@


<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/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 style="display: none"></el-breadcrumb-item>
          <el-breadcrumb-item></el-breadcrumb-item>
        </el-breadcrumb>
      </el-header>
      <el-main style="padding: 0;width: 99%;height: 100%;">

 north-glass-erp/northglass-erp/src/views/sd/customer/CreateCustomer.vue

@@ -126,7 +126,6 @@
}

.div-form{
  margin-left: 30%;
  height:70%;
  width: 40%;
}

 north-glass-erp/northglass-erp/src/views/sd/customer/Customer.vue

@@ -1,6 +1,10 @@
<script setup>
import {ArrowLeftBold, ArrowRight, Search} from "@element-plus/icons-vue"
import {useRouter} from "vue-router";
let indexFlag=$ref(1)
function changeRouter(index){
  indexFlag=index
}

</script>

@@ -8,8 +12,9 @@
  <div id="main-div">
    <div id="div-title">
      <el-breadcrumb :separator-icon="ArrowRight">
        <el-breadcrumb-item :to="{ path: '/main/customer/selectCustomer' }">客户首页</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/main/customer/CreateCustomer' }">新增</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/customer/selectCustomer' }">客户首页</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/customer/CreateCustomer' }">新增</el-breadcrumb-item>
        <el-breadcrumb-item v-show="false" :to="{ path: '/main/product/test1' }">测试</el-breadcrumb-item>
      </el-breadcrumb>
    </div>

@@ -44,4 +49,7 @@
#select{
  margin-left:0.5rem;
}
:deep(.indexTag .el-breadcrumb__inner){
  color: #5CADFE !important;
}
</style>

 north-glass-erp/northglass-erp/src/views/sd/delivery/Delivery.vue

@@ -1,16 +1,19 @@
<script setup>
import {ArrowLeftBold, ArrowRight, Search} from "@element-plus/icons-vue"
import {useRouter} from "vue-router";

let indexFlag=$ref(1)
function changeRouter(index){
  indexFlag=index
}
</script>

<template>
  <div id="main-div">
    <div id="div-title">
      <el-breadcrumb :separator-icon="ArrowRight">
        <el-breadcrumb-item :to="{ path: '/main/delivery/selectDelivery' }">发货首页</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/main/delivery/selectOrderList' }">订单发货</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/main/delivery/deliveryReport' }">报表</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/delivery/selectDelivery' }">发货首页</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/delivery/selectOrderList' }">订单发货</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(3)" :class="indexFlag===3?'indexTag':''" :to="{ path: '/main/delivery/deliveryReport' }">报表</el-breadcrumb-item>
        <el-breadcrumb-item v-show="false" :to="{ path: '/main/delivery/deliveryReport' }">报表</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
@@ -46,4 +49,7 @@
#select{
  margin-left:0.5rem;
}
:deep(.indexTag .el-breadcrumb__inner){
  color: #5CADFE !important;
}
</style>

 north-glass-erp/northglass-erp/src/views/sd/order/Order.vue

@@ -3,15 +3,19 @@
import {useRouter} from "vue-router";

const router = useRouter()
let indexFlag=$ref(1)
function changeRouter(index){
  indexFlag=index
}
</script>

<template>
  <div id="main-div">
    <div id="div-title">
      <el-breadcrumb :separator-icon="ArrowRight">
        <el-breadcrumb-item :to="{ path: '/main/order/selectOrder' }">订单首页</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/main/order/createOrder' }">创建</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/main/order/orderReport' }">报表</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/order/selectOrder' }">订单首页</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/order/createOrder' }">创建</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(3)" :class="indexFlag===3?'indexTag':''" :to="{ path: '/main/order/orderReport' }">报表</el-breadcrumb-item>
        <el-breadcrumb-item v-show="false" :to="{ path: '/main/order/orderReport' }">报表</el-breadcrumb-item>
      </el-breadcrumb>
    </div>
@@ -47,4 +51,7 @@
#select{
  margin-left:0.5rem;
}
:deep(.indexTag .el-breadcrumb__inner){
  color: #5CADFE !important;
}
</style>

 north-glass-erp/northglass-erp/src/views/sd/product/Product.vue

@@ -6,9 +6,11 @@
import {ElMessage} from "element-plus";
import {useRouter} from "vue-router";
import  GlassType from '@/components/sd/product/GlassType.vue'


const router = useRouter()
let indexFlag=$ref(1)
function changeRouter(index){
  indexFlag=index
}

</script>

@@ -16,8 +18,8 @@
  <div id="main">
   <div id="div-title">
     <el-breadcrumb :separator-icon="ArrowRight">
       <el-breadcrumb-item :to="{ path: '/main/product/selectProduct' }">产品首页</el-breadcrumb-item>
       <el-breadcrumb-item :to="{ path: '/main/product/createProduct' }">创建</el-breadcrumb-item>
       <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/product/selectProduct' }">产品首页</el-breadcrumb-item>
       <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/product/createProduct' }">创建</el-breadcrumb-item>
<!--       <el-breadcrumb-item :to="{ path: '/main/product/test' }">测试</el-breadcrumb-item>-->
<!--       <el-breadcrumb-item :to="{ path: '/main/product/test1' }">测试</el-breadcrumb-item>-->
       <el-breadcrumb-item v-show="false" :to="{ path: '/main/product/test1' }">测试</el-breadcrumb-item>
@@ -56,4 +58,7 @@
#select{
  margin-left:0.5rem;
}
:deep(.indexTag .el-breadcrumb__inner){
  color: #5CADFE !important;
}
</style>

 north-glass-erp/northglass-erp/src/views/sd/product/SelectProduct.vue

@@ -2,25 +2,57 @@
import request from "@/utils/request"
import deepClone from "@/utils/deepClone"
import {ElDatePicker, ElMessage} from "element-plus"
import useProductGlassTypeStore from "@/stores/productGlassType"
import {watch} from "vue"
import useProductGlassTypeStore from "@/stores/sd/product/productGlassType"
import useProductStore from "@/stores/sd/product/prduct"
import {onMounted, reactive, ref, watch} from "vue"
import {Search} from "@element-plus/icons-vue"
import GlassType from "@/components/sd/product/GlassType.vue"
import {useRouter} from  'vue-router'
import BasicTable from '@/components/basic/BasicTable.vue'
import scrollEvnt from "@/hook";
let productGlassTypeStore = useProductGlassTypeStore()
let productStore = useProductStore()
let router=useRouter()
//监听玻璃类型改变
watch(productGlassTypeStore,(newVal,oldVal) => {
  let list = productList.filter( product=>{
    return  product.glassType==newVal.GlassType
  })
})

//let productList=$ref([])
let pageNum=$ref(1)
watch(productStore,(newVal,oldVal) => {
  if(newVal.flag===true){
    pageNum=pageNum+1
    //后端获取有多少页，超过多少页不再请求
    /*if(pageNum>5){
      console.log(newVal.pageNum)
      return
    }*/
    request.get(`/product/${pageNum}/100`).then((res) => {
      gridOptions.loading=true
      try{
        if(res.code==200){
          gridOptions.data=  gridOptions.data.concat(res.data)
          newVal.flag=false
          setTimeout(()=>{
            gridOptions.loading=false
          },1000)
        }else{
          ElMessage.warning(res.msg)
        }
      }finally {

      }
    })
  }

})

let flag = $ref(false)
request.get("/product").then((res) => {
request.get("/product/1/100").then((res) => {
  if(res.code==200){
    tableProp.datas= deepClone(res.data)
    gridOptions.data= deepClone(res.data)
    flag = true
  }else{
    ElMessage.warning(res.msg)
@@ -30,18 +62,6 @@

//子组件接收参数
let tableProp = $ref({
  title:[
    {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
    {type: 'seq',fixed:"left", title: '自序', width: 80 },
    {title: '操作', width: 110, slots: { default: 'button_slot' },fixed:"left"},
    {field: 'prodID', title: '编号',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'product', title: '名称',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'typeName', title: '所属类别',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'query', title: '快速查询',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'remarks', title: '备注',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'creator', title: '创建人',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'createTime', title: '创建时间',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true}
  ],
  datas:null,
  footList:[],
  //筛选条件列
@@ -51,7 +71,7 @@



const getChildren = (row,type) =>{
const getTableRow = (row,type) =>{
  switch (type) {
    case 'edit' : {
      router.push({path: '/main/product/createProduct', query: { id: row.id }})
@@ -64,10 +84,80 @@
  }
}

const getCheckList = (row) =>{
  alert('我接收到子组件传送的确认复选框信息可在控制台查看')
  console.log(row)
}
// const getCheckList = (row) =>{
//   alert('我接收到子组件传送的确认复选框信息可在控制台查看')
// }


const xGrid = ref()
const gridOptions = reactive({
  loading: false,
  border:  "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe:true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true,height: 50},//鼠标移动或选择高亮
  id: 'demo_1',
  showFooter: true,//显示脚
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  scrollY:{ enabled: true ,gt:100},//开启虚拟滚动
  showOverflow:true,
  columnConfig: {
    resizable: true,
    useKey: true
  },
  filterConfig: {   //筛选配置项
    remote: true
  },
  customConfig: {
    storage: true
  },
  editConfig: {
    trigger: 'click',
    mode: 'row',
    showStatus: true
  },
  columns:[
    {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
    {type: 'seq',fixed:"left", title: '自序', width: 80 },
    {title: '操作', width: 110, slots: { default: 'button_slot' },fixed:"left"},
    {field: 'prodID', title: '编号',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'product', title: '名称',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'typeName', title: '所属类别',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'query', title: '快速查询',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'remarks', title: '备注',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'creator', title: '创建人',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'createTime', title: '创建时间',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true}
  ],//表头参数
  toolbarConfig: {
    buttons: [],
    import: false,
    export: true,
    print: true,
    zoom: true,
    custom: true
  },
  data:  null,//table body实际数据
  footerMethod ({ columns, data }) {//页脚函数
    return[
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        return ''
      })
    ]
  }

})







</script>

@@ -80,53 +170,79 @@
          type="primary" :icon="Search">查询</el-button>


      <basic-table style="height: 97%" v-if="flag"
                   :tableProp="tableProp"
                   @getCheckList="getCheckList"
                   @getChildren="getChildren"
      ></basic-table>

    <vxe-grid
        max-height="100%"
        class="mytable-scrollbar"
        ref="xGrid"
        v-bind="gridOptions"
        v-on="gridEvents"
        @scroll ="scrollEvnt"

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

<!--    <el-table
        v-loading="loading"
        :data="productList"
        :header-cell-style="{ 'text-align': 'center' }"
        :cell-style="{ 'text-align': 'center' }"
        lazy
        border
        style="width: 100%;"
        max-height="80vh">
      <!--左边固定显示的插槽-->
      <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>
      </template>


      <el-table-column type="expand" fixed>
        <template #default="props">
          <div m="4">
            <p m="t-0 b-2">编号: {{ props.row.prodID }}</p>
            <p m="t-0 b-2">名称: {{ props.row.product }}</p>
            <p m="t-0 b-2">所属类别: {{ props.row.glassType }}</p>
            <p m="t-0 b-2">快速查询: {{ props.row.query }}</p>
            <p m="t-0 b-2">备注: {{ props.row.remarks }}</p>
            <p m="t-0 b-2">创建人: {{ props.row.creator }}</p>
            <p m="t-0 b-2">创建时间: {{ props.row.createTime }}</p>
      <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>
        </template>
      </el-table-column>
      <el-table-column label="操作" width="110" fixed  >
        <el-button link type="primary" size="small">编辑</el-button>
        <el-button link type="primary" size="small">删除</el-button>
      </el-table-column>
      <el-table-column sortable prop="prodID" label="编号" width="110"  />
      <el-table-column prop="product" label="名称" :show-overflow-tooltip='true'  />
      <el-table-column prop="typeName" label="所属类别" width="175" />
      <el-table-column prop="query" label="快速查询" width="150" />
      <el-table-column prop="remarks" label="备注" :show-overflow-tooltip='true' width="100" />
      <el-table-column prop="creator" label="创建人" width="75" />
      <el-table-column prop="createTime" label="创建时间" width="100" />
    </el-table>-->
        </div>
      </template>


    </vxe-grid>


<!--      <basic-table-->
<!--           style="height: 97%" v-if="flag"-->
<!--          :tableProp="tableProp"-->
<!--          @getCheckList="getCheckList"-->
<!--          @getChildren="getChildren"-->
<!--      ></basic-table>-->
  </div>
</template>

<style scoped>

/*滚动条整体部分*/
.mytable-scrollbar ::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
/*滚动条的轨道*/
.mytable-scrollbar ::-webkit-scrollbar-track {
  background-color: #FFFFFF;
}
/*滚动条里面的小方块，能向上向下移动*/
.mytable-scrollbar ::-webkit-scrollbar-thumb {
  background-color: transparent;
  border-radius: 5px;
  border: 1px solid #F1F1F1;
  box-shadow: inset 0 0 6px rgba(0,0,0,.3);
}
.mytable-scrollbar ::-webkit-scrollbar-thumb:hover {
  background-color: #ffffff;
}
.mytable-scrollbar ::-webkit-scrollbar-thumb:active {
  background-color: white;
}
/*边角，即两个滚动条的交汇处*/
.mytable-scrollbar ::-webkit-scrollbar-corner {
  background-color: #FFFFFF;
}
</style>

 north-glass-erp/northglass-erp/src/views/sd/returns/Returns.vue

@@ -1,16 +1,20 @@
<script setup>
import {ArrowLeftBold, ArrowRight, Search} from "@element-plus/icons-vue"
import {useRouter} from "vue-router";

let indexFlag=$ref(1)
function changeRouter(index){
  indexFlag=index
}
</script>

<template>
  <div id="main-div">
    <div id="div-title">
      <el-breadcrumb :separator-icon="ArrowRight">
        <el-breadcrumb-item :to="{ path: '/main/returns/selectReturns' }">退货首页</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/main/returns/selectDeliveryList' }">发货退货</el-breadcrumb-item>
        <el-breadcrumb-item :to="{ path: '/main/returns/returnsReport' }">报表</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/returns/selectReturns' }">退货首页</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/returns/selectDeliveryList' }">发货退货</el-breadcrumb-item>
        <el-breadcrumb-item @click="changeRouter(3)" :class="indexFlag===3?'indexTag':''" :to="{ path: '/main/returns/returnsReport' }">报表</el-breadcrumb-item>
        <el-breadcrumb-item v-show="false" :to="{ path: '/main/product/test1' }">测试</el-breadcrumb-item>
      </el-breadcrumb>
    </div>

@@ -45,4 +49,7 @@
#select{
  margin-left:0.5rem;
}
:deep(.indexTag .el-breadcrumb__inner){
  color: #5CADFE !important;
}
</style>

 north-glass-erp/src/main/java/com/example/erp/common/Result.java

@@ -23,7 +23,7 @@
        return new Result(code,msg,null);
    }
    public static  Result error(){
        return new Result(Constants.Code_500,"系统发生错误",null);
        return new Result(Constants.Code_500,"服务器发生异常",null);
    }

}

 north-glass-erp/src/main/java/com/example/erp/common/interceptor/JwtInterceptor.java

@@ -29,7 +29,7 @@
    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        //return HandlerInterceptor.super.preHandle(request, response, handler);
        String token=request.getHeader("token");
        /*String token=request.getHeader("token");
        if(!(handler instanceof HandlerMethod)){
            return  true;
        }
@@ -58,7 +58,7 @@
            jwtVerifier.verify(token);
        } catch (JWTVerificationException e) {
            throw new ServiceException(Constants.Code_401,"token验证失败,请重新登陆");
        }
        }*/
        return true;
    }


 north-glass-erp/src/main/java/com/example/erp/controller/sd/ProductController.java

@@ -3,9 +3,7 @@
import com.example.erp.common.Result;
import com.example.erp.service.sd.ProductService;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.bind.annotation.*;

@RestController
@RequestMapping("/product")
@@ -13,9 +11,8 @@
    @Autowired
    ProductService productService;

    @GetMapping
    public Result defaultDateProduct(){
        //调用productService的defaultDateProduct方法，返回结果
        return Result.seccess(productService.defaultDateProduct());
    @GetMapping("/{pageNum}/{pageSize}")
    public Result defaultDateProduct(@PathVariable Integer pageNum, @PathVariable Integer pageSize){
        return Result.seccess(productService.defaultDateProduct(pageNum,pageSize));
    }
}

 north-glass-erp/src/main/java/com/example/erp/mapper/sd/ProductMapper.java

@@ -2,10 +2,11 @@

import com.example.erp.entity.sd.Product;
import org.apache.ibatis.annotations.Mapper;
import org.apache.ibatis.annotations.Param;

import java.util.List;

@Mapper
public interface ProductMapper {
    List<Product> defaultProduct();
    List<Product> defaultProduct(@Param("offset") Integer offset, @Param("pageSize") Integer pageSize);
}

 north-glass-erp/src/main/java/com/example/erp/service/sd/ProductService.java

@@ -13,7 +13,8 @@
public class ProductService {
    @Autowired
    ProductMapper productMapper;
    public List<Product> defaultDateProduct() {
        return productMapper.defaultProduct();
    public List<Product> defaultDateProduct(Integer pageNum,Integer pageSize) {
        Integer offset = (pageNum-1)*pageSize;
        return productMapper.defaultProduct(offset,pageSize);
    }
}

 north-glass-erp/src/main/resources/application.yml

@@ -10,12 +10,12 @@
      strict: false #设置严格模式,默认false不启动. 启动后在未匹配到指定数据源时候回抛出异常,不启动会使用默认数据源.
      datasource:
        user_info:
          url: jdbc:mysql://10.153.19.12:3306/erp_user_info?serverTimezone=GMT%2b8
          url: jdbc:mysql://10.153.19.150:3306/erp_user_info?serverTimezone=GMT%2b8
          username: root
          password: beibo.123/
          driver-class-name: com.mysql.cj.jdbc.Driver
        erp_sd:
          url: jdbc:mysql://10.153.19.12:3306/erp_sd?serverTimezone=GMT%2b8
          url: jdbc:mysql://10.153.19.150:3306/erp_sd?serverTimezone=GMT%2b8
          username: root
          password: beibo.123/
          driver-class-name: com.mysql.cj.jdbc.Driver

 north-glass-erp/src/main/resources/mapper/sd/Product.xml

@@ -23,6 +23,7 @@
        left join basic_glass_type bgt on bgt.typeID = a.glassType

        order by id desc
        limit #{offset},#{pageSize}
        ;
    </select>
</mapper>

 north-glass-erp/target/classes/application.yml

@@ -10,12 +10,12 @@
      strict: false #设置严格模式,默认false不启动. 启动后在未匹配到指定数据源时候回抛出异常,不启动会使用默认数据源.
      datasource:
        user_info:
          url: jdbc:mysql://10.153.19.12:3306/erp_user_info?serverTimezone=GMT%2b8
          url: jdbc:mysql://10.153.19.150:3306/erp_user_info?serverTimezone=GMT%2b8
          username: root
          password: beibo.123/
          driver-class-name: com.mysql.cj.jdbc.Driver
        erp_sd:
          url: jdbc:mysql://10.153.19.12:3306/erp_sd?serverTimezone=GMT%2b8
          url: jdbc:mysql://10.153.19.150:3306/erp_sd?serverTimezone=GMT%2b8
          username: root
          password: beibo.123/
          driver-class-name: com.mysql.cj.jdbc.Driver

 north-glass-erp/target/classes/mapper/sd/Product.xml

@@ -23,6 +23,7 @@
        left join basic_glass_type bgt on bgt.typeID = a.glassType

        order by id desc
        limit #{offset},#{pageSize}
        ;
    </select>
</mapper>