Merge branch 'master' of http://10.153.19.25:10101/r/ERP_override
# Conflicts:
# north-glass-erp/.idea/workspace.xml
| | |
| | | <?xml version="1.0" encoding="UTF-8"?> |
| | | <project version="4"> |
| | | <component name="dataSourceStorageLocal" created-in="IU-232.8660.185"> |
| | | <component name="dataSourceStorageLocal" created-in="IU-232.9559.62"> |
| | | <data-source name="@localhost [2]" uuid="165c5447-d19a-4aaf-af5f-cee92ae696c2"> |
| | | <database-info product="MySQL" version="8.0.22" jdbc-version="4.2" driver-name="MySQL Connector/J" driver-version="mysql-connector-java-8.0.25 (Revision: 08be9e9b4cba6aa115f9b27b215887af40b159e0)" dbms="MYSQL" exact-version="8.0.22" exact-driver-version="8.0"> |
| | | <extra-name-characters>#@</extra-name-characters> |
| | |
| | | <project version="4"> |
| | | <component name="VcsDirectoryMappings"> |
| | | <mapping directory="$PROJECT_DIR$/.." vcs="Git" /> |
| | | <mapping directory="$PROJECT_DIR$" vcs="Git" /> |
| | | </component> |
| | | </project> |
| | |
| | | <option name="autoReloadType" value="SELECTIVE" /> |
| | | </component> |
| | | <component name="ChangeListManager"> |
| | | <list default="true" id="402214ec-6c93-4a9d-b589-f17dc90f718e" name="更改" comment="11.24提交" /> |
| | | <list default="true" id="402214ec-6c93-4a9d-b589-f17dc90f718e" name="更改" comment="11.24提交"> |
| | | <change afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/product/testSort.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/package-lock.json" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/package.json" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/router/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/router/index.js" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/customer/SelectCustomer.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/customer/SelectCustomer.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/delivery/SelectDelivery.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/delivery/SelectDelivery.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/delivery/SelectOrderList.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/delivery/SelectOrderList.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/order/SelectOrder.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/order/SelectOrder.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/product/Product.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/product/Product.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/product/SelectProduct.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/product/SelectProduct.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/product/Test.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/product/Test.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/returns/SelectDeliveryList.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/returns/SelectDeliveryList.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/src/views/sd/returns/SelectReturns.vue" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/src/views/sd/returns/SelectReturns.vue" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/northglass-erp/vite.config.js" beforeDir="false" afterPath="$PROJECT_DIR$/northglass-erp/vite.config.js" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/src/main/resources/application.yml" beforeDir="false" afterPath="$PROJECT_DIR$/src/main/resources/application.yml" afterDir="false" /> |
| | | <change beforePath="$PROJECT_DIR$/target/classes/application.yml" beforeDir="false" afterPath="$PROJECT_DIR$/target/classes/application.yml" afterDir="false" /> |
| | | </list> |
| | | <option name="SHOW_DIALOG" value="false" /> |
| | | <option name="HIGHLIGHT_CONFLICTS" value="true" /> |
| | | <option name="HIGHLIGHT_NON_ACTIVE_CHANGELIST" value="false" /> |
| | |
| | | "project.structure.side.proportion": "0.0", |
| | | "settings.editor.selected.configurable": "preferences.pluginManager", |
| | | "spring.configuration.checksum": "def6d90e829e50c63f98c387daecd138", |
| | | "ts.external.directory.path": "D:\\软件\\IntelliJ IDEA 2023.2\\plugins\\javascript-impl\\jsLanguageServicesImpl\\external", |
| | | "ts.external.directory.path": "D:\\file\\IntelliJ IDEA 2023.2.1\\plugins\\javascript-impl\\jsLanguageServicesImpl\\external", |
| | | "vue.rearranger.settings.migration": "true" |
| | | }, |
| | | "keyToStringList": { |
| | |
| | | <command value="length" /> |
| | | </option> |
| | | </component> |
| | | <component name="RunManager" selected="npm.dev"> |
| | | <component name="RunManager" selected="Spring Boot.ErpApplication"> |
| | | <configuration default="true" type="ArquillianJUnit" factoryName="" nameIsGenerated="true"> |
| | | <option name="arquillianRunConfiguration"> |
| | | <value> |
| | |
| | | <workItem from="1702631535326" duration="205000" /> |
| | | <workItem from="1702858329054" duration="9016000" /> |
| | | <workItem from="1703031064839" duration="55055000" /> |
| | | <workItem from="1703463546867" duration="21185000" /> |
| | | <workItem from="1704156530617" duration="3579000" /> |
| | | <workItem from="1704326593184" duration="11706000" /> |
| | | <workItem from="1703463546867" duration="16447000" /> |
| | | <workItem from="1703811064202" duration="29032000" /> |
| | | </task> |
| | | <task id="LOCAL-00001" summary="第一次推送"> |
| | | <option name="closed" value="true" /> |
| | |
| | | <MESSAGE value="11.24提交" /> |
| | | <option name="LAST_COMMIT_MESSAGE" value="11.24提交" /> |
| | | </component> |
| | | <component name="XDebuggerManager"> |
| | | <breakpoint-manager> |
| | | <breakpoints> |
| | | <line-breakpoint enabled="true" type="javascript"> |
| | | <url>file://$PROJECT_DIR$/northglass-erp/src/views/sd/product/SelectProduct.vue</url> |
| | | <line>38</line> |
| | | <option name="timeStamp" value="4" /> |
| | | </line-breakpoint> |
| | | <line-breakpoint enabled="true" type="javascript"> |
| | | <url>file://$PROJECT_DIR$/northglass-erp/src/views/sd/product/SelectProduct.vue</url> |
| | | <line>254</line> |
| | | <properties lambdaOrdinal="-1" /> |
| | | <option name="timeStamp" value="7" /> |
| | | </line-breakpoint> |
| | | <line-breakpoint enabled="true" type="javascript"> |
| | | <url>file://$PROJECT_DIR$/northglass-erp/src/views/sd/product/SelectProduct.vue</url> |
| | | <line>179</line> |
| | | <properties lambdaOrdinal="-1" /> |
| | | <option name="timeStamp" value="8" /> |
| | | </line-breakpoint> |
| | | </breakpoints> |
| | | </breakpoint-manager> |
| | | </component> |
| | | <component name="XSLT-Support.FileAssociations.UIState"> |
| | | <expand /> |
| | | <select /> |
| | |
| | | "element-plus": "^2.4.0", |
| | | "pinia": "^2.1.6", |
| | | "pinia-plugin-persistedstate": "^3.2.0", |
| | | "sortablejs": "^1.15.1", |
| | | "vue": "^3.3.4", |
| | | "vue-router": "^4.2.4", |
| | | "vxe-table": "^4.5.15", |
| | | "xe-utils": "^3.5.14" |
| | | }, |
| | | "devDependencies": { |
| | | "@types/sortablejs": "^1.15.7", |
| | | "@vitejs/plugin-vue": "^4.3.4", |
| | | "vite": "^4.4.9" |
| | | } |
| | |
| | | "dependencies": { |
| | | "@types/lodash": "*" |
| | | } |
| | | }, |
| | | "node_modules/@types/sortablejs": { |
| | | "version": "1.15.7", |
| | | "resolved": "https://registry.npmmirror.com/@types/sortablejs/-/sortablejs-1.15.7.tgz", |
| | | "integrity": "sha512-PvgWCx1Lbgm88FdQ6S7OGvLIjWS66mudKPlfdrWil0TjsO5zmoZmzoKiiwRShs1dwPgrlkr0N4ewuy0/+QUXYQ==", |
| | | "dev": true |
| | | }, |
| | | "node_modules/@types/web-bluetooth": { |
| | | "version": "0.0.16", |
| | |
| | | "fsevents": "~2.3.2" |
| | | } |
| | | }, |
| | | "node_modules/sortablejs": { |
| | | "version": "1.15.1", |
| | | "resolved": "https://registry.npmmirror.com/sortablejs/-/sortablejs-1.15.1.tgz", |
| | | "integrity": "sha512-P5Cjvb0UG1ZVNiDPj/n4V+DinttXG6K8n7vM/HQf0C25K3YKQTQY6fsr/sEGsJGpQ9exmPxluHxKBc0mLKU1lQ==" |
| | | }, |
| | | "node_modules/source-map-js": { |
| | | "version": "1.0.2", |
| | | "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", |
| | |
| | | "requires": { |
| | | "@types/lodash": "*" |
| | | } |
| | | }, |
| | | "@types/sortablejs": { |
| | | "version": "1.15.7", |
| | | "resolved": "https://registry.npmmirror.com/@types/sortablejs/-/sortablejs-1.15.7.tgz", |
| | | "integrity": "sha512-PvgWCx1Lbgm88FdQ6S7OGvLIjWS66mudKPlfdrWil0TjsO5zmoZmzoKiiwRShs1dwPgrlkr0N4ewuy0/+QUXYQ==", |
| | | "dev": true |
| | | }, |
| | | "@types/web-bluetooth": { |
| | | "version": "0.0.16", |
| | |
| | | "fsevents": "~2.3.2" |
| | | } |
| | | }, |
| | | "sortablejs": { |
| | | "version": "1.15.1", |
| | | "resolved": "https://registry.npmmirror.com/sortablejs/-/sortablejs-1.15.1.tgz", |
| | | "integrity": "sha512-P5Cjvb0UG1ZVNiDPj/n4V+DinttXG6K8n7vM/HQf0C25K3YKQTQY6fsr/sEGsJGpQ9exmPxluHxKBc0mLKU1lQ==" |
| | | }, |
| | | "source-map-js": { |
| | | "version": "1.0.2", |
| | | "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.0.2.tgz", |
| | |
| | | "element-plus": "^2.4.0", |
| | | "pinia": "^2.1.6", |
| | | "pinia-plugin-persistedstate": "^3.2.0", |
| | | "sortablejs": "^1.15.1", |
| | | "vue": "^3.3.4", |
| | | "vue-router": "^4.2.4", |
| | | "vxe-table": "^4.5.15", |
| | | "xe-utils": "^3.5.14" |
| | | }, |
| | | "devDependencies": { |
| | | "@types/sortablejs": "^1.15.7", |
| | | "@vitejs/plugin-vue": "^4.3.4", |
| | | "vite": "^4.4.9" |
| | | } |
| | |
| | | <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 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 |
| | | } |
| | | } |
| | |
| | | component: () => import('../views/sd/product/Test11.vue') |
| | | }, |
| | | { |
| | | path: 'testSort', |
| | | name: 'testSort', |
| | | component: () => import('../views/sd/product/testSort.vue') |
| | | }, |
| | | { |
| | | path: '', |
| | | redirect:'/main/product/selectProduct' |
| | | } |
| | |
| | | name: 'finishedProductRework', |
| | | component:()=>import('../views/mm/mainProductStock/FinishedProductRework.vue'), |
| | | }, |
| | | { |
| | | // 调拨记录 |
| | | path: 'transferRecord', |
| | | name: 'transferRecord', |
| | | component:()=>import('../views/mm/mainProductStock/TransferRecord.vue'), |
| | | }, |
| | | { |
| | | // 领出记录 |
| | | path: 'takeOutRecord', |
| | | name: 'takeOutRecord', |
| | | component:()=>import('../views/mm/mainProductStock/TakeOutRecord.vue'), |
| | | }, |
| | | { |
| | | // 返工记录 |
| | | path: 'reworkRecord', |
| | | name: 'reworkRecord', |
| | | component:()=>import('../views/mm/mainProductStock/ReworkRecord.vue'), |
| | | }, |
| | | |
| | | { |
| | | path: '', |
| | |
| | | <script lang="ts" setup> |
| | | import {reactive, ref} from "vue" |
| | | import {onMounted, onUnmounted, reactive, ref} from "vue" |
| | | import {useRouter,useRoute } from 'vue-router' |
| | | import type {FormInstance, FormRules} from 'element-plus' |
| | | import { ElMessage } from "element-plus"; |
| | |
| | | import { sendSock, createWebSocket, closeSock,global_callback1 } from "@/utils/webSocket" |
| | | |
| | | const store=userInfo() |
| | | const ruleFormRef = ref<FormInstance>() |
| | | let ruleFormRef = ref<FormInstance>() |
| | | const router = useRouter() |
| | | const route = useRoute() |
| | | |
| | |
| | | let loginLoadings= ref(false) |
| | | let registerLoadings= ref(false) |
| | | |
| | | const keyDown = (e) => { |
| | | // 回车则执行登录方法 enter键的ASCII是13 |
| | | if (e.keyCode == 13 || e.keyCode == 100) { |
| | | submitForm(ruleFormRef.value) |
| | | } |
| | | } |
| | | onMounted(()=>{ |
| | | window.addEventListener('keydown', keyDown) |
| | | }) |
| | | onUnmounted(() => { |
| | | window.removeEventListener('keydown', keyDown) |
| | | }) |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | | <div class="mainDiv"> |
| | | <div class="mainDiv" > |
| | | <div id="main-login"> |
| | | <div id="img-div"> |
| | | <img id="img-pic" src="@/assets/img.png" alt=""> |
| | |
| | | <div id="div-login"> |
| | | <h2>北玻自动化ERP管理系统</h2> |
| | | <el-form |
| | | @submit.native.prevent |
| | | ref="ruleFormRef" |
| | | :model="userForm" |
| | | status-icon |
| | |
| | | <el-button |
| | | :loading="loginLoadings" |
| | | type="primary" |
| | | native-type="submit" |
| | | @click="submitForm(ruleFormRef)" |
| | | @keyup.enter.native="keyDown(e)" |
| | | >登录 |
| | | </el-button> |
| | | |
| | |
| | | <!-- <el-divider ></el-divider> <!– 添加分隔线 –>--> |
| | | |
| | | |
| | | <el-row gutter="5"> |
| | | <!-- <el-col :span="4.5">--> |
| | | <!-- <el-input v-model="name" placeholder="请输入保质期" style="width: 150px; height: 30px;" />--> |
| | | <!-- </el-col>--> |
| | | <!-- <el-col :span="4.5">--> |
| | | <!-- <el-input v-model="name" placeholder="请输入最高预警" style="width: 150px; height: 30px;" />--> |
| | | <!-- </el-col>--> |
| | | <!-- <el-col :span="4.5">--> |
| | | <!-- <el-input v-model="name" placeholder="请输入拆包预警" style="width: 150px; height: 30px;" />--> |
| | | <!-- </el-col>--> |
| | | <!-- <el-row gutter="5">--> |
| | | <!--<!– <el-col :span="4.5">–>--> |
| | | <!--<!– <el-input v-model="name" placeholder="请输入保质期" style="width: 150px; height: 30px;" />–>--> |
| | | <!--<!– </el-col>–>--> |
| | | <!--<!– <el-col :span="4.5">–>--> |
| | | <!--<!– <el-input v-model="name" placeholder="请输入最高预警" style="width: 150px; height: 30px;" />–>--> |
| | | <!--<!– </el-col>–>--> |
| | | <!--<!– <el-col :span="4.5">–>--> |
| | | <!--<!– <el-input v-model="name" placeholder="请输入拆包预警" style="width: 150px; height: 30px;" />–>--> |
| | | <!--<!– </el-col>–>--> |
| | | |
| | | </el-row> |
| | | <el-divider ></el-divider> <!-- 添加分隔线 --> |
| | | <!-- </el-row>--> |
| | | <!-- <el-divider ></el-divider> <!– 添加分隔线 –>--> |
| | | <el-row gutter="10" justify="center" > |
| | | <el-col span="4"> |
| | | <el-button id="searchButton" type="primary" :icon="Search">查询</el-button> |
| | |
| | | |
| | | |
| | | const router = useRouter() |
| | | |
| | | let indexFlag=$ref(1) |
| | | function changeRouter(index){ |
| | | indexFlag=index |
| | | } |
| | | </script> |
| | | |
| | | <template> |
| | | <div id="main"> |
| | | <div id="div-title"> |
| | | <el-breadcrumb :separator-icon="ArrowRight"> |
| | | <el-breadcrumb-item :to="{ path: '/main/ingredients/SelectIngredients' }">物料资料</el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{ path: '/main/ingredients/CreateIngredients' }">物料新增</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/ingredients/SelectIngredients' }">物料资料</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/ingredients/CreateIngredients' }">物料新增</el-breadcrumb-item> |
| | | <el-breadcrumb-item v-show="false" :to="{ path: '/main/order/orderReport' }">报表</el-breadcrumb-item> |
| | | </el-breadcrumb> |
| | | |
| | |
| | | #select{ |
| | | margin-left:0.5rem; |
| | | } |
| | | :deep(.indexTag .el-breadcrumb__inner){ |
| | | color: #5CADFE !important; |
| | | } |
| | | </style> |
| | |
| | | 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"}, |
| | | { type: 'seq',fixed:"left", title: '自序', width: '80' }, |
| | | {field: 'materialCode', width:'150', title: '物料编码', sortable: true,editRender: { name: 'input', attrs: { placeholder: '' } } }, |
| | | {field: 'materialName', width: '150',title: '物料名称', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'origin', width: '120',title: '产地', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | |
| | | switch (type) { |
| | | case 'edit' :{ |
| | | alert('我接收到子组件传送的编辑信息') |
| | | // router.push({path: '/main/trader/CreateTrader', query: { id: row.id }}) |
| | | router.push({path: '/main/trader/CreateTrader', query: { id: row.id }}) |
| | | break |
| | | } |
| | | case 'delete':{ |
| | |
| | | {field: 'remark',width: '80', title: '备注', sortable: true,editRender: { name: 'input', attrs: { placeholder: '' } }}, |
| | | ],//表头按钮 |
| | | toolbarConfig: { |
| | | buttons: [{ |
| | | 'name': '提交',status:'primary' |
| | | }], |
| | | buttons: [ |
| | | {'name': '提交',status:'primary'}, |
| | | {'name': '审核',status:'primary', 'disabled': true} |
| | | ], |
| | | import: false, |
| | | export: true, |
| | | print: true, |
| | |
| | | |
| | | |
| | | const router = useRouter() |
| | | |
| | | let indexFlag=$ref(1) |
| | | function changeRouter(index){ |
| | | indexFlag=index |
| | | } |
| | | </script> |
| | | |
| | | <template> |
| | | <div id="main"> |
| | | <div id="div-title"> |
| | | <el-breadcrumb :separator-icon="ArrowRight"> |
| | | <el-breadcrumb-item :to="{ path: '/main/ingredientsStock/SelectIngredientsStock' }">物料库存</el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{ path: '/main/ingredientsStock/MaterialOutbound' }">物料出库</el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{ path: '/main/ingredientsStock/OriginalMonthlySettlement' }">原片月结</el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{ path: '/main/ingredientsStock/AccessoriesMonthlySettlement' }">辅料月结</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/ingredientsStock/SelectIngredientsStock' }">物料库存</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/ingredientsStock/MaterialOutbound' }">物料出库</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(3)" :class="indexFlag===3?'indexTag':''" :to="{ path: '/main/ingredientsStock/OriginalMonthlySettlement' }">原片月结</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(4)" :class="indexFlag===4?'indexTag':''" :to="{ path: '/main/ingredientsStock/AccessoriesMonthlySettlement' }">辅料月结</el-breadcrumb-item> |
| | | <el-breadcrumb-item v-show="false" :to="{ path: '/main/order/orderReport' }">报表</el-breadcrumb-item> |
| | | </el-breadcrumb> |
| | | |
| | |
| | | #select{ |
| | | margin-left:0.5rem; |
| | | } |
| | | :deep(.indexTag .el-breadcrumb__inner){ |
| | | color: #5CADFE !important; |
| | | } |
| | | </style> |
| | |
| | | switch (type) { |
| | | case 'edit' :{ |
| | | alert('我接收到子组件传送的编辑信息') |
| | | // router.push({path: '/main/trader/CreateTrader', query: { id: row.id }}) |
| | | router.push({path: '/main/ingredientsStock/CreateOutbound', query: { id: row.id }}) |
| | | break |
| | | } |
| | | case 'delete':{ |
| | |
| | | },//表头参数 |
| | | 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"}, |
| | | // { type: 'checkbox',fixed:"left", title: '选择', width: '80' }, |
| | | { type: 'seq',fixed:"left", title: '自序', width: '80' }, |
| | | |
| | | {title: '审核', width: 50, slots: { default: 'state' },}, |
| | | |
| | | {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' }}, |
| | |
| | | </div> |
| | | </template> |
| | | |
| | | <template #state="{ row}"> |
| | | <el-checkbox checked/> |
| | | </template> |
| | | |
| | | </vxe-grid> |
| | | </div> |
| | | </template> |
| | | |
| | | |
| | | <style scoped> |
| | | .main-div-customer{ |
| | | width: 99%; |
| | |
| | | <script setup> |
| | | |
| | | import {reactive} from "vue"; |
| | | import {reactive, ref} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | let router=useRouter() |
| | | const getTableRow = (row,type) =>{ |
| | |
| | | } |
| | | |
| | | }) |
| | | |
| | | const xGrid = ref(); |
| | | const gridEvents = { |
| | | toolbarButtonClick ({ code }) { |
| | | const $grid = xGrid.value |
| | | if ($grid) { |
| | | switch (code) { |
| | | case 'add': { |
| | | |
| | | router.push({path: '/main/trader/CreateTrader'}) |
| | | /*if($grid.getCheckboxRecords().length==0){ |
| | | VXETable.modal.message( '请选择一条数据!') |
| | | return |
| | | }*/ |
| | | alert('我接收到子组件传送的编辑信息') |
| | | return; |
| | | } |
| | | |
| | |
| | | |
| | | <script setup> |
| | | |
| | | import {reactive} from "vue"; |
| | | import {reactive, ref} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | let router=useRouter() |
| | | const getTableRow = (row,type) =>{ |
| | |
| | | // } |
| | | } |
| | | } |
| | | const xGrid = ref(); |
| | | const gridEvents = { |
| | | toolbarButtonClick ({ code }) { |
| | | toolbarButtonClick({ code }) { |
| | | const $grid = xGrid.value |
| | | if ($grid) { |
| | | switch (code) { |
| | | case 'add': { |
| | | |
| | | router.push({path: '/main/trader/CreateTrader'}) |
| | | /*if($grid.getCheckboxRecords().length==0){ |
| | | VXETable.modal.message( '请选择一条数据!') |
| | | return |
| | | }*/ |
| | | return; |
| | | } |
| | | |
| | | } |
| | | } |
| | | }, |
| | | toolbarToolClick ({ code }) { |
| | | const $grid = xGrid.value |
| | | if ($grid) { |
| | | switch (code) { |
| | | case 'myPrint': { |
| | | $grid.print() |
| | | if($grid){ |
| | | switch (code){ |
| | | case 'verify':{ |
| | | alert('我接收到子组件传送的编辑信息') |
| | | // router.push({path: '/main/productStock/OrderAllocation'}); |
| | | // return; |
| | | break |
| | | } |
| | | case 'out':{ |
| | | router.push({path: '/main/productStock/TakeOutRecord'}); |
| | | return; |
| | | break; |
| | | } |
| | | case 'rework':{ |
| | | router.push({path: '/main/productStock/FinishedProductRework'}); |
| | | return; |
| | | break; |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | |
| | | toolbarConfig: { |
| | | buttons: [{ |
| | | 'name': '确认领出', |
| | | 'code': 'verify', |
| | | status: 'primary' |
| | | },{ |
| | | 'name': '领出记录', |
| | | 'name': '领出记录','code':'out', |
| | | }], |
| | | import: false, |
| | | export: true, |
| | |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | |
| | | v-on="gridEvents" |
| | | > |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | | <!-- 下拉显示所有信息插槽--> |
| | |
| | | <script setup> |
| | | |
| | | import {reactive} from "vue"; |
| | | import {reactive, ref} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | let router=useRouter() |
| | | const getTableRow = (row,type) =>{ |
| | |
| | | //alert('我接收到子组件传送的编辑信息') |
| | | router.push({path: '/main/productStock/FinishedGoodsIssue', query: { id: row.id }}) |
| | | break |
| | | } |
| | | } |
| | | } |
| | | |
| | | const xGrid = ref(); |
| | | const gridEvents = { |
| | | toolbarButtonClick({ code }) { |
| | | const $grid = xGrid.value |
| | | if($grid){ |
| | | switch (code){ |
| | | case 'ver':{ |
| | | alert('我接收到子组件传送的编辑信息') |
| | | // router.push({path: '/main/productStock/OrderAllocation'}); |
| | | // return; |
| | | break |
| | | } |
| | | case 'record':{ |
| | | router.push({path: '/main/productStock/TransferRecord'}); |
| | | return; |
| | | break; |
| | | } |
| | | case 'rework':{ |
| | | router.push({path: '/main/productStock/FinishedProductRework'}); |
| | | return; |
| | | break; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | |
| | | toolbarConfig: { |
| | | buttons: [{ |
| | | 'name': '确认出库', |
| | | status: 'primary' |
| | | status: 'primary', |
| | | 'code':'ver' |
| | | }], |
| | | import: false, |
| | | export: true, |
| | |
| | | "OrderQuantity": "7", |
| | | "Length": "1230.00", |
| | | "Width": "1075.00", |
| | | "Thickness": "6。700", |
| | | "Thickness": "6.700", |
| | | "TotalQuantity": "100.00", |
| | | "TotalArea": "360.80", |
| | | "BoxNumber": "06", |
| | |
| | | "OrderQuantity": "7", |
| | | "Length": "1230.00", |
| | | "Width": "1075.00", |
| | | "Thickness": "6。700", |
| | | "Thickness": "6.700", |
| | | "TotalQuantity": "100.00", |
| | | "TotalArea": "360.80", |
| | | "BoxNumber": "06", |
| | |
| | | "OrderQuantity": "7", |
| | | "Length": "1230.00", |
| | | "Width": "1075.00", |
| | | "Thickness": "6。700", |
| | | "Thickness": "6.700", |
| | | "TotalQuantity": "100.00", |
| | | "TotalArea": "360.80", |
| | | "BoxNumber": "06", |
| | |
| | | "OrderQuantity": "7", |
| | | "Length": "1230.00", |
| | | "Width": "1075.00", |
| | | "Thickness": "6。700", |
| | | "Thickness": "6.700", |
| | | "TotalQuantity": "100.00", |
| | | "TotalArea": "360.80", |
| | | "BoxNumber": "06", |
| | |
| | | "OrderQuantity": "7", |
| | | "Length": "1230.00", |
| | | "Width": "1075.00", |
| | | "Thickness": "6。700", |
| | | "Thickness": "6.700", |
| | | "TotalQuantity": "100.00", |
| | | "TotalArea": "360.80", |
| | | "BoxNumber": "06", |
| | |
| | | "OrderQuantity": "7", |
| | | "Length": "1230.00", |
| | | "Width": "1075.00", |
| | | "Thickness": "6。700", |
| | | "Thickness": "6.700", |
| | | "TotalQuantity": "100.00", |
| | | "TotalArea": "360.80", |
| | | "BoxNumber": "06", |
| | |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | |
| | | v-on="gridEvents" |
| | | > |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | | <!-- 下拉显示所有信息插槽--> |
| | |
| | | |
| | | <script setup> |
| | | |
| | | import {reactive} from "vue"; |
| | | import {reactive, ref} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | let router=useRouter() |
| | | const getTableRow = (row,type) =>{ |
| | |
| | | break |
| | | } |
| | | } |
| | | } |
| | | const xGrid = ref(); |
| | | const gridEvents = { |
| | | toolbarButtonClick({ code }) { |
| | | const $grid = xGrid.value |
| | | if($grid){ |
| | | switch (code){ |
| | | case 'ver':{ |
| | | alert('我接收到子组件传送的编辑信息') |
| | | // router.push({path: '/main/productStock/OrderAllocation'}); |
| | | // return; |
| | | break |
| | | } |
| | | case 'record':{ |
| | | router.push({path: '/main/productStock/ReworkRecord'}); |
| | | return; |
| | | break; |
| | | } |
| | | case 'rework':{ |
| | | router.push({path: '/main/productStock/FinishedProductRework'}); |
| | | return; |
| | | break; |
| | | } |
| | | } |
| | | } |
| | | }, |
| | | } |
| | | |
| | | |
| | |
| | | ],//表头按钮 |
| | | toolbarConfig: { |
| | | buttons: [{ |
| | | 'name': '返工确认',status: 'primary' |
| | | },{ |
| | | 'name': '返工记录' |
| | | 'name': '返工确认', |
| | | status: 'primary', |
| | | 'code':'ver' |
| | | }, |
| | | { |
| | | 'name': '返工记录', |
| | | 'code':'record' |
| | | }], |
| | | import: false, |
| | | export: true, |
| | |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | |
| | | v-on="gridEvents" |
| | | > |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | | <!-- 下拉显示所有信息插槽--> |
| | |
| | | |
| | | <script setup> |
| | | |
| | | import {reactive} from "vue"; |
| | | import {reactive, ref} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | let router=useRouter() |
| | | const getTableRow = (row,type) =>{ |
| | |
| | | ],//表头按钮 |
| | | toolbarConfig: { |
| | | buttons: [ |
| | | {'name': '确认调架',status: 'primary'}, |
| | | {'name': '调拨记录'} |
| | | {'name': '确认调拨',status: 'primary','code':'edit'}, |
| | | {'name': '调拨记录','code':'record'} |
| | | ], |
| | | import: false, |
| | | export: true, |
| | |
| | | |
| | | }) |
| | | |
| | | |
| | | const xGrid = ref(); |
| | | const gridEvents = { |
| | | toolbarButtonClick({ code }) { |
| | | const $grid = xGrid.value |
| | | if($grid){ |
| | | switch (code){ |
| | | case 'edit':{ |
| | | alert('我接收到子组件传送的编辑信息') |
| | | // router.push({path: '/main/productStock/OrderAllocation'}); |
| | | // return; |
| | | break |
| | | } |
| | | case 'record':{ |
| | | router.push({path: '/main/productStock/TransferRecord'}); |
| | | return; |
| | | break; |
| | | } |
| | | case 'rework':{ |
| | | router.push({path: '/main/productStock/FinishedProductRework'}); |
| | | return; |
| | | break; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | |
| | | </script> |
| | | |
| | |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | |
| | | v-on="gridEvents" |
| | | > |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | | <!-- 下拉显示所有信息插槽--> |
| | |
| | | |
| | | |
| | | const router = useRouter() |
| | | |
| | | let indexFlag=$ref(1) |
| | | function changeRouter(index){ |
| | | indexFlag=index |
| | | } |
| | | </script> |
| | | |
| | | <template> |
| | | <div id="main"> |
| | | <div id="div-title"> |
| | | <el-breadcrumb :separator-icon="ArrowRight"> |
| | | <el-breadcrumb-item :to="{ path: '/main/productStock/ProductStockList' }">库存查询</el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{ path: '/main/productStock/CreateProductStock' }">成品入库</el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{ path: '/main/productStock/FinishedProductOut' }">成品出库</el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{ path: '/main/productStock/FinishedProductReturn' }">订单成品退货</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/productStock/ProductStockList' }">库存查询</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/productStock/CreateProductStock' }">成品入库</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(3)" :class="indexFlag===3?'indexTag':''" :to="{ path: '/main/productStock/FinishedProductOut' }">成品出库</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(4)" :class="indexFlag===4?'indexTag':''" :to="{ path: '/main/productStock/FinishedProductReturn' }">订单成品退货</el-breadcrumb-item> |
| | | <el-breadcrumb-item v-show="false" :to="{ path: '/main/order/orderReport' }">报表</el-breadcrumb-item> |
| | | <!-- <el-breadcrumb-item :to="{ path: '/main/productStock/OrderAllocation' }">订单调拨</el-breadcrumb-item>--> |
| | | <!-- <el-breadcrumb-item :to="{ path: '/main/productStock/FinishedGoodsIssue' }">成品领出</el-breadcrumb-item>--> |
| | |
| | | #select{ |
| | | margin-left:0.5rem; |
| | | } |
| | | :deep(.indexTag .el-breadcrumb__inner){ |
| | | color: #5CADFE !important; |
| | | } |
| | | </style> |
New file |
| | |
| | | <!-- 领出记录 --> |
| | | <script setup> |
| | | |
| | | import {reactive} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | let router=useRouter() |
| | | const getTableRow = (row,type) =>{ |
| | | switch (type) { |
| | | case 'edit' :{ |
| | | //alert('我接收到子组件传送的编辑信息') |
| | | router.push({path: '/main/trader/CreateTrader', query: { id: row.id }}) |
| | | break |
| | | } |
| | | case 'delete':{ |
| | | alert('我接收到子组件传送的删除信息') |
| | | break |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | //子组件接收参数 |
| | | |
| | | const 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:[ |
| | | {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: 'id', width:'150', title: '领出单号', sortable: true,}, |
| | | {field: 'MaterialCode', width: '150',title: '订单号', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'Code', 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: 'Thickness', width: '80',title: '退货单号', sortable: true}, |
| | | {field: 'MainUnit',width: '100', title: '完工数量', sortable: true}, |
| | | {field: 'RecordNum',width: '100', title: '返工数量', sortable: true}, |
| | | {field: 'ProductNum',width: '100', title: '产品编号', sortable: true}, |
| | | {field: 'ProductName',width: '100', title: '产品名称', sortable: true}, |
| | | {field: 'Height', width: '100',title: '长', sortable: true}, |
| | | {field: 'Width',width: '100', title: '宽', sortable: true}, |
| | | {field: 'status', width: '80',title: '审核状态', sortable: true}, |
| | | {field: 'ZhiDanRen', width: '80',title: '制单人', sortable: true}, |
| | | {field: 'SafetyStock', width: '100',title: '制单日期', sortable: true}, |
| | | {field: 'Auditor', width: '100',title: '审核人', sortable: true}, |
| | | {field: 'AuditorDate', width: '100',title: '审核日期', sortable: true}, |
| | | ],//表头按钮 |
| | | toolbarConfig: { |
| | | // buttons: [{ |
| | | // 'name': '新增' |
| | | // }], |
| | | import: false, |
| | | export: true, |
| | | print: true, |
| | | zoom: true, |
| | | custom: true |
| | | }, |
| | | data: [ |
| | | { |
| | | "id": "LC23123011", |
| | | "MaterialCode": "NG23060212", |
| | | "Code": "1", |
| | | "MaterialName": "11月29退货众致", |
| | | "Origin": "智镜", |
| | | "InventoryNumber": '黑点', |
| | | "Thickness": '', |
| | | "MainUnit": "", |
| | | "RecordNum": "876", |
| | | "ProductNum": "0604000108", |
| | | "ProductName": "4mm高性能环保镜", |
| | | "Height": "930.00", |
| | | "Width": "550.00", |
| | | "status": "已审核", |
| | | "ZhiDanRen": "曲慧霞", |
| | | "SafetyStock": "2023-12-30", |
| | | "Auditor": "曲慧霞", |
| | | "AuditorDate": "2023-12-30", |
| | | }, |
| | | { |
| | | "id": "LC23123011", |
| | | "MaterialCode": "NG23060212", |
| | | "Code": "1", |
| | | "MaterialName": "11月29退货众致", |
| | | "Origin": "智镜", |
| | | "InventoryNumber": '黑点', |
| | | "Thickness": '', |
| | | "MainUnit": "", |
| | | "RecordNum": "876", |
| | | "ProductNum": "0604000108", |
| | | "ProductName": "4mm高性能环保镜", |
| | | "Height": "930.00", |
| | | "Width": "550.00", |
| | | "status": "已审核", |
| | | "ZhiDanRen": "曲慧霞", |
| | | "SafetyStock": "2023-12-30", |
| | | "Auditor": "曲慧霞", |
| | | "AuditorDate": "2023-12-30", |
| | | }, |
| | | { |
| | | "id": "LC23123011", |
| | | "MaterialCode": "NG23060212", |
| | | "Code": "1", |
| | | "MaterialName": "11月29退货众致", |
| | | "Origin": "智镜", |
| | | "InventoryNumber": '黑点', |
| | | "Thickness": '', |
| | | "MainUnit": "", |
| | | "RecordNum": "876", |
| | | "ProductNum": "0604000108", |
| | | "ProductName": "4mm高性能环保镜", |
| | | "Height": "930.00", |
| | | "Width": "550.00", |
| | | "status": "已审核", |
| | | "ZhiDanRen": "曲慧霞", |
| | | "SafetyStock": "2023-12-30", |
| | | "Auditor": "曲慧霞", |
| | | "AuditorDate": "2023-12-30", |
| | | }, |
| | | ],//table body实际数据 |
| | | 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 '' |
| | | }) |
| | | ] |
| | | } |
| | | |
| | | }) |
| | | |
| | | |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | | <div class="main-div-customer"> |
| | | <el-row gutter="10" > |
| | | <el-col :span="2.5"> |
| | | <div class="label-text">制单日期范围</div> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-date-picker |
| | | type="daterange" |
| | | start-placeholder="开始时间" |
| | | end-placeholder="结束时间" |
| | | style="width: 200px;" |
| | | /> |
| | | </el-col> |
| | | <el-col span="4"> |
| | | <el-button id="searchButton" type="primary" :icon="Search">查询</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <vxe-grid |
| | | max-height="100%" |
| | | @filter-change="filterChanged" |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | |
| | | > |
| | | <!-- @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> |
| | | </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> |
| | | </div> |
| | | </template> |
| | | |
| | | <style scoped> |
| | | .main-div-customer{ |
| | | width: 99%; |
| | | height: 100%; |
| | | } |
| | | </style> |
New file |
| | |
| | | <!-- 领出记录 --> |
| | | <script setup> |
| | | |
| | | import {reactive} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | let router=useRouter() |
| | | const getTableRow = (row,type) =>{ |
| | | switch (type) { |
| | | case 'edit' :{ |
| | | //alert('我接收到子组件传送的编辑信息') |
| | | router.push({path: '/main/trader/CreateTrader', query: { id: row.id }}) |
| | | break |
| | | } |
| | | case 'delete':{ |
| | | alert('我接收到子组件传送的删除信息') |
| | | break |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | //子组件接收参数 |
| | | |
| | | const 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:[ |
| | | {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: 'id', width:'150', title: '领出单号', sortable: true,}, |
| | | {field: 'MaterialCode', width: '150',title: '原订单号', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'Code', 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: 'Thickness', width: '80',title: '调出数量', sortable: true}, |
| | | {field: 'MainUnit',width: '100', title: '产品编号', sortable: true}, |
| | | {field: 'ProductName',width: '100', title: '产品名称', sortable: true}, |
| | | {field: 'Height', width: '100',title: '长', sortable: true}, |
| | | {field: 'Width',width: '100', title: '宽', sortable: true}, |
| | | {field: 'ZhiDanRen', width: '80',title: '制单人', sortable: true}, |
| | | {field: 'status', width: '80',title: '单据状态', sortable: true}, |
| | | {field: 'SafetyStock', width: '100',title: '制单日期', sortable: true}, |
| | | {field: 'Auditor', width: '100',title: '审核人', sortable: true}, |
| | | {field: 'AuditorDate', width: '100',title: '审核日期', sortable: true}, |
| | | ],//表头按钮 |
| | | toolbarConfig: { |
| | | // buttons: [{ |
| | | // 'name': '新增' |
| | | // }], |
| | | import: false, |
| | | export: true, |
| | | print: true, |
| | | zoom: true, |
| | | custom: true |
| | | }, |
| | | data: [ |
| | | { |
| | | "id": "LC23123011", |
| | | "MaterialCode": "NG23060212", |
| | | "Code": "1", |
| | | "MaterialName": "11月29退货众致", |
| | | "Origin": "补单", |
| | | "InventoryNumber": '退货废弃', |
| | | "Thickness": '876', |
| | | "MainUnit": "0604000108", |
| | | "ProductName": "4mm高性能环保镜", |
| | | "Height": "930.00", |
| | | "Width": "550.00", |
| | | "ZhiDanRen": "曲慧霞", |
| | | "status": "已审核", |
| | | "SafetyStock": "2023-12-30", |
| | | "Auditor": "曲慧霞", |
| | | "AuditorDate": "2023-12-30", |
| | | }, |
| | | { |
| | | "id": "LC23123010", |
| | | "MaterialCode": "NG23060211", |
| | | "Code": "1", |
| | | "MaterialName": "11月29退货众致", |
| | | "Origin": "补单", |
| | | "InventoryNumber": '开介领出', |
| | | "Thickness": '584', |
| | | "MainUnit": "0604000107", |
| | | "ProductName": "5mm环氧树脂镜", |
| | | "Height": "866.00", |
| | | "Width": "486.00", |
| | | "ZhiDanRen": "曲慧霞", |
| | | "status": "已审核", |
| | | "SafetyStock": "2023-12-30", |
| | | "Auditor": "曲慧霞", |
| | | "AuditorDate": "2023-12-30", |
| | | }, |
| | | { |
| | | "id": "LC23123009", |
| | | "MaterialCode": "NG23060210", |
| | | "Code": "1", |
| | | "MaterialName": "11月29退货众致", |
| | | "Origin": "补单", |
| | | "InventoryNumber": '开介领出', |
| | | "Thickness": '584', |
| | | "MainUnit": "0604000106", |
| | | "ProductName": "5mm环氧树脂镜", |
| | | "Height": "866.00", |
| | | "Width": "486.00", |
| | | "ZhiDanRen": "曲慧霞", |
| | | "status": "已审核", |
| | | "SafetyStock": "2023-12-30", |
| | | "Auditor": "曲慧霞", |
| | | "AuditorDate": "2023-12-30", |
| | | }, |
| | | ],//table body实际数据 |
| | | 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 '' |
| | | }) |
| | | ] |
| | | } |
| | | |
| | | }) |
| | | |
| | | |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | | <div class="main-div-customer"> |
| | | <el-row gutter="10" > |
| | | <el-col :span="2.5"> |
| | | <div class="label-text">制单日期范围</div> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-date-picker |
| | | type="daterange" |
| | | start-placeholder="开始时间" |
| | | end-placeholder="结束时间" |
| | | style="width: 200px;" |
| | | /> |
| | | </el-col> |
| | | <el-col span="4"> |
| | | <el-button id="searchButton" type="primary" :icon="Search">查询</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <vxe-grid |
| | | max-height="100%" |
| | | @filter-change="filterChanged" |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | |
| | | > |
| | | <!-- @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> |
| | | </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> |
| | | </div> |
| | | </template> |
| | | |
| | | <style scoped> |
| | | .main-div-customer{ |
| | | width: 99%; |
| | | height: 100%; |
| | | } |
| | | </style> |
New file |
| | |
| | | <!-- 调拨记录 --> |
| | | <script setup> |
| | | |
| | | import {reactive} from "vue"; |
| | | import {useRouter} from 'vue-router' |
| | | let router=useRouter() |
| | | const getTableRow = (row,type) =>{ |
| | | switch (type) { |
| | | case 'edit' :{ |
| | | //alert('我接收到子组件传送的编辑信息') |
| | | router.push({path: '/main/trader/CreateTrader', query: { id: row.id }}) |
| | | break |
| | | } |
| | | case 'delete':{ |
| | | alert('我接收到子组件传送的删除信息') |
| | | break |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | //子组件接收参数 |
| | | |
| | | const 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:[ |
| | | {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: 'id', width:'150', title: 'ID', sortable: true,}, |
| | | {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: 'ZhiDanRen', 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}, |
| | | ],//表头按钮 |
| | | toolbarConfig: { |
| | | // buttons: [{ |
| | | // 'name': '新增' |
| | | // }], |
| | | import: false, |
| | | export: true, |
| | | print: true, |
| | | zoom: true, |
| | | custom: true |
| | | }, |
| | | data: [ |
| | | { |
| | | "id": "3765", |
| | | "MaterialCode": "NG23120709", |
| | | "MaterialName": "9", |
| | | "Origin": "NG23122010", |
| | | "InventoryNumber": "20", |
| | | "Width": '12.00', |
| | | "ZhiDanRen": '刘晓艳', |
| | | "Height": "0601000437", |
| | | "Thickness": "1390.00", |
| | | "MainUnit": "760.00", |
| | | "SafetyStock": "2023-12-30", |
| | | }, |
| | | { |
| | | "id": "3766", |
| | | "MaterialCode": "NG23120709", |
| | | "MaterialName": "9", |
| | | "Origin": "NG23122010", |
| | | "InventoryNumber": "20", |
| | | "Width": '12.00', |
| | | "ZhiDanRen": '刘晓艳', |
| | | "Height": "0601000437", |
| | | "Thickness": "1390.00", |
| | | "MainUnit": "760.00", |
| | | "SafetyStock": "2023-12-30", |
| | | },{ |
| | | "id": "3767", |
| | | "MaterialCode": "NG23120709", |
| | | "MaterialName": "9", |
| | | "Origin": "NG23122010", |
| | | "InventoryNumber": "20", |
| | | "Width": '12.00', |
| | | "ZhiDanRen": '刘晓艳', |
| | | "Height": "0601000437", |
| | | "Thickness": "1390.00", |
| | | "MainUnit": "760.00", |
| | | "SafetyStock": "2023-12-30", |
| | | }, |
| | | ],//table body实际数据 |
| | | 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 '' |
| | | }) |
| | | ] |
| | | } |
| | | |
| | | }) |
| | | |
| | | |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | | <div class="main-div-customer"> |
| | | <el-row gutter="10" > |
| | | <el-col :span="2.5"> |
| | | <div class="label-text">制单日期范围</div> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-date-picker |
| | | type="daterange" |
| | | start-placeholder="开始时间" |
| | | end-placeholder="结束时间" |
| | | style="width: 200px;" |
| | | /> |
| | | </el-col> |
| | | <el-col span="4"> |
| | | <el-button id="searchButton" type="primary" :icon="Search">查询</el-button> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <vxe-grid |
| | | max-height="100%" |
| | | @filter-change="filterChanged" |
| | | class="mytable-scrollbar" |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | |
| | | > |
| | | <!-- @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> |
| | | </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> |
| | | </div> |
| | | </template> |
| | | |
| | | <style scoped> |
| | | .main-div-customer{ |
| | | width: 99%; |
| | | height: 100%; |
| | | } |
| | | </style> |
| | |
| | | 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"}, |
| | | { type: 'seq',fixed:"left", title: '自序', width: '80' }, |
| | | {field: 'supplierCode', width:'150', title: '供应商编号', sortable: true,editRender: { name: 'input', attrs: { placeholder: '' } } }, |
| | | {field: 'supplierName', width: '150',title: '供应商名称', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'agentProduct', width: '120',title: '代理产品', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | |
| | | {field: 'remark',width: '80', title: '备注', sortable: true}, |
| | | ],//表头按钮 |
| | | toolbarConfig: { |
| | | buttons: [{ |
| | | 'name': '新增', |
| | | 'code':'add' |
| | | },], |
| | | // buttons: [{ |
| | | // 'name': '新增', |
| | | // 'code':'add' |
| | | // },], |
| | | import: false, |
| | | export: true, |
| | | print: true, |
| | |
| | | |
| | | |
| | | const router = useRouter() |
| | | |
| | | let indexFlag=$ref(1) |
| | | function changeRouter(index){ |
| | | indexFlag=index |
| | | } |
| | | </script> |
| | | |
| | | <template> |
| | | <div id="main"> |
| | | <div id="div-title"> |
| | | <el-breadcrumb :separator-icon="ArrowRight"> |
| | | <el-breadcrumb-item :to="{ path: '/main/trader/SelectTrader' }">供应商列表</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" :to="{ path: '/main/trader/SelectTrader' }">供应商列表</el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" :to="{ path: '/main/trader/CreateTrader' }">供应商新增</el-breadcrumb-item> |
| | | <el-breadcrumb-item v-show="false" :to="{ path: '/main/order/orderReport' }">报表</el-breadcrumb-item> |
| | | <!-- <el-breadcrumb-item :to="{ path: '/main/trader/CreateTrader' }">创建</el-breadcrumb-item>--> |
| | | </el-breadcrumb> |
| | |
| | | #select{ |
| | | margin-left:0.5rem; |
| | | } |
| | | :deep(.indexTag .el-breadcrumb__inner){ |
| | | color: #5CADFE !important; |
| | | } |
| | | </style> |
| | |
| | | <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>--> |
| | | <!-- <el-button class="mt-4" style="width: 10%" @click="onAddItem" |
| | | >添加 |
| | | </el-button>--> |
| | | |
| | | <vxe-grid |
| | | |
| | |
| | | |
| | | <script setup> |
| | | import {ref, reactive} from 'vue' |
| | | |
| | | let router = useRouter() |
| | | |
| | | //组件接收参数 |
| | |
| | | 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} |
| | | {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'}, |
| | | {type: 'text'}, |
| | | { |
| | | 'name': '新增', |
| | | 'name': '新增', |
| | | |
| | | 'code':'Add', |
| | | }, |
| | | 'code': 'Add', |
| | | }, |
| | | { |
| | | 'name': '移除', |
| | | |
| | | 'code':'Remove' |
| | | 'code': 'Remove' |
| | | }, |
| | | { |
| | | 'name': '保存订单', |
| | | status:'primary', |
| | | 'code':'Save' |
| | | },{ |
| | | status: 'primary', |
| | | 'code': 'Save' |
| | | }, { |
| | | 'name': '入库', |
| | | status:'primary', |
| | | 'code':'Storage' |
| | | status: 'primary', |
| | | 'code': 'Storage' |
| | | }, |
| | | { |
| | | 'name': '退货', |
| | | status:'primary', |
| | | 'code':'Return' |
| | | status: 'primary', |
| | | 'code': 'Return' |
| | | }/*, |
| | | { |
| | | 'name': '返回查询', |
| | |
| | | print: true, |
| | | zoom: true, |
| | | custom: true, |
| | | tools: [ |
| | | |
| | | ], |
| | | tools: [], |
| | | |
| | | },//表头按钮 |
| | | /*data: [{},{},{},{},{},{}],//table body实际数据*/ |
| | | data: [{},{},{}],//table body实际数据 |
| | | data: [{}, {}, {}],//table body实际数据 |
| | | mergeFooterItems: [ |
| | | {row: 0, col: 0, rowspan: 1, colspan: 3} |
| | | ],//合并脚 |
| | |
| | | case 'Save': {//保存 |
| | | |
| | | |
| | | if(form.buyItem === null || form.buyItem === ''){ |
| | | if (form.buyItem === null || form.buyItem === '') { |
| | | openAlert({type: 'message', content: '采购组织不可为空', status: 'warning'}) |
| | | } |
| | | |
| | | return |
| | | return |
| | | |
| | | if(buyerOptions.values() <= 0){ |
| | | if (buyerOptions.values() <= 0) { |
| | | |
| | | } |
| | | |
| | | const type = VXETable.modal.confirm('是否确定保存当前订单信息?'); |
| | | openAlert({type: 'message', content: $grid.rows.number+'', status: 'warning'}) |
| | | return |
| | | const type = VXETable.modal.confirm('是否确定保存当前订单信息?'); |
| | | openAlert({type: 'message', content: $grid.rows.number + '', status: 'warning'}) |
| | | return |
| | | |
| | | break |
| | | } |
| | | case 'GoSelect':{ |
| | | case 'GoSelect': { |
| | | |
| | | router.push({path: '/main/purchaseOrder/SelectPurchaseOrder'}) |
| | | break |
| | |
| | | |
| | | |
| | | const openAlert = (options) => { |
| | | if(options.type==='message'){ |
| | | if (options.type === 'message') { |
| | | VXETable.modal.message(options) |
| | | }else{ |
| | | } else { |
| | | VXETable.modal.alert(options) |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | const form = reactive({ |
| | |
| | | import {VXETable} from "vxe-table"; |
| | | import {useRouter} from "vue-router"; |
| | | |
| | | const now = new Date() |
| | | |
| | | const tableData = ref([ |
| | | { |
| | | wlcode: '202312205101', |
| | | wlname: '这是一个物料名称', |
| | | cd: '产地12', |
| | | hd: '8', |
| | | gd: '2440', |
| | | kd: '3660', |
| | | xh: 'CN10P' |
| | | }, |
| | | { |
| | | wlcode: '202312305101', |
| | | wlname: '这是一个物料名称', |
| | | cd: '产地1', |
| | | gd: '2440', |
| | | kd: '3660', |
| | | hd: '5', |
| | | xh: 'CN10P' |
| | | }, |
| | | { |
| | | wlcode: '202312405101', |
| | | wlname: '这是一个物料名称', |
| | | cd: '产地13', |
| | | hd: '12', |
| | | gd: '2440', |
| | | kd: '3660', |
| | | xh: 'CN10P' |
| | | }, |
| | | ]) |
| | | |
| | | |
| | | const onAddItem = () => { |
| | | now.setDate(now.getDate() + 1) |
| | | tableData.value.push({ |
| | | wlcode: dayjs(now).format('YYYYMMDDss') + '01', |
| | | wlname: '这是一个物料名称', |
| | | cd: '产地1', |
| | | hd: '6', |
| | | xh: 'CN10P', |
| | | gd: '2440', |
| | | kd: '3660', |
| | | }) |
| | | } |
| | | |
| | | /*const deleteRow = (index: number) => { |
| | | tableData.value.splice(index, 1) |
| | | }*/ |
| | | |
| | | </script> |
| | | |
New file |
| | |
| | | <template> |
| | | <el-header height="auto"> |
| | | |
| | | |
| | | </el-header> |
| | | |
| | | <el-main style="padding-top: 5px;height:100%"> |
| | | |
| | | <!-- 创建表头模拟样式一--> |
| | | <div>创建表头类一</div> |
| | | <el-form label-width="100px" :inline="true" :model="formInline" class="demo-form-inline"> |
| | | <div class="order-primary" style="background-color: white; border: #181818 1px solid"> |
| | | <el-row> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>*项目名称:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-input/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>*客户选择:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-select clearable placeholder=" "> |
| | | <el-option/> |
| | | </el-select> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>*订单类型:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-select clearable placeholder=" "> |
| | | <el-option/> |
| | | </el-select> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>订单分类:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-select clearable placeholder=" "> |
| | | <el-option/> |
| | | </el-select> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>商标选项:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-select clearable placeholder=" "> |
| | | <el-option/> |
| | | </el-select> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>包装方式:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-select clearable placeholder=" "> |
| | | <el-option/> |
| | | </el-select> |
| | | </el-col> |
| | | <!-- <el-col :span="2"><el-text /></el-col>--> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>销售单号:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>交货日期:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-date-picker |
| | | type="week" |
| | | format="[Week] ww" |
| | | placeholder="选择日期" style="width: 100%"/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>批次:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-input/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>计算方式:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-select clearable placeholder=" "> |
| | | <el-option/> |
| | | </el-select> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>*业务员:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-select clearable placeholder=" "> |
| | | <el-option/> |
| | | </el-select> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>铝条方式:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-select clearable placeholder=" "> |
| | | <el-option/> |
| | | </el-select> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>总金额:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text/> |
| | | </el-col> |
| | | |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>合同编号:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-input/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>客户批次:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>联系人:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-input/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>联系电话:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-input/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>送货地址:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-input/> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>其他金额:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text/> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text>其他金额备注:</el-text> |
| | | </el-col> |
| | | <el-col class="elcolStyle" :span="2"> |
| | | <el-text/> |
| | | </el-col> |
| | | |
| | | </el-row> |
| | | </div> |
| | | </el-form> |
| | | |
| | | <br/> |
| | | <div>创建表头类二</div> |
| | | <!-- 创建表头模拟样式二--> |
| | | <!-- <el-form label-width="80px" :inline="true" :model="formInline2" class="demo-form-inline">--> |
| | | <div class="header2"> |
| | | <el-row :gutter="10" style="height: 35px"> |
| | | <el-col :span="4"> |
| | | <el-form-item label="项目名称" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item label="客户选择" class="item-style" prop="name"> |
| | | <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="4"> |
| | | <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="4"> |
| | | <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-col :span="4"> |
| | | <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-col :span="4"> |
| | | <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" style="height: 35px"> |
| | | <el-col :span="4"> |
| | | <el-form-item label="销售单号" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item label="交货日期" class="item-style"> |
| | | <el-date-picker |
| | | type="week" |
| | | format="[Week] ww" |
| | | placeholder="选择日期" style="width: 100%"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item label="订单批次" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <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-col :span="4"> |
| | | <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-col :span="4"> |
| | | <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" style="height: 35px"> |
| | | <el-col :span="4"> |
| | | <el-form-item label="总金额" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item label="合同编号" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item label="客户批次" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item label="联系人" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item label="联系电话" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="4"> |
| | | <el-form-item label="送货地址" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row :gutter="10" style="height: 35px"> |
| | | <el-col :span="4"> |
| | | <el-form-item label="其他金额" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | <!-- <el-col :span="4"> |
| | | <span>其他金额备注</span> |
| | | <el-input ></el-input> |
| | | </el-col>--> |
| | | <el-col :span="4"> |
| | | <el-form-item label="其他金额备注" class="item-style"> |
| | | <el-input></el-input> |
| | | </el-form-item> |
| | | </el-col> |
| | | |
| | | </el-row> |
| | | |
| | | </div> |
| | | <!-- </el-form>--> |
| | | |
| | | <!-- 创建表头模拟样式三--> |
| | | <br/> |
| | | <div>创建表头类三</div> |
| | | <!-- <el-form label-width="100px" :inline="true" :model="formInline3" class="demo-form-inline">--> |
| | | <el-descriptions |
| | | class="margin-top" |
| | | title="" |
| | | :column="6" |
| | | :size="'small'" |
| | | border |
| | | > |
| | | |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 项目名称 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 客户选择 |
| | | </template> |
| | | <el-select></el-select> |
| | | |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 订单类型 |
| | | </template> |
| | | <el-select></el-select> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 订单分类 |
| | | </template> |
| | | <el-select></el-select> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 商标选项 |
| | | </template> |
| | | <el-select></el-select> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 包装方式 |
| | | </template> |
| | | <el-select></el-select> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 销售单号 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 交货日期 |
| | | </template> |
| | | <el-date-picker |
| | | type="week" |
| | | format="[Week] ww" |
| | | placeholder="选择日期" style="width: 100%"/> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 批次 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 计算方式 |
| | | </template> |
| | | <el-select></el-select> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | <span style="color:red">*</span> |
| | | 业务员 |
| | | </template> |
| | | <el-select></el-select> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | 铝条方式 |
| | | </template> |
| | | <el-select></el-select> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | 总金额 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | 合同编号 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | 客户批次 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | 联系人 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | 联系电话 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | 送货地址 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | |
| | | 其他金额 |
| | | </template> |
| | | <el-input></el-input> |
| | | </el-descriptions-item> |
| | | <el-descriptions-item> |
| | | <template #label> |
| | | 其他金额备注 |
| | | </template> |
| | | <el-input /> |
| | | </el-descriptions-item> |
| | | |
| | | <el-descriptions-item></el-descriptions-item> |
| | | <!-- <el-descriptions-item></el-descriptions-item> |
| | | <el-descriptions-item></el-descriptions-item> |
| | | <el-descriptions-item></el-descriptions-item> |
| | | <el-descriptions-item></el-descriptions-item>--> |
| | | </el-descriptions> |
| | | |
| | | <!-- </el-form>--> |
| | | </el-main> |
| | | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import {ref, reactive} from 'vue' |
| | | |
| | | let router = useRouter() |
| | | |
| | | |
| | | const openAlert = (options) => { |
| | | if (options.type === 'message') { |
| | | VXETable.modal.message(options) |
| | | } else { |
| | | VXETable.modal.alert(options) |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | const form = reactive({ |
| | | name: '', |
| | | region: '', |
| | | date: '', |
| | | delivery: false, |
| | | type: [], |
| | | resource: '', |
| | | desc: '', |
| | | supplier: '', |
| | | buyer: '', |
| | | buyItem: '', |
| | | buyType: '' |
| | | |
| | | }) |
| | | |
| | | const onSubmit = () => { |
| | | console.log('submit!') |
| | | } |
| | | |
| | | //供应商 |
| | | const buyerOptions = [ |
| | | {value: '0', label: '供应商1'}, |
| | | {value: '1', label: '供应商2'}, |
| | | {value: '2', label: '供应商3'}, |
| | | {value: '3', label: '供应商4'}, |
| | | {value: '4', label: '供应商5'}, |
| | | {value: '5', label: '供应商6'}, |
| | | ] |
| | | |
| | | |
| | | const value = ref('') |
| | | const cgBuMen = ref('') |
| | | |
| | | //采购类型 |
| | | const CGTypeOptions = [ |
| | | { |
| | | value: '1', |
| | | label: '标准类型', |
| | | }, |
| | | { |
| | | value: '2', |
| | | label: '非标准类型', |
| | | }, |
| | | { |
| | | value: '3', |
| | | label: '追加采购', |
| | | }, |
| | | |
| | | ] |
| | | |
| | | //采购部门 |
| | | const CGBuMenOptions = [ |
| | | { |
| | | value: '0', |
| | | label: '采购华北部', |
| | | }, |
| | | { |
| | | value: '1', |
| | | label: '采购东南部', |
| | | }, |
| | | { |
| | | value: '2', |
| | | label: '采购西北部', |
| | | }, |
| | | { |
| | | value: '3', |
| | | label: '采购中原部', |
| | | }, |
| | | { |
| | | value: '4', |
| | | label: '采购外国部', |
| | | }, |
| | | |
| | | ] |
| | | |
| | | //采购人 |
| | | const BuyerOptions = [ |
| | | { |
| | | value: '0', |
| | | label: '采购员1', |
| | | }, |
| | | { |
| | | value: '1', |
| | | label: '采购员2', |
| | | }, |
| | | { |
| | | value: '2', |
| | | label: '采购员3', |
| | | }, |
| | | { |
| | | value: '3', |
| | | label: '采购员4', |
| | | }, |
| | | { |
| | | value: '4', |
| | | label: '采购员5', |
| | | }, |
| | | |
| | | ] |
| | | |
| | | import dayjs from 'dayjs' |
| | | import {VXETable} from "vxe-table"; |
| | | import {useRouter} from "vue-router"; |
| | | import {User} from "@element-plus/icons-vue"; |
| | | |
| | | const now = new Date() |
| | | |
| | | const tableData = ref([ |
| | | { |
| | | wlcode: '202312205101', |
| | | wlname: '这是一个物料名称', |
| | | cd: '产地12', |
| | | hd: '8', |
| | | gd: '2440', |
| | | kd: '3660', |
| | | xh: 'CN10P' |
| | | }, |
| | | { |
| | | wlcode: '202312305101', |
| | | wlname: '这是一个物料名称', |
| | | cd: '产地1', |
| | | gd: '2440', |
| | | kd: '3660', |
| | | hd: '5', |
| | | xh: 'CN10P' |
| | | }, |
| | | { |
| | | wlcode: '202312405101', |
| | | wlname: '这是一个物料名称', |
| | | cd: '产地13', |
| | | hd: '12', |
| | | gd: '2440', |
| | | kd: '3660', |
| | | xh: 'CN10P' |
| | | }, |
| | | ]) |
| | | |
| | | |
| | | const onAddItem = () => { |
| | | now.setDate(now.getDate() + 1) |
| | | tableData.value.push({ |
| | | wlcode: dayjs(now).format('YYYYMMDDss') + '01', |
| | | wlname: '这是一个物料名称', |
| | | cd: '产地1', |
| | | hd: '6', |
| | | xh: 'CN10P', |
| | | gd: '2440', |
| | | kd: '3660', |
| | | }) |
| | | } |
| | | |
| | | |
| | | </script> |
| | | |
| | | |
| | | <style scoped> |
| | | .custom-header { |
| | | .el-checkbox { |
| | | display: flex; |
| | | height: unset; |
| | | } |
| | | } |
| | | |
| | | .item-style { |
| | | width: 92%; |
| | | } |
| | | |
| | | |
| | | .main-div { |
| | | width: 100%; |
| | | height: 100%; |
| | | text-align: center; |
| | | } |
| | | |
| | | /*.el-col{ |
| | | border: #181818 1px solid; |
| | | }*/ |
| | | |
| | | .elcolStyle { |
| | | border: #181818 1px solid; |
| | | } |
| | | |
| | | header2 :deep(.el-col) { |
| | | padding: 0; |
| | | margin: 0; |
| | | //height: 35px; color: red; |
| | | |
| | | } |
| | | |
| | | order-primary :deep(.el-input__wrapper) { |
| | | box-shadow: 0 0 0 0 var(--el-input-border-color, var(--el-border-color)) inset; |
| | | cursor: default; |
| | | border: none !important; |
| | | background-color: transparent; |
| | | } |
| | | |
| | | .order-primary { |
| | | width: 100%; |
| | | } |
| | | |
| | | .order-detail { |
| | | width: 100%; |
| | | height: 80%; |
| | | } |
| | | |
| | | /*.cell-item { |
| | | display: flex; |
| | | align-items: center; |
| | | }*/ |
| | | |
| | | :deep(.el-descriptions__label) { |
| | | width: 90px; |
| | | text-align: center; |
| | | } |
| | | </style> |
| | |
| | | <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 :to="{path:'/main/purchaseOrder/SelectPurchaseOrder'}">查询采购订单 |
| | | <el-breadcrumb :separator-icon="ArrowRight"> |
| | | <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" |
| | | :to="{path:'/main/purchaseOrder/SelectPurchaseOrder'}">查询采购订单 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{path:'/main/purchaseOrder/CreatePurchaseOrder'}">创建采购订单 |
| | | <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" |
| | | :to="{path:'/main/purchaseOrder/CreatePurchaseOrder'}">创建采购订单 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{path:'/main/purchaseOrder/StoragePurchaseOrder'}">采购入库 |
| | | <el-breadcrumb-item @click="changeRouter(3)" :class="indexFlag===3?'indexTag':''" |
| | | :to="{path:'/main/purchaseOrder/StoragePurchaseOrder'}">采购入库 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{path:'/main/purchaseOrder/ReturnPurchaseOrder'}">采购退货 |
| | | <el-breadcrumb-item @click="changeRouter(4)" :class="indexFlag===4?'indexTag':''" |
| | | :to="{path:'/main/purchaseOrder/ReturnPurchaseOrder'}">采购退货 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{path:'/main/purchaseOrder/PaymentPurchaseOrder'}">应付采购订单 |
| | | <el-breadcrumb-item @click="changeRouter(5)" :class="indexFlag===5?'indexTag':''" |
| | | :to="{path:'/main/purchaseOrder/PaymentPurchaseOrder'}">应付采购订单 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item @click="changeRouter(6)" :class="indexFlag===6?'indexTag':''" |
| | | :to="{path:'/main/purchaseOrder/CreateHeader'}">创建头模拟 |
| | | </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> |
| | | |
| | | |
| | |
| | | <script setup> |
| | | import {nextTick, ref} from 'vue' |
| | | import {ArrowRight, Search} from "@element-plus/icons-vue"; |
| | | |
| | | let indexFlag = $ref(1) |
| | | |
| | | function changeRouter(index) { |
| | | indexFlag = index |
| | | } |
| | | |
| | | </script> |
| | | |
| | | |
| | | <style scoped> |
| | | |
| | | :deep(.indexTag .el-breadcrumb__inner) { |
| | | color: #5CADFE !important; |
| | | font-weight: 900; |
| | | } |
| | | </style> |
| | |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | v-on="gridEvents" |
| | | @cell-dblclick="cellClickEvent" |
| | | > |
| | | |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | |
| | | </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> |
| | | <!-- 详情框 部分1--> |
| | | <vxe-modal v-model="showDetails" title="查看详情" width="600" height="80%" :mask="false" :lock-view="false" resize> |
| | | <el-container > |
| | | <el-header height="35px" |
| | | style="margin: 0;padding: 0"> |
| | | |
| | | <el-input v-model="showCGDH" placeholder="采购单号" disabled > |
| | | <template #prepend>采购单号:</template> |
| | | </el-input> |
| | | </el-header> |
| | | <el-main> |
| | | <template #default> |
| | | <vxe-table |
| | | border="default" |
| | | auto-resize |
| | | show-overflow |
| | | max-height="400" |
| | | :row-config="{isHover: true}" |
| | | :show-header="false" |
| | | :sync-resize="showDetails" |
| | | :data="detailData" |
| | | |
| | | > |
| | | <vxe-column field="label" width="30%" class-name="v-column-label"></vxe-column> |
| | | <vxe-column field="value"></vxe-column> |
| | | </vxe-table> |
| | | </template> |
| | | </el-main> |
| | | <el-footer height="40px"> |
| | | <el-row> |
| | | <el-col :offset="20" :span="4"> |
| | | <el-button |
| | | id="Sure" |
| | | type="primary" |
| | | @click="SureReturn" |
| | | >确认退货 |
| | | </el-button> |
| | | </el-col> |
| | | |
| | | </el-row> |
| | | </el-footer> |
| | | </el-container> |
| | | </vxe-modal> |
| | | |
| | | |
| | | <!-- 详情框 部分1 结束--> |
| | | </el-main> |
| | | </el-container> |
| | | </template> |
| | |
| | | |
| | | }) |
| | | |
| | | /*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] } |
| | | |
| | | //详情框 部分2 |
| | | const showCGDH =ref(); |
| | | const showDetails =ref(false); |
| | | let detailData =[]; |
| | | const cellClickEvent = ({row}) => { |
| | | detailData = ['cgdh', 'thdh', 'h', 'xh', 'wlbh', 'wlmc', 'gys','w','g','dw','cgzt','rq','yl','sl','xsdh','je','6'].map(field => { |
| | | return { label: ModelColumnContent(field) , value: row[field] } |
| | | |
| | | }) |
| | | showDetails.value = true |
| | | }*/ |
| | | showDetails.value = true; |
| | | showCGDH.value = row['cgdh']; |
| | | } |
| | | |
| | | const ModelColumnContent = (text) => { |
| | | switch (text) { |
| | | case 'cgdh': |
| | | return "采购单号"; |
| | | case 'thdh': |
| | | return "退货单号"; |
| | | case 'h': |
| | | return "厚"; |
| | | case 'xh': |
| | | return "型号"; |
| | | case 'wlbh': |
| | | return "物料编码"; |
| | | case 'wlmc': |
| | | return "物料名称"; |
| | | case 'gys': |
| | | return "供应商"; |
| | | case 'w': |
| | | return "宽"; |
| | | case 'g': |
| | | return "高"; |
| | | case 'dw': |
| | | return "单位"; |
| | | case 'cgzt': |
| | | return "采购状态"; |
| | | case 'rq': |
| | | return "日期"; |
| | | case 'yl': |
| | | return "余量"; |
| | | case 'sl': |
| | | return "数量"; |
| | | case 'xsdh': |
| | | return "销售单号"; |
| | | case 'je': |
| | | return "金额"; |
| | | case '6': |
| | | return "其他"; |
| | | |
| | | default: |
| | | return text; |
| | | |
| | | } |
| | | |
| | | } |
| | | |
| | | const SureReturn=()=>{ |
| | | |
| | | const type = VXETable.modal.confirm('是否确认退货?'); |
| | | } |
| | | |
| | | //详情框 部分2 结束 |
| | | |
| | | |
| | | const now = new Date() |
| | |
| | | |
| | | |
| | | <style scoped> |
| | | |
| | | :deep(.v-column-label div span){ |
| | | font-weight: bold; |
| | | font-align:center; |
| | | } |
| | | </style> |
| | |
| | | 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" |
| | |
| | | @click="BtnSearchPurchaseOrder">查询 |
| | | </el-button> |
| | | </el-col> |
| | | |
| | | </el-row> |
| | | |
| | | |
| | | |
| | | |
| | | </el-header> |
| | | <el-main style="padding-top: 5px;height:100%"> |
| | | <vxe-grid |
| | |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | v-on="gridEvents" |
| | | |
| | | @cell-click ="cellClickEvent" |
| | | > |
| | | |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | |
| | | <!--左边固定显示的插槽--> |
| | | <template #button_slot="{ row }"> |
| | | <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">编辑</el-button> |
| | | <el-button @click="getTableRow(row,'look')" 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> |
| | | </vxe-grid> |
| | | |
| | | <!-- 详情框 部分1--> |
| | | <vxe-modal v-model="showDetails" title="查看详情" width="600" height="80%" :mask="false" :lock-view="false" resize> |
| | | <el-container > |
| | | <el-header height="35px" |
| | | style="margin: 0;padding: 0"> |
| | | |
| | | <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> |
| | | <el-input v-model="showCGDH" placeholder="采购单号" disabled > |
| | | <template #prepend>采购单号:</template> |
| | | </el-input> |
| | | </el-header> |
| | | <el-main> |
| | | <template #default> |
| | | <vxe-table |
| | | border="inner" |
| | | auto-resize |
| | | show-overflow |
| | | max-height="420" |
| | | :row-config="{isHover: true}" |
| | | :show-header="false" |
| | | :sync-resize="showDetails" |
| | | :data="detailData"> |
| | | <vxe-column field="label" width="30%" class-name="v-column-label"></vxe-column> |
| | | <vxe-column field="value"></vxe-column> |
| | | </vxe-table> |
| | | </template> |
| | | </el-main> |
| | | <el-footer height="40px"> |
| | | <el-row> |
| | | <el-col :offset="20" :span="4"> |
| | | <el-button |
| | | id="Sure" |
| | | type="primary" |
| | | @click="SureStorage" |
| | | >确认入库 |
| | | </el-button> |
| | | </el-col> |
| | | |
| | | </el-row> |
| | | </el-footer> |
| | | </el-container> |
| | | </vxe-modal> |
| | | <!-- 详情框 部分1 结束--> |
| | | |
| | | |
| | | </el-main> |
| | | </el-container> |
| | | |
| | | |
| | | |
| | | |
| | | </template> |
| | | |
| | | |
| | |
| | | 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}}) |
| | | router.push({path: '/main/purchaseOrder/CreatePurchaseOrder', query: {id: row.id}}); |
| | | |
| | | break |
| | | } |
| | | case 'look':{ |
| | | /*this.detailData = ['name', 'nickname', 'role', 'sex', 'age', 'amount', 'address'].map(field => { |
| | | return { label: field, value: row[field] } |
| | | })*/ |
| | | //this.showDetails = true |
| | | break |
| | | } |
| | | case 'delete': { |
| | | |
| | | |
| | | |
| | | alert('我接收到子组件传送的删除信息'+row.id) |
| | | break |
| | | } |
| | |
| | | exportConfig: {}, |
| | | scrollY: {enabled: true},//开启虚拟滚动 |
| | | showOverflow: true, |
| | | //showDetails: false,//弹窗 是否显示 |
| | | columnConfig: { |
| | | resizable: true, |
| | | useKey: true |
| | |
| | | |
| | | }) |
| | | |
| | | /*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 showCGDH = ref(); |
| | | |
| | | //详情框 部分2 |
| | | const showDetails =ref(false); |
| | | let detailData =[]; |
| | | const cellClickEvent = ({row}) => { |
| | | detailData = ['cgdh', 'rkdh', 'h', 'xh', 'wlbh', 'wlmc', 'gys','w','g','dw','cgzt','rq','yl','sl','xsdh','je','6'].map(field => { |
| | | return { label: ModelColumnContent(field) , value: row[field] } |
| | | }) |
| | | |
| | | showDetails.value = true; |
| | | showCGDH.value = row['cgdh']; |
| | | } |
| | | |
| | | const ModelColumnContent = (text) => { |
| | | switch (text) { |
| | | case 'cgdh': |
| | | return "采购单号"; |
| | | case 'rkdh': |
| | | return "入库单号"; |
| | | case 'h': |
| | | return "厚"; |
| | | case 'xh': |
| | | return "型号"; |
| | | case 'wlbh': |
| | | return "物料编码"; |
| | | case 'wlmc': |
| | | return "物料名称"; |
| | | case 'gys': |
| | | return "供应商"; |
| | | case 'w': |
| | | return "宽"; |
| | | case 'g': |
| | | return "高"; |
| | | case 'dw': |
| | | return "单位"; |
| | | case 'cgzt': |
| | | return "采购状态"; |
| | | case 'rq': |
| | | return "日期"; |
| | | case 'yl': |
| | | return "余量"; |
| | | case 'sl': |
| | | return "数量"; |
| | | case 'xsdh': |
| | | return "销售单号"; |
| | | case 'je': |
| | | return "金额"; |
| | | case '6': |
| | | return "其他"; |
| | | |
| | | default: |
| | | return text; |
| | | |
| | | } |
| | | |
| | | } |
| | | //详情框 部分2 结束 |
| | | |
| | | const SureStorage=()=>{ |
| | | |
| | | openAlert({type: 'alert', content: '确认入库成功', status: 'success'}) |
| | | |
| | | } |
| | | |
| | | const now = new Date() |
| | | |
| | |
| | | |
| | | |
| | | <style scoped> |
| | | :deep(.v-column-label div span){ |
| | | font-weight: bold; |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | </style> |
| | |
| | | <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 :to="{path:'/main/stockReport/WarehouseReport'}">原材料报表 |
| | | <el-breadcrumb-item @click="changeRouter(1)" :class="indexFlag===1?'indexTag':''" |
| | | :to="{path:'/main/stockReport/WarehouseReport'}">原材料报表 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{path:'/main/stockReport/StockWarehouseReport'}">成品报表 |
| | | <el-breadcrumb-item @click="changeRouter(2)" :class="indexFlag===2?'indexTag':''" |
| | | :to="{path:'/main/stockReport/StockWarehouseReport'}">成品报表 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{path:'/main/stockReport/StockMonthReport'}">原片月结 |
| | | <el-breadcrumb-item @click="changeRouter(3)" :class="indexFlag===3?'indexTag':''" |
| | | :to="{path:'/main/stockReport/StockMonthReport'}">原片月结 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item :to="{path:'/main/stockReport/SubsidiaryMonthReport'}"> |
| | | <el-breadcrumb-item @click="changeRouter(4)" :class="indexFlag===4?'indexTag':''" |
| | | :to="{path:'/main/stockReport/SubsidiaryMonthReport'}"> |
| | | 辅料月结 |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item style="display: none"></el-breadcrumb-item> |
| | |
| | | </div> |
| | | |
| | | </template> |
| | | |
| | | <script setup> |
| | | import {nextTick, ref} from 'vue' |
| | | import {ArrowRight, Search} from "@element-plus/icons-vue"; |
| | | |
| | | import {ArrowRight} from "@element-plus/icons-vue"; |
| | | let indexFlag = $ref(1) |
| | | |
| | | import {useRouter} from "vue-router"; |
| | | function changeRouter(index) { |
| | | indexFlag = index |
| | | } |
| | | |
| | | const router = useRouter(); |
| | | </script> |
| | | |
| | | |
| | | <style scoped> |
| | | .ei-1 { |
| | | font-weight: 500; |
| | | :deep(.indexTag .el-breadcrumb__inner) { |
| | | color: #5CADFE !important; |
| | | font-weight: 900; |
| | | } |
| | | |
| | | </style> |
| | |
| | | <el-header class="m-header" style="height: auto"> |
| | | |
| | | </el-header> |
| | | |
| | | <el-main style="padding-top: 5px"> |
| | | <vxe-grid |
| | | max-height="600" |
| | |
| | | ref="xGrid" |
| | | v-bind="gridOptions" |
| | | v-on="gridEvents" |
| | | @cell-dblclick="cellClickEvent" |
| | | > |
| | | |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | |
| | | </div> |
| | | </template> |
| | | </vxe-grid> |
| | | |
| | | <!-- 详情框 部分1--> |
| | | <vxe-modal v-model="showDetails" title="查看详情" width="600" height="80%" :mask="false" :lock-view="false" resize> |
| | | <el-container > |
| | | <el-header height="35px" |
| | | style="margin: 0;padding: 0"> |
| | | |
| | | <el-input v-model="showNum" placeholder="采购单号" disabled > |
| | | <template #prepend>物料编码</template> |
| | | </el-input> |
| | | </el-header> |
| | | <el-main> |
| | | <template #default> |
| | | <vxe-table |
| | | border="default" |
| | | auto-resize |
| | | show-overflow |
| | | max-height="400" |
| | | :row-config="{isHover: true}" |
| | | :show-header="false" |
| | | :sync-resize="showDetails" |
| | | :data="detailData" |
| | | > |
| | | <vxe-column field="label" width="30%" class-name="v-column-label"></vxe-column> |
| | | <vxe-column field="value"></vxe-column> |
| | | </vxe-table> |
| | | </template> |
| | | </el-main> |
| | | <el-footer height="40px"> |
| | | <!-- <el-row> |
| | | <el-col :offset="20" :span="4"> |
| | | <el-button |
| | | id="Sure" |
| | | type="primary" |
| | | @click="SureReturn" |
| | | >确认退货 |
| | | </el-button> |
| | | </el-col> |
| | | |
| | | </el-row>--> |
| | | </el-footer> |
| | | </el-container> |
| | | </vxe-modal> |
| | | <!-- 详情框 部分1 结束--> |
| | | |
| | | </el-main> |
| | | </div> |
| | | </template> |
| | |
| | | showStatus: true |
| | | }, |
| | | columns: [ |
| | | |
| | | {type: 'expand', title:'', fixed: "left", slots: {content: 'content'}, width: 50},/* 详情 */ |
| | | /* {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}, |
| | |
| | | }, |
| | | }) |
| | | |
| | | |
| | | //列表操作 |
| | | const getTableRow = (row, type) => { |
| | | switch (type) { |
| | | case 'edit' : { |
| | |
| | | //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 |
| | |
| | | }, |
| | | } |
| | | |
| | | |
| | | const showNum =ref(); |
| | | const showDetails =ref(false); |
| | | let detailData =[]; |
| | | |
| | | const cellClickEvent = ({row}) => { |
| | | detailData = cName.map(field => { |
| | | return { label: ModelColumnContent(field) , value: row[field] } |
| | | |
| | | }) |
| | | |
| | | |
| | | showDetails.value = true; |
| | | showNum.value = row['wlbm']; |
| | | |
| | | } |
| | | const cName = ['kczz','wlbm','wlmc','cd','kcbh','w','g','h','zdw','aqkc','kcs','kykc','wlsl','zmj', 'dpmj','scrq','bzq','kq','kw','jykc','bz']; |
| | | const ModelColumnContent = (text) => { |
| | | switch (text) { |
| | | case 'kczz': |
| | | return "库存组织"; |
| | | case 'wlbm': |
| | | return "物料编码"; |
| | | case 'wlmc': |
| | | return "物料名称"; |
| | | case 'cd': |
| | | return "产地"; |
| | | case 'kcbh': |
| | | return "库存编号"; |
| | | case 'w': |
| | | return "宽"; |
| | | case 'g': |
| | | return "高"; |
| | | case 'h': |
| | | return "厚"; |
| | | case 'zdw': |
| | | return "主单位"; |
| | | case 'aqkc': |
| | | return "安全库存"; |
| | | case 'kcs': |
| | | return "库存数"; |
| | | case 'kykc': |
| | | return "可用库存"; |
| | | case 'wlsl': |
| | | return "未领数量"; |
| | | case 'zmj': |
| | | return "总面积"; |
| | | case 'dpmj': |
| | | return "单片面积"; |
| | | case 'scrq': |
| | | return "生产日期"; |
| | | case 'bzq': return "保质期"; |
| | | case 'kq': return "库区"; |
| | | case 'kw': return "库位"; |
| | | case 'jykc': return "积压库存"; |
| | | case 'bz': |
| | | return "备注"; |
| | | default: |
| | | return text; |
| | | |
| | | } |
| | | |
| | | } |
| | | |
| | | |
| | | |
| | | const openAlert = (options) => { |
| | | if(options.type==='message'){ |
| | | VXETable.modal.message(options) |
| | |
| | | > |
| | | <!-- @toolbar-button-click="toolbarButtonClickEvent"--> |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row}"> |
| | | <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 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> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | |
| | | |
| | | > |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row}"> |
| | | <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 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> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | |
| | | |
| | | > |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row}"> |
| | | <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 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> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | |
| | | |
| | | > |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row}"> |
| | | <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 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> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | |
| | | <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 :to="{ path: '/main/product/testSort' }">测试</el-breadcrumb-item> |
| | | <el-breadcrumb-item v-show="false" :to="{ path: '/main/product/test1' }">测试</el-breadcrumb-item> |
| | | </el-breadcrumb> |
| | | |
| | |
| | | <script setup> |
| | | <script lang="ts" setup> |
| | | import request from "@/utils/request" |
| | | import deepClone from "@/utils/deepClone" |
| | | import {ElDatePicker, ElMessage} from "element-plus" |
| | | import useProductGlassTypeStore from "@/stores/sd/product/productGlassType" |
| | | import useProductStore from "@/stores/sd/product/prduct" |
| | | import {onMounted, reactive, ref, watch} from "vue" |
| | | import {nextTick, onMounted, onUnmounted, 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 Sortable from 'sortablejs' |
| | | import BasicTable from '@/components/basic/BasicTable.vue' |
| | | import scrollEvnt from "@/hook"; |
| | | import {VXETable} from "vxe-table"; |
| | | let productGlassTypeStore = useProductGlassTypeStore() |
| | | let productStore = useProductStore() |
| | | let router=useRouter() |
| | | //监听玻璃类型改变 |
| | | watch(productGlassTypeStore,(newVal,oldVal) => { |
| | |
| | | }) |
| | | }) |
| | | |
| | | let scrollTop =ref(null) |
| | | let scrollHeight =ref(null) |
| | | let clientHeight =ref(null) |
| | | const scrollEvnt = (row) => { |
| | | // 内容高度 |
| | | scrollTop.value = row.$event.target.scrollTop |
| | | scrollHeight.value = row.$event.target.scrollHeight |
| | | clientHeight.value = row.$event.target.clientHeight |
| | | } |
| | | |
| | | |
| | | let produceList = ref([]) |
| | | let pageNum=$ref(1) |
| | | watch(productStore,(newVal,oldVal) => { |
| | | if(newVal.flag===true){ |
| | | pageNum=pageNum+1 |
| | | let pageState = null |
| | | //监听产品滚动条状态,滚动到底部向后端请求数据 |
| | | watch(scrollTop,(newVal,oldVal) => { |
| | | //判断当前状态查询状态 |
| | | if(pageState!==null){ |
| | | return; |
| | | } |
| | | //判断滚动条上下滚动不是左右滚动,当左右滚动直接返回 |
| | | if((newVal === oldVal && newVal===0) || oldVal===null){ |
| | | return; |
| | | } |
| | | //判断是否滚到底部 |
| | | if ((Math.round(scrollTop.value + clientHeight.value)+5 >= scrollHeight.value ) ) { |
| | | if(newVal>oldVal){ |
| | | //判断当前容器长度是否为500,并且当前页小于容器总数量 |
| | | if(produceList.length===500 && pageNum<(produceList.length/100)){ |
| | | pageNum=pageNum+5 |
| | | }else{ |
| | | pageNum=pageNum+1 |
| | | } |
| | | pageState=true |
| | | } |
| | | }else if(newVal===0 && oldVal>0 && pageNum>1 ){ //判断是否滚到顶部并且大于容器数量 |
| | | //判断向上滚动当前页数是否大于容器数值 |
| | | if(pageNum>5){ |
| | | pageNum=pageNum-5 |
| | | }else if((produceList.length/100)>=5) { |
| | | pageNum=pageNum-1 |
| | | }else{ |
| | | return |
| | | } |
| | | pageState =false |
| | | } |
| | | if(pageState!==null){ |
| | | gridOptions.loading=true |
| | | request.get(`/product/${pageNum}/100`).then((res) => { |
| | | try{ |
| | | if(res.code==200){ |
| | | if(pageState){ |
| | | produceList = produceList.concat(res.data) |
| | | if(produceList.length>500){ |
| | | produceList=produceList.slice(100,600) |
| | | } |
| | | }else{ |
| | | produceList = res.data.concat(produceList) |
| | | if(produceList.length>500){ |
| | | produceList=produceList.slice(0,500) |
| | | } |
| | | } |
| | | xGrid.value.reloadData(produceList) |
| | | pageState=null |
| | | }else{ |
| | | ElMessage.warning(res.msg) |
| | | } |
| | | }finally { |
| | | gridOptions.loading=false |
| | | } |
| | | }) |
| | | } |
| | | |
| | | |
| | | //后端获取有多少页,超过多少页不再请求 |
| | | /*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/1/100").then((res) => { |
| | | if(res.code==200){ |
| | | gridOptions.data= deepClone(res.data) |
| | | flag = true |
| | | produceList = produceList.value.concat(deepClone(res.data)) |
| | | |
| | | xGrid.value.reloadData(produceList) |
| | | gridOptions.loading=false |
| | | }else{ |
| | | ElMessage.warning(res.msg) |
| | | router.push("/login") |
| | | } |
| | | }) |
| | | |
| | | //子组件接收参数 |
| | | let tableProp = $ref({ |
| | | datas:null, |
| | | footList:[], |
| | | //筛选条件列 |
| | | filter:{ |
| | | }, |
| | | }) |
| | | |
| | | |
| | | |
| | | |
| | |
| | | |
| | | const xGrid = ref() |
| | | const gridOptions = reactive({ |
| | | loading: false, |
| | | loading: true, |
| | | border: "full",//表格加边框 |
| | | keepSource: true,//保持源数据 |
| | | align: 'center',//文字居中 |
| | | stripe:true,//斑马纹 |
| | | rowConfig: {isCurrent: true, isHover: true,height: 50},//鼠标移动或选择高亮 |
| | | rowConfig: {isCurrent: true, isHover: true,height: 60, useKey: true},//鼠标移动或选择高亮 |
| | | id: 'demo_1', |
| | | showFooter: true,//显示脚 |
| | | printConfig: {}, |
| | | importConfig: {}, |
| | | exportConfig: {}, |
| | | scrollY:{ enabled: true ,gt:100},//开启虚拟滚动 |
| | | scrollX:{enabled: true}, |
| | | scrollY:{ enabled: true ,gt:0},//开启虚拟滚动 |
| | | showOverflow:true, |
| | | columnConfig: { |
| | | resizable: true, |
| | |
| | | zoom: true, |
| | | custom: true |
| | | }, |
| | | data: null,//table body实际数据 |
| | | footerMethod ({ columns, data }) {//页脚函数 |
| | | return[ |
| | | columns.map((column, columnIndex) => { |
| | |
| | | }) |
| | | |
| | | |
| | | let sortable2: any |
| | | |
| | | const columnDrop2 = () => { |
| | | const $grid = xGrid.value |
| | | sortable2 = Sortable.create($grid.$el.querySelector('.body--wrapper>.vxe-table--header .vxe-header--row'), { |
| | | handle: '.vxe-header--column', |
| | | onEnd: (sortableEvent) => { |
| | | const targetThElem = sortableEvent.item |
| | | const newIndex = sortableEvent.newIndex |
| | | const oldIndex = sortableEvent.oldIndex |
| | | const { fullColumn, tableColumn } = $grid.getTableColumn() |
| | | const wrapperElem = targetThElem.parentNode |
| | | const newColumn = fullColumn[newIndex] |
| | | if (newColumn.fixed) { |
| | | // 错误的移动 |
| | | const oldThElem = wrapperElem.children[oldIndex] |
| | | if (newIndex > oldIndex) { |
| | | wrapperElem.insertBefore(targetThElem, oldThElem) |
| | | } else { |
| | | wrapperElem.insertBefore(targetThElem, oldThElem ? oldThElem.nextElementSibling : oldThElem) |
| | | } |
| | | VXETable.modal.message({ content: '固定列不允许拖动!', status: 'error' }) |
| | | return |
| | | } |
| | | // 获取列索引 columnIndex > fullColumn |
| | | const oldColumnIndex = $grid.getColumnIndex(tableColumn[oldIndex]) |
| | | const newColumnIndex = $grid.getColumnIndex(tableColumn[newIndex]) |
| | | // 移动到目标列 |
| | | const currRow = fullColumn.splice(oldColumnIndex, 1)[0] |
| | | fullColumn.splice(newColumnIndex, 0, currRow) |
| | | $grid.loadColumn(fullColumn) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | let initTime: any |
| | | nextTick(() => { |
| | | // 加载完成之后在绑定拖动事件 |
| | | initTime = setTimeout(() => { |
| | | columnDrop2() |
| | | }, 500) |
| | | }) |
| | | |
| | | onUnmounted(() => { |
| | | clearTimeout(initTime) |
| | | if (sortable2) { |
| | | sortable2.destroy() |
| | | } |
| | | }) |
| | | |
| | | |
| | | </script> |
| | |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <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 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> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | |
| | | |
| | | let tableProp = $ref({ |
| | | title:[ |
| | | |
| | | {type:'expand',fixed:"left",slots: { content:'content' },width: 50}, |
| | | { type: 'checkbox',fixed:"left", title: '选择', width: 80 }, |
| | | { type: 'seq',fixed:"left", title: '自序', width: 80 }, |
| | | {type: 'checkbox',fixed:"left", title: '选择', width: 80 }, |
| | | {type: 'seq',fixed:"left", title: '自序', width: 80 }, |
| | | {title: '操作', width: 110, slots: { default: 'button_slot' },fixed:"left"}, |
| | | {field: 'prodID', title: '编号', sortable: true,editRender: { name: 'input', attrs: { placeholder: '' } } }, |
| | | {field: 'product', title: '名称', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
New file |
| | |
| | | <script lang="ts" setup> |
| | | import { defineComponent, reactive, ref, onUnmounted, nextTick } from 'vue' |
| | | import { VXETable, VxeGridInstance, VxeGridProps } from 'vxe-table' |
| | | import Sortable from 'sortablejs' |
| | | const xGrid2 = ref({} as VxeGridInstance) |
| | | |
| | | const meanNum = (list: any[], field: string) => { |
| | | let count = 0 |
| | | list.forEach(item => { |
| | | count += Number(item[field]) |
| | | }) |
| | | return count / list.length |
| | | } |
| | | |
| | | const sumNum = (list: any[], field: string) => { |
| | | let count = 0 |
| | | list.forEach(item => { |
| | | count += Number(item[field]) |
| | | }) |
| | | return count |
| | | } |
| | | |
| | | const gridOptions2 = reactive({ |
| | | border: true, |
| | | showFooter: true, |
| | | class: 'sortable-column-demo', |
| | | columnConfig: { |
| | | useKey: true |
| | | }, |
| | | scrollX: { |
| | | enabled: false |
| | | }, |
| | | toolbarConfig: { |
| | | custom: true |
| | | }, |
| | | columns: [ |
| | | { field: 'name', title: 'Name', fixed: 'left', width: 300 }, |
| | | { field: 'nickname', title: 'Nickname' }, |
| | | { field: 'role', title: 'Role' }, |
| | | { field: 'sex', title: 'Sex' }, |
| | | { field: 'age', title: 'Age' }, |
| | | { field: 'date3', title: 'Date' }, |
| | | { field: 'address', title: 'Address', width: 200, fixed: 'right', showOverflow: true } |
| | | ], |
| | | data: [ |
| | | { id: 10001, name: 'Test1', nickname: 'T1', role: 'Develop', sex: 'Man', age: 28, address: 'Shenzhen' }, |
| | | { id: 10002, name: 'Test2', nickname: 'T2', role: 'Test', sex: 'Women', age: 22, address: 'Guangzhou' }, |
| | | { id: 10003, name: 'Test3', nickname: 'T3', role: 'PM', sex: 'Man', age: 32, address: 'Shanghai' }, |
| | | { id: 10004, name: 'Test4', nickname: 'T4', role: 'Designer', sex: 'Women', age: 23, address: 'Shenzhen' }, |
| | | { id: 10005, name: 'Test5', nickname: 'T5', role: 'Develop', sex: 'Women', age: 30, address: 'Shanghai' } |
| | | ], |
| | | footerMethod ({ columns, data }) { |
| | | return [ |
| | | columns.map((column, columnIndex) => { |
| | | if (columnIndex === 0) { |
| | | return '平均' |
| | | } |
| | | if (['age', 'sex'].includes(column.property)) { |
| | | return meanNum(data, column.property) |
| | | } |
| | | return null |
| | | }), |
| | | columns.map((column, columnIndex) => { |
| | | if (columnIndex === 0) { |
| | | return '和值' |
| | | } |
| | | if (['age', 'sex'].includes(column.property)) { |
| | | return sumNum(data, column.property) |
| | | } |
| | | return null |
| | | }) |
| | | ] |
| | | } |
| | | } as VxeGridProps) |
| | | |
| | | let sortable2: any |
| | | |
| | | const columnDrop2 = () => { |
| | | const $grid = xGrid2.value |
| | | sortable2 = Sortable.create($grid.$el.querySelector('.body--wrapper>.vxe-table--header .vxe-header--row'), { |
| | | handle: '.vxe-header--column', |
| | | onEnd: (sortableEvent) => { |
| | | const targetThElem = sortableEvent.item |
| | | const newIndex = sortableEvent.newIndex as number |
| | | const oldIndex = sortableEvent.oldIndex as number |
| | | const { fullColumn, tableColumn } = $grid.getTableColumn() |
| | | const wrapperElem = targetThElem.parentNode as HTMLElement |
| | | const newColumn = fullColumn[newIndex] |
| | | if (newColumn.fixed) { |
| | | // 错误的移动 |
| | | const oldThElem = wrapperElem.children[oldIndex] as HTMLElement |
| | | if (newIndex > oldIndex) { |
| | | wrapperElem.insertBefore(targetThElem, oldThElem) |
| | | } else { |
| | | wrapperElem.insertBefore(targetThElem, oldThElem ? oldThElem.nextElementSibling : oldThElem) |
| | | } |
| | | VXETable.modal.message({ content: '固定列不允许拖动!', status: 'error' }) |
| | | return |
| | | } |
| | | // 获取列索引 columnIndex > fullColumn |
| | | const oldColumnIndex = $grid.getColumnIndex(tableColumn[oldIndex]) |
| | | const newColumnIndex = $grid.getColumnIndex(tableColumn[newIndex]) |
| | | // 移动到目标列 |
| | | const currRow = fullColumn.splice(oldColumnIndex, 1)[0] |
| | | fullColumn.splice(newColumnIndex, 0, currRow) |
| | | $grid.loadColumn(fullColumn) |
| | | } |
| | | }) |
| | | } |
| | | |
| | | let initTime: any |
| | | nextTick(() => { |
| | | // 加载完成之后在绑定拖动事件 |
| | | initTime = setTimeout(() => { |
| | | columnDrop2() |
| | | }, 500) |
| | | }) |
| | | |
| | | onUnmounted(() => { |
| | | clearTimeout(initTime) |
| | | if (sortable2) { |
| | | sortable2.destroy() |
| | | } |
| | | }) |
| | | |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | | <vxe-grid ref="xGrid2" v-bind="gridOptions2"></vxe-grid> |
| | | </template> |
| | | |
| | | <style scoped> |
| | | .sortable-column-demo .vxe-header--row .vxe-header--column.sortable-ghost, |
| | | .sortable-column-demo .vxe-header--row .vxe-header--column.sortable-chosen { |
| | | background-color: #dfecfb; |
| | | } |
| | | .sortable-column-demo .vxe-header--row .vxe-header--column.col--fixed { |
| | | cursor: no-drop; |
| | | } |
| | | </style> |
| | |
| | | </template> |
| | | |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row}"> |
| | | <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 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> |
| | | </li> |
| | | </ul> |
| | | </template> |
| | |
| | | |
| | | > |
| | | <!-- 下拉显示所有信息插槽--> |
| | | <template #content="{ row}"> |
| | | <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 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> |
| | | </li> |
| | | </ul> |
| | | </template> |