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

chenlu

2024-03-29 6c17e1f3da486ffd16b7237d9bc35a9bcbef5348

 north-glass-erp/northglass-erp/src/views/mm/mainIngredientStock/SelectIngredientsStock.vue

@@ -1,8 +1,23 @@
<script setup>

import {reactive} from "vue";
import {reactive, ref} from "vue";
import {useRouter} from  'vue-router'
let router=useRouter()
import request from "@/utils/request";
import deepClone from "@/utils/deepClone";
import useUserInfoStore from "@/stores/userInfo";
import {ElMessage} from "element-plus";
import {Search} from "@element-plus/icons-vue";
import { useI18n } from 'vue-i18n'
import {toolbarButtonClickEvent} from "@/hook/mouseMove";
import {changeFilterEvent,filterChanged} from "@/hook"

//语言获取
const { t } = useI18n()

const router = useRouter()
let produceList = ref([])
let produceLists = ref([])
let dialogTableVisible = ref(false)
const getTableRow = (row,type) =>{
  switch (type) {
    case 'edit' :{
@@ -17,10 +32,173 @@
  }
}

const hasDecimal=(value)=>{
  const regex=/\./ // 定义正则表达式，查找小数点
  return regex.test(value) //返回true/false
}

const hasDecimalhtml=(item,row)=>{
  let aa=item.split('.').length
  if (aa===2){
    return row[item.split('.')[0]][item.split('.')[1]]
  }else if(aa===3){
    return row[item.split('.')[0]][item.split('.')[1]][item.split('.')[2]]
  }


}

let pageNum=ref(1)
let total = reactive({
  pageTotal : 0,
  dataTotal : 0,
  pageSize : 10
})

let filterData = ref({

})

let selectDate = ref(["",""])
let BasicData = ref([])
let materialStore= ref([])


let arr = [
  {type:'expand',fixed:"left",slots: { content:'content' },width: '60'},
  { type: 'checkbox',fixed:"left", title: '选择', width: '80' },
  { type: 'seq',fixed:"left", title: '自序', width: '80' },
  {field: 'inventoryOrganization', width:'150', title: '库存组织', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged },
  {field: 'materialCode', width: '150',title: '物料编码', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'producer', width: '100',title: '产地', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'id',width: '100', title: '库存编号', sortable: true,showOverflow:"ellipsis",filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  //{field: 'safetyStock', width: '100',title: '安全库存', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'inventoryQuantity',width: '100', title: '库存数量', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'availableQuantity', width: '100',title: '可用库存', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'totalArea',width: '100', title: '总面积', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'dateOfManufacture',width: '100', title: '生产日期', sortable: true},
  {field: 'qualityGuaranteePeriod',width: '100', title: '保质期', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'inventoryArea',width: '100', title: '库存区域', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  //{field: 'deadStock',width: '100', title: '积压库存', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
  {field: 'createTime',width: '100', title: '入库时间', sortable: true},
  {field: 'remarks',width: '80', title: '备注', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged},
]





request.get(`/BasicWarehouse/BasicWarehouseType/原片|辅料`).then((res) => {
  if(res.code==200){
    gridOptions.columns.splice(0,gridOptions.columns.length)
    BasicData.value = res.data
    //添加列
    gridOptions.columns=arr.slice()

    for (let i=0;i<BasicData.value.length;i++){
      let aa={field: "json."+BasicData.value[i].OperateType, width: '150',title: BasicData.value[i].OperateTypeName, sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged}
      gridOptions.columns.push(aa)

    }
    getInventoryWorks()

  }else{
    ElMessage.warning(res.msg)
  }
})



const getInventoryWorks = () => {
  request.post(`/MaterialInventory/getSelectMaterialInventoryDate/1/${total.pageSize}/${selectDate.value}`,filterData.value).then((res) => {

    if(res.code==200){
      console.log(res.data)
      materialStore.value=[]
      for (let i=0;i<res.data.data.length;i++){
        materialStore.value[i]=(res.data.data[i])
        materialStore.value[i].json=(JSON.parse(res.data.data[i].json))

      }

      total.dataTotal = res.data.total.total*1
      total.pageTotal= res.data.total.pageTotal
      pageNum.value=1
      selectDate.value = res.data.selectDate
      produceList = deepClone(materialStore.value)
      xGrid.value.loadData(produceList)
      gridOptions.loading=false
    }else{
      ElMessage.warning(res.msg)
      router.push("/login")
    }
  })
}

const getInventoryWorkPaging = () => {
  console.log(filterData.value)
  request.post(`/MaterialInventory/getSelectMaterialInventoryDate/${pageNum.value}/${total.pageSize}/${selectDate.value}`,filterData.value).then((res) => {

    if(res.code==200){
      console.log(res.data)
      materialStore.value=[]
      for (let i=0;i<res.data.data.length;i++){
        materialStore.value[i]=(res.data.data[i])
        materialStore.value[i].json=(JSON.parse(res.data.data[i].json))
      }
      if (res.data.total!=null){
        total.dataTotal = res.data.total.total*1
        total.pageTotal= res.data.total.pageTotal
      }
      produceList = deepClone(materialStore.value)
      selectDate.value = res.data.selectDate
      xGrid.value.loadData(produceList)
      gridOptions.loading=false
    }else{
      ElMessage.warning(res.msg)
      router.push("/login")
    }
  })
}



const selectOrderList = ()=>{
  request.get(`/BasicWarehouse/BasicWarehouseType/原片|辅料`).then((res) => {
    if(res.code==200){
      gridOptions.columns.splice(0,gridOptions.columns.length)
      BasicData.value = res.data
      //添加列
      gridOptions.columns=arr.slice()

      for (let i=0;i<BasicData.value.length;i++){
        let aa={field: "json."+BasicData.value[i].OperateType, width: '150',title: BasicData.value[i].OperateTypeName, sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged}
        gridOptions.columns.push(aa)

      }
      getInventoryWorkPaging()

    }else{
      ElMessage.warning(res.msg)
    }
  })
}

const changeDate =  ()=>{
  selectOrderList()
}

//页脚跳转
const handlePageChange = ({ currentPage, pageSize }) => {
  selectOrderList()
  total.pageTotal = pageSize
  pageNum.value=currentPage
}



//子组件接收参数

const xGrid = ref()
const gridOptions = reactive({
  border:  "full",//表格加边框
  keepSource: true,//保持源数据
@@ -39,7 +217,7 @@
    useKey: true
  },
  filterConfig: {   //筛选配置项
    remote: true
    //remote: true
  },
  customConfig: {
    storage: true
@@ -50,112 +228,19 @@
    showStatus: true
  },//表头参数
  columns:[
    {type:'expand',fixed:"left",slots: { content:'content' },width: '50'},
    // { type: 'checkbox',fixed:"left", title: '选择', width: '80' },
    { type: 'seq',fixed:"left", title: '自序', width: '80' },
    // {title: '操作', width: '110', slots: { default: 'button_slot' },fixed:"left"},
    {field: 'InventoryOrganization', width:'150', title: '库存组织', sortable: true,editRender: { name: 'input', attrs: { placeholder: '' } } },
    {field: 'MaterialCode', width: '150',title: '物料编码', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
    {field: 'MaterialName', width: '120',title: '物料名称', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
    {field: 'Origin', width: '100',title: '产地', sortable: true},
    {field: 'InventoryNumber',width: '100', title: '库存编号', sortable: true,showOverflow:"ellipsis"},
    {field: 'Width', width: '80',title: '宽度', sortable: true},
    {field: 'Height',width: '100', title: '高度', sortable: true},
    {field: 'Thickness', width: '100',title: '厚度', sortable: true},
    {field: 'MainUnit',width: '100', title: '主单位', sortable: true},
    {field: 'SafetyStock', width: '100',title: '安全库存', sortable: true},
    {field: 'InventoryCount',width: '100', title: '库存数量', sortable: true},
    {field: 'AvailableInventory', width: '100',title: '可用库存', sortable: true},
    {field: 'UnclaimedQuantity',width: '140', title: '未领取数量', sortable: true},
    {field: 'TotalArea',width: '100', title: '总面积', sortable: true},
    {field: 'ProductionDate',width: '100', title: '生产日期', sortable: true},
    {field: 'ShelfLife',width: '100', title: '保质期', sortable: true},
    {field: 'LocationNumber',width: '100', title: '库位编号', sortable: true},
    {field: 'StorageArea',width: '100', title: '存储区域', sortable: true},
    {field: 'Location',width: '100', title: '库位', sortable: true},
    {field: 'BacklogInventory',width: '100', title: '积压库存', sortable: true},
    {field: 'remark',width: '80', title: '备注', sortable: true},

  ],//表头按钮
  toolbarConfig: {
    // buttons: [{
    //   'name': '新增'
    // }],
    import: false,
    buttons: [
      {'code': 'out', 'name': '物料出库',status: 'primary'},
      {'code': 'add', 'name': '物料新增',status: 'primary'},
    ],
    /*import: false,
    export: true,
    print: true,
    print: true,*/
    zoom: true,
    custom: true
  },
  data:  [
    {
      "InventoryOrganization": "人工库",
      "MaterialCode": "700900000000115",
      "MaterialName": "冬装170",
      "Origin": "China",
      "InventoryNumber": "KC2006891",
      "Width": '',
      "Height": "",
      "Thickness": "",
      "MainUnit": "件",
      "SafetyStock": "5",
      "InventoryCount": "20",
      "AvailableInventory": "9",
      "UnclaimedQuantity": "2",
      "TotalArea": "0",
      "ProductionDate": "2016-10-17",
      "ShelfLife": "0",
      "LocationNumber": "0",
      "StorageArea": "0",
      "Location": "0",
      "BacklogInventory": "40",
      "remark": "测试",
    },
    {
      "InventoryOrganization": "人工库",
      "MaterialCode": "700900000000115",
      "MaterialName": "冬装175",
      "Origin": "China",
      "InventoryNumber": "KC2006891",
      "Width": '',
      "Height": "",
      "Thickness": "",
      "MainUnit": "件",
      "SafetyStock": "5",
      "InventoryCount": "20",
      "AvailableInventory": "9",
      "UnclaimedQuantity": "2",
      "TotalArea": "0",
      "ProductionDate": "2016-10-17",
      "ShelfLife": "0",
      "LocationNumber": "0",
      "StorageArea": "0",
      "Location": "0",
      "BacklogInventory": "40",
      "remark": "测试",
    },{
      "InventoryOrganization": "人工库",
      "MaterialCode": "700900000000115",
      "MaterialName": "冬装180",
      "Origin": "China",
      "InventoryNumber": "KC2006891",
      "Width": '',
      "Height": "",
      "Thickness": "",
      "MainUnit": "件",
      "SafetyStock": "2",
      "InventoryCount": "23",
      "AvailableInventory": "4",
      "UnclaimedQuantity": "3",
      "TotalArea": "0",
      "ProductionDate": "2016-10-17",
      "ShelfLife": "0",
      "LocationNumber": "0",
      "StorageArea": "0",
      "Location": "0",
      "BacklogInventory": "40",
      "remark": "测试",
    },
  ],//table body实际数据
  footerMethod ({ columns, data }) {//页脚函数
    return[
      columns.map((column, columnIndex) => {
@@ -173,17 +258,316 @@
})


const gridEvents = {
  async toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'out': {
          const selectRecords = $grid.getCheckboxRecords()


          if (selectRecords.length === 0) {
            ElMessage.warning(t('productStock.unselectedData'))
            return
          }
          let id = ""
          const array = [];
          for (let i = 0; i < selectRecords.length; i++) {
            array.push(selectRecords[i].id)
            if (i + 1 === selectRecords.length) {
              id += selectRecords[i].id
            } else {
              id += selectRecords[i].id + "|"
            }
          }

          router.push({path: '/main/ingredientsStock/CreateOutbound', query: {id: id}})
          break


        }
        case 'add': {
          dialogTableVisible.value=true
          select()
          //第一次加载默认
          value.value='原片'
          filterData.value.type='原片'
          request.get(`/BasicWarehouse/BasicWarehouseType/${value.value}`).then((res) => {
            if(res.code==200){
              gridOption.columns.splice(0,gridOption.columns.length)
              console.log(res.data)
              BasicData.value = res.data
              //添加列
              gridOption.columns=arr.slice()

              for (let i=0;i<BasicData.value.length;i++){
                let aa={field: BasicData.value[i].OperateType, width: '150',title: BasicData.value[i].OperateTypeName, sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged}
                gridOption.columns.push(aa)

              }
              getStoreWork()

            }else{
              ElMessage.warning(res.msg)
            }
          })
          break


        }
      }
    }
  }
}




let arrs = [
  { type: 'radio',fixed:"left", title: '选择', width: '80' },
  { type: 'seq',fixed:'left', title: '自序', width: '80' },
  {field: 'id', width: '150',title: '物料编码', sortable: true,showOverflow:'ellipsis' ,filters:[{ data: '' }],slots: { filter: 'num1_filter' },filterMethod:filterChanged}
]

const value = ref('')
const options = [
  {
    value: '原片',
    label: '原片'
  },
  {
    value: '辅料',
    label: '辅料',
  }
]

let filterDatas = ref({
  type:''

})
let BasicDatas = ref([])
let materialStores= ref([])

//定义接收加载表头下拉数据
const titleSelectJson = ref({
  inventoryOrganization:""
})

// 定义表头上传数据
let titleUploadData = ref({
  producer:'',
  dateOfManufacture:'',
  qualityGuaranteePeriod:'',
  inventoryOrganization:'',
  inventoryArea:'',
  inventoryQuantity:'',
  remarks:''
})



//物料新增
const xGrids = ref()
const gridOption = 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:[

  ],//表头按钮
  toolbarConfig: {
    buttons: [
      {'code': 'add', 'name': t('basicData.save'),status: 'primary',icon: 'vxe-icon-save'},
    ],
  }

})

const select=() =>{
  request.get(`/BasicWarehouse/BasicWarehouseTypes/库存组织`).then((res) => {

    if(res.code==200){
      titleSelectJson.value=deepClone(res.data)
      titleUploadData.value.inventoryOrganization=titleSelectJson.value.inventoryOrganization[0].operateTypeName
    }else{
      ElMessage.warning(res.msg)
    }
  })
}

//列查询
const getStoreWork = () => {
  filterDatas.value.type=value.value
  request.get(`/BasicWarehouse/BasicWarehouseType/${value.value}`).then((res) => {
    if(res.code==200){
      gridOption.columns=[]
      BasicData.value = res.data
      //添加列
      gridOption.columns=arrs.slice()

      for (let i=0;i<BasicData.value.length;i++){
        let column={field: BasicData.value[i].OperateType,
          width: '150',title: BasicData.value[i].OperateTypeName,
          sortable: true,showOverflow:'ellipsis' ,
          filters:[{ data: '' }],
          slots: { filter: 'num1_filter' },
          filterMethod:filterChanged}

        gridOption.columns.push(column)

      }
      getStoreWorks()

    }else{
      ElMessage.warning(res.msg)
    }
  })
}

//数据绑定
const getStoreWorks = () => {
  console.log(filterDatas.value)
  request.post(`/MaterialStore/getSelectMaterialStore/1/${total.pageSize}`,filterDatas.value).then((res) => {

    if(res.code==200){
      console.log(res.data)
      materialStores.value=[]
      for (let i=0;i<res.data.data.length;i++){
        materialStores.value[i]=JSON.parse(res.data.data[i].json)
        materialStores.value[i].id=(res.data.data[i].id)

      }


      produceLists = deepClone(materialStores.value)
      xGrids.value.loadData(produceLists)
      gridOption.loading=false
    }else{
      ElMessage.warning(res.msg)
      router.push("/login")
    }
  })
}


const gridEvent = {
  async toolbarButtonClick({code}) {
    const $grid = xGrids.value
    if ($grid) {
      switch (code) {
        case 'add': {
          const selectRecords = $grid.getRadioRecord()
          console.log(selectRecords)
          if (selectRecords == null) {
            ElMessage.warning(t('productStock.unselectedData'))
            return
          }
          const errMap = await $grid.validate(selectRecords)
          if (errMap) {
            ElMessage.warning(t('productStock.dataVerificationFailed'))
            return
          }
          //表头数据校验
          const outboundType = titleUploadData.value.inventoryOrganization
          if(outboundType === null || outboundType === undefined || outboundType === ''){
            ElMessage.error("请选择库存组织")
            return
          }
          const materialRequisitionPersonnel = titleUploadData.value.inventoryQuantity
          if(materialRequisitionPersonnel === null || materialRequisitionPersonnel === undefined || materialRequisitionPersonnel === ''){
            ElMessage.error("请输入数量")
            return
          }
          const  dateOfManufacture= titleUploadData.value.dateOfManufacture
          if(dateOfManufacture === null || dateOfManufacture === undefined || dateOfManufacture === ''){
            titleUploadData.value.dateOfManufacture=null
          }

          const inventoryArea = titleUploadData.value.inventoryArea
          if(inventoryArea === null || inventoryArea === undefined || inventoryArea === ''){
            ElMessage.error("请输入库存区域")
            return
          }


          let  flowData = ref({
            totalArea: selectRecords.height*selectRecords.width/100000*titleUploadData.value.inventoryQuantity,
            singlePieceArea: selectRecords.height*selectRecords.width/100000,
            title: titleUploadData.value,
            materialCode: selectRecords.id

          })




          console.log(flowData)
          request.post("/MaterialInventory/saveMaterialInventory", flowData.value).then((res) => {
            if(res.code==200){
              ElMessage.success('保存成功')
              router.push({path: '/main/ingredientsStock/SelectIngredientsStock', query:{random:Math.random()}})
            }else{
              ElMessage.warning(res.msg)
              router.push("/login")
            }
          })
          break
        }


      }
    }
  }
}


</script>

<template>
  <div class="main-div-customer">
    <el-date-picker
        v-model="selectDate"
        type="daterange"
        start-placeholder="开始时间"
        end-placeholder="结束时间"
        format="YYYY-MM-DD"
        value-format="YYYY-MM-DD"

    />
    <el-button @click="changeDate" style="margin-top: -5px"  id="searchButton" type="primary" :icon="Search">查询</el-button>


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

    >
      <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
@@ -192,7 +576,8 @@
        <ul class="expand-wrapper">
          <li  v-for="(item,index) in gridOptions.columns" v-show="item.field!=undefined ">
            <span style="font-weight: bold">{{item.title+':  '}}</span>
            <span>{{ row[item.field] }}</span>
            <span v-if="hasDecimal(item.field)">{{ hasDecimalhtml(item.field,row) }}</span>
            <span v-else>{{ row[item.field] }}</span>
          </li>
        </ul>
      </template>
@@ -211,8 +596,93 @@
        </div>
      </template>

      <template #pager>
        <!--使用 pager 插槽-->
        <vxe-pager
            @page-change="handlePageChange"
            :layouts="[  'PrevPage', 'Jump','PageCount', 'NextPage',  'Total']"
            v-model:current-page="pageNum"
            v-model:page-size="total.pageSize"
            v-model:pager-count="total.pageTotal"
            :total="total.dataTotal"
        >
        </vxe-pager>
      </template>


    </vxe-grid>

    <el-dialog v-model="dialogTableVisible" title="物料新增" style="width: 70%;height:75% ">
      <div class="order-primary" >
        <el-row>
          <el-col  :span="2"><el-text>生产日期:</el-text></el-col>
          <el-col  :span="4">
            <el-date-picker
                v-model="titleUploadData.dateOfManufacture"
                type="date"
                format="YYYY-MM-DD"
                value-format="YYYY-MM-DD"
                placeholder="请选择生产日期"/>
          </el-col>

          <el-col  :span="2"><el-text>保质期:</el-text></el-col>
          <el-col  :span="3"><el-input v-model="titleUploadData.qualityGuaranteePeriod" /></el-col>
          <el-col  :span="1"><el-text>产地:</el-text></el-col>
          <el-col  :span="3"><el-input v-model="titleUploadData.producer" /></el-col>

        </el-row>
        <el-row>
          <el-col  :span="2"><el-text>库存组织：</el-text></el-col>
          <el-col  :span="4">
            <el-select v-model="titleUploadData.inventoryOrganization"  clearable placeholder=""  >
              <el-option
                  v-for="item in titleSelectJson['inventoryOrganization']"
                  :key="item.id"
                  :label="item.operateTypeName"
                  :value="item.operateTypeName"
              />
            </el-select>
          </el-col>
          <el-col  :span="2"><el-text>库存区域:</el-text></el-col>
          <el-col  :span="3"><el-input v-model="titleUploadData.inventoryArea" /></el-col>
          <el-col  :span="1"><el-text>数量:</el-text></el-col>
          <el-col  :span="3"><el-input v-model="titleUploadData.inventoryQuantity" /></el-col>
          <el-col  :span="1"><el-text>备注:</el-text></el-col>
          <el-col  :span="3"><el-input v-model="titleUploadData.remarks" /></el-col>

        </el-row>
      </div>
      <div>
        <el-row>
            <el-select v-model="value" placeholder="请选择类别" @change="getStoreWork">
              <el-option
                  v-for="item in options"
                  :key="item.value"
                  :label="item.label"
                  :value="item.value"
              />
            </el-select>
        </el-row>
      </div>
      <div class="main-div-customers">
        <vxe-grid
            height="400px"
            class="mytable-scrollbar"
            ref="xGrids"
            v-bind="gridOption"
            v-on="gridEvent"

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

@@ -221,4 +691,15 @@
  width: 99%;
  height: 100%;
}
.main-div-customers{
  width: 99%;
  height: 100%;
}
.el-col{
  margin-left: 15px;
  margin-bottom: 5px;
}
.order-primary{
  width: 100%;
}
</style>