From 8f24fea6ef79a68bbda4991bd9bd7a60402ad033 Mon Sep 17 00:00:00 2001 From: haoyahui <2032914783@qq.com> Date: 星期四, 09 十一月 2023 18:16:03 +0800 Subject: [PATCH] 采购单,物品分类 --- admin-web/src/views/stock/procure/purchaseOrder/index.vue | 691 ++++++++++++++++++++++++++++----------------------------- 1 files changed, 338 insertions(+), 353 deletions(-) diff --git a/admin-web/src/views/stock/procure/purchaseOrder/index.vue b/admin-web/src/views/stock/procure/purchaseOrder/index.vue index e5f7a65..826f06f 100644 --- a/admin-web/src/views/stock/procure/purchaseOrder/index.vue +++ b/admin-web/src/views/stock/procure/purchaseOrder/index.vue @@ -1,126 +1,92 @@ <template> <div class="app-container"> <el-container> - <el-container> - <el-card class="box-card" style="width: 100%" shadow="never"> - <!--鎼滅储鏉′欢--> - <div class="filter-container"> - <my-search ref="searchBar" :items="items" @search="fifterForm"></my-search> - </div> - <el-row style="margin-top: 15px"> - <el-col> - <!--鍒楄〃--> - <my-button name="鏂板" @click="addtable" site="form" /> - <div :style="{'overflow-y': 'auto', height:`${clientHeight - 320}px`}"> - <el-row class="card" - :gutter="5"> - <el-col v-for="(item, index) in proData" :key="index" class="cm-item"> - <el-card class="card-data"> - <div class="card-container"> - <div class="hed-one"> <span>鍏ュ簱鍗曞彿锛歿{ item.order_no }}</span><span style="margin-left: 20px;"><el-button type="warning" plain size="mini">寰呭叆搴�</el-button></span></div> - <div class="one-hed"> - <div class="box"><span class="span-two">鏈烘瀯锛�</span>{{ item.customer_name }}</div> - <div class="box"><span class="span-two">鎿嶄綔浜猴細</span>{{ item.customer_name }}</div> - <div class="box"><span class="span-two">鍑哄簱鏃堕棿锛�</span>{{ item.customer_name }}</div> - <div class="box"><span class="span-two">鍏ュ簱鏃堕棿锛�</span>{{ item.customer_name }}</div> - </div> - <div class="card-end"> - <div v-for="(just, index) in item.data" class="two-end"> - <div class="item"><span>{{ just.order_no }}锛�</span>{{ just.customer_name }}</div> - </div> - </div> + <el-card class="box-card" style="width: 100%" shadow="never"> + <!--鎼滅储鏉′欢--> + <div class="filter-container"> + <my-search ref="searchBar" :items="items" @search="fifterForm"></my-search> + </div> + <el-row style="margin-top: 15px"> + <el-col> + <!--鍒楄〃--> + <my-button name="鏂板" @click="addtable" site="tools" size="medium" /> + <my-button name="瀵煎叆" @click="importSetting.dialogShow = true" site="tools" size="medium" /> + <div :style="{ 'overflow-y': 'auto', height: `${clientHeight - 320}px` }" v-loading="loading"> + <el-row class="card" :gutter="5"> + <el-col v-for="(item, index) in list" :key="index" class="cm-item"> + <el-card class="card-data"> + <div class="card-container"> + <div class="card-header"> + <div class="card-header-left"> + <span>鍏ュ簱鍗曞彿锛�</span> + <span class="value">{{ item.businessFormCode }}</span> + <div class="states" :class="item.states==1?'':'states-income'">{{ item.states == 1 ? '寰呭叆搴�' : '宸插叆搴�' }}</div> + </div> + <div class="card-header-right"> + <template v-if="item.states == 1"> + <el-button name="缂栬緫" site="form" type="success" size="mini" @click="handleEdit(item)" + >缂栬緫</el-button + > + <el-button name="鍏ュ簱" site="form" type="primary" size="mini" @click="handleIncome(item)" + >鍏ュ簱</el-button + > + <el-button name="鍒犻櫎" site="form" type="danger" size="mini" @click="del(item)" + >鍒犻櫎</el-button + > + </template> + <template v-if="item.states != 1"> + <el-button site="form" type="success" size="mini" @click="handleExport(item)" + >瀵煎嚭鍏ュ簱鍗�</el-button + > + </template> + <el-button name="鏌ョ湅璇︽儏" site="form" type="info" size="mini" @click="handleDetail(item)" + >鏌ョ湅璇︽儏</el-button + > + </div> + </div> + <div class="one-hed"> + <div class="box"><span class="span-two">鏈烘瀯锛�</span>{{ item.agencyId }}</div> + <div class="box"><span class="span-two">鎿嶄綔浜猴細</span>{{ item.buyerName }}</div> + <div class="box"><span class="span-two">鍑哄簱鏃堕棿锛�</span>{{ item.procureTime }}</div> + <div class="box"><span class="span-two">鍏ュ簱鏃堕棿锛�</span>{{ item.procureTime }}</div> + </div> + <div class="card-end"> + <div v-for="(just, index) in item.models" :key="index" class="item"> + <div class="name">{{ just.baseGoodsModelsId }}</div> + <div class="value-box"> + <div class="value-box-item"> + <span class="label">鏁伴噺锛�</span> + <span class="value">{{ just.counts }}</span> </div> - <div class="card-but"> - <div> - <my-button style="width: 120px;" name="缂栬緫" site="form" /> - <my-button style="width: 120px;" name="鍏ュ簱" site="form" /> - </div> - <div style="margin-top: 10px;"> - <my-button style="width: 120px;" name="鍒犻櫎" site="form" /> - <my-button style="width: 120px;" name="鏌ョ湅璇︽儏" site="form" /> - </div> + <div class="value-box-item"> + <span class="label">閲戦锛�</span> + <span class="value">{{ just.price }}</span> </div> - - </el-card> - </el-col> - </el-row> - </div> - <el-pagination - :small="false" - :current-page="1" - :page-sizes="[5, 10, 20, 50, 100, 200, 300, 400, 500]" - :page-size="10" - layout="total, sizes, prev, pager, next, jumper" - :total="0" - @size-change="handleSizeChange" - @current-change="handleCurrentChange" - /> - </el-col> - </el-row> - <!--娣诲姞/缂栬緫寮圭獥--> - <el-dialog title="鏂板鍑哄簱" :close-on-click-modal="false" :visible.sync="adddialog" width="60%" > - <el-form ref="ruleForm" :model="formData" class="demo-ruleForm" label-width="100px"> - <el-row :gutter="24" class="headerHeight"> - <el-col :span="12"> - <el-form-item label="浠撳簱鍚嶇О" prop="name"> - <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="浠撳簱鍚嶇О" prop="name"> - <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="24" class="headerHeight"> - <el-col :span="24"> - <el-form-item label="鍑哄簱鎵嬬画" prop="name"> - 浠呭厑璁稿鍏ls銆亁lsx鏍煎紡鏂囦欢 - </el-form-item> - </el-col> - </el-row> - <div style="position: relative;"> - <div style="background-color: #F9F9F9;width: 90%;"> - <el-row :gutter="24" class=""> - <el-col :span="12"> - <el-form-item label="浠撳簱鍚嶇О" prop="name"> - <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/> - </el-form-item> - </el-col> - <el-col :span="12"> - <el-form-item label="浠撳簱鍚嶇О" prop="name"> - <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/> - </el-form-item> - </el-col> - </el-row> - <el-row :gutter="24" class=""> - <el-col :span="12"> - <el-form-item label="浠撳簱鍚嶇О" prop="name"> - <el-input v-model="formData.name" clearable maxlength="20" show-word-limit style="width: 100%"/> - </el-form-item> - </el-col> - </el-row> - <el-table :data="formData.tableData" height="100%" :stripe="true"> - <el-table-column prop="projectName" label="瑙勬牸鍨嬪彿" align="center"> </el-table-column> - <el-table-column prop="time1" label="鍗曚綅" align="center"> </el-table-column> - <el-table-column prop="unit" label="鐜版湁搴撳瓨" align="center"> </el-table-column> - <el-table-column prop="time2" label="鍑哄簱鏁伴噺" align="center"> </el-table-column> - </el-table> - </div> - <div style="position: absolute;right: 0;top: 152px;"> - <my-button style="display: block;margin-left: 10px;margin-bottom: 5px;" name="绉婚櫎" site="form"/> - <my-button name="鏂板鐗╁搧" site="form"/> - </div> - </div> - </el-form> - <div slot="footer" align="center" class="dialog-footer"> - <my-button name="纭畾" site="form" /> - <my-button name="鍙栨秷" site="form" @click="adddialog = false"/> + </div> + </div> + </div> + </div> + </el-card> + </el-col> + </el-row> </div> - </el-dialog> - </el-card> - </el-container> + <el-pagination + :small="false" + :current-page="pageNum" + :page-sizes="[5, 10, 20, 50, 100, 200, 300, 400, 500]" + :page-size="pageSize" + layout="total, sizes, prev, pager, next, jumper" + :total="total" + @size-change="handleSizeChange" + @current-change="handleCurrentChange" + /> + </el-col> + </el-row> + </el-card> </el-container> + <!--娣诲姞/缂栬緫寮圭獥--> + <edit ref="editRef"></edit> + <detail ref="detailRef"></detail> <my-import :import-setting="importSetting" :dialog-show="importSetting.dialogShow" @@ -130,196 +96,96 @@ </template> <script> -import MyButton from "@/components/myButton/myButton"; +import { procureList, procureDel, procureIncome } from '@/api/stock/procure/purchaseOrder'; +import MyButton from '@/components/myButton/myButton'; import SettingIplatform from '@/utils/settingIplatform'; -import myImport from '@/views/components/myImport' -import {getBaseUrl} from '@/utils/base'; +import myImport from '@/views/components/myImport'; +import edit from './edit'; +import detail from './detail'; +import { getBaseUrl } from '@/utils/base'; export default { - name: "index", - components: {MyButton, myImport}, + name: 'index', + components: { MyButton, myImport, edit, detail }, data() { return { - + loading: false, adddialog: false, - formData:{ - tableData:[ + list: [], + formData: { + tableData: [ { - projectName:'555' + projectName: '555', }, { - projectName:'444' - } + projectName: '444', + }, ], }, // 鎼滅储妗� items: [ { type: 'text', - dataIndex: 'name', - label: '鍑哄簱鍗曞彿', + dataIndex: 'businessFormCode', + label: '鍏ュ簱鍗曞彿', placeholder: '璇疯緭鍏�', - defaultValue: '' + defaultValue: '', }, { type: 'text', - dataIndex: 'name', + dataIndex: 'goodsTemplateName', label: '鐗╁搧鍚嶇О', placeholder: '鍙ā绯婃悳绱�', - defaultValue: '' + defaultValue: '', + }, + { + type: 'select', + dataIndex: 'name', + label: '鏈烘瀯', + placeholder: '璇烽�夋嫨', + defaultValue: '', + options: [], }, { type: 'text', - dataIndex: 'name', + dataIndex: 'buyerName', label: '鍒涘缓浜�', placeholder: '璇疯緭鍏�', - defaultValue: '' + defaultValue: '', + }, + { + type: 'select', + dataIndex: 'states', + label: '鐘舵��', + placeholder: '璇烽�夋嫨', + defaultValue: '', + options: [ + { + label: '鍏ㄩ儴', + value: '', + }, + { + label: '寰呭叆搴�', + value: '1', + }, + { + label: '宸插叆搴�', + value: '2', + }, + ], }, { type: 'date-picker', dataIndex: 'val1', - label: '鍑哄簱鏃堕棿', - defaultValue: '' + label: '鍏ュ簱鏃堕棿', + defaultValue: '', }, { type: 'date-picker', dataIndex: 'val2', label: '鑷�', - defaultValue: '' + defaultValue: '', }, - // { - // type: 'select', - // dataIndex: 'status', - // label: '鐘舵��', - // placeholder: '璇烽�夋嫨', - // defaultValue: '1', - // options: [ - // { - // label: '鍚敤', - // value: '1' - // }, - // { - // label: '绂佺敤', - // value: '0' - // } - // ] - // } - ], - proData: [ - { - order_no:'55555', - customer_name:'666', - data:[ - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'20浠�' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - ] - }, - { - order_no:'55555', - customer_name:'666', - data:[ - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - ] - }, - { - order_no:'55555', - customer_name:'666', - data:[ - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'20浠�' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - ] - }, - { - order_no:'55555', - customer_name:'666', - data:[ - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'20浠�' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - ] - - }, - { - order_no:'55555', - customer_name:'666', - data:[ - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'20浠�' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - ] - - }, - { - order_no:'55555', - customer_name:'666', - data:[ - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'20浠�' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - ] - - }, - { - order_no:'55555', - customer_name:'666', - data:[ - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'20浠�' - }, - { - order_no:'鐭冲嫆鑺鑹茬⒊绮�', - customer_name:'666' - }, - ] - - } ], // 鏍戞暟鎹� treeDataList: [], @@ -328,25 +194,25 @@ tenantId: null, userName: null, userPhone: null, - status: 1 + states: null, }, // 瀵煎叆 importSetting: { - dialogTitle: '瀵煎叆', - dialogShow: false, - fileSettings: { - data: {}, - uploadUrl: getBaseUrl()+"/pc/fin/sys/tenant/import", // 涓婁紶鍦板潃 - accept: '.xls', // 鏍煎紡 - type: 'text', // 鍥炴樉褰㈠紡 - loading: false // 瀵煎叆鏁堟灉 - }, - /* 妯℃澘涓嬭浇 */ - templateSettings: { - templateName: '瀵煎叆妯℃澘.xls', // 鍚嶇О - templateUrl: SettingIplatform.apiBaseURL + '/pc/fin/sys/tenant/getImportTemplate' // 涓嬭浇鍦板潃 - }, - onSuccess: null + dialogTitle: '瀵煎叆', + dialogShow: false, + fileSettings: { + data: {}, + uploadUrl: getBaseUrl() + '/pc/fin/sys/tenant/import', // 涓婁紶鍦板潃 + accept: '.xls', // 鏍煎紡 + type: 'text', // 鍥炴樉褰㈠紡 + loading: false, // 瀵煎叆鏁堟灉 + }, + /* 妯℃澘涓嬭浇 */ + templateSettings: { + templateName: '瀵煎叆妯℃澘.xls', // 鍚嶇О + templateUrl: SettingIplatform.apiBaseURL + '/pc/fin/sys/tenant/getImportTemplate', // 涓嬭浇鍦板潃 + }, + onSuccess: null, }, editSetting: { title: '', @@ -354,104 +220,223 @@ orgId: '', show: false, }, - } + pageNum: 1, + pageSize: 10, + total: 0, + }; }, computed: { - clientHeight () { - return document.documentElement.clientHeight + clientHeight() { + return document.documentElement.clientHeight; }, }, created() { + this.fetchData(); }, methods: { - handleSizeChange(){}, - handleCurrentChange(){}, + fetchData() { + this.loading = true; + procureList({ + pageNum: this.pageNum, + pageSize: this.pageSize, + ...this.filterFrom, + }).then((res) => { + this.list = res.datas; + this.total = res.totalRows; + this.loading = false; + console.log(this.list); + }); + }, //瀵煎叆 importOrg() { - this.importSetting.dialogShow = true - this.importSetting.onSuccess = (response, callBack) => { - if (response.code===1){ - this.$message.success(response.msg) - this.search(1) - }else{ - this.$message.warning(response.msg) - } - callBack() + this.importSetting.dialogShow = true; + this.importSetting.onSuccess = (response, callBack) => { + if (response.code === 1) { + this.$message.success(response.msg); + this.search(1); + } else { + this.$message.warning(response.msg); } + callBack(); + }; }, - + // 瀵煎嚭 + handleExport() { + + }, + // 鏂板 addtable() { - this.adddialog = true + this.$refs.editRef.open(); + }, + // 缂栬緫 + handleEdit(row) { + this.$refs.editRef.open(row.id); + }, + // 璇︽儏 + handleDetail(row) { + this.$refs.detailRef.open(row.id); + }, + // 鍏ュ簱 + handleIncome(row) { + this.$confirm(`鎮ㄧ‘瀹� 鍗曞彿锛�${row.businessFormCode} 鍏ュ簱鍚�?`, '閲囪喘鍏ュ簱') + .then(function () { + procureIncome({ id: row.id }).then((res) => { + this.$message.success('鍏ュ簱鎴愬姛锛�'); + }); + }) + .then((res) => { + this.search(); + }) + .catch(() => {}); + }, + del(row) { + this.$modal + .confirm('鏄惁纭鍒犻櫎鍏ュ簱鍗曞彿涓�"' + row.businessFormCode + '"鐨勬暟鎹悧锛�') + .then(function () { + procureDel({ id: row.id }).then((res) => {}); + }) + .then((res) => { + this.$message.success('鍒犻櫎鎴愬姛锛�'); + this.search(); + }) + .catch(() => {}); + }, + // 鍒嗛〉 + handleSizeChange(pageSize) { + this.pageSize = pageSize; + this.search({ pageNum: 1 }); + }, + handleCurrentChange(pageNum) { + this.myTable.paging.page.pageNum = pageNum; + this.search({ pageNum: pageNum }); }, // 鏌ヨtable鍒楄〃 search(pageNum) { - if (pageNum != undefined) { - // this.$refs.myTable.search(pageNum) - } else { - // this.$refs.myTable.search() - } + this.fetchData(); }, fifterForm(params) { - console.log(params,'555'); - this.filterFrom = Object.assign(this.filterFrom, params) - this.search(1) - } - } -} + this.filterFrom = Object.assign(this.filterFrom, params); + this.search(1); + }, + }, +}; </script> -<style scoped> -.card { - display: flex; - flex-wrap: wrap; - margin: 0px !important; - .cm-item { - width: 100%; - } - .cm-item /deep/ .el-card__body { - padding: 10px; - } +<style scoped lang="scss"> +.ml-20 { + margin-left: 20px; } -.card-data{ +.card { + display: flex; + flex-wrap: wrap; + margin: 0px !important; + .cm-item { + width: 100%; + } + .cm-item ::v-deep .el-card__body { + padding-bottom: 5px; + } +} +.card-data { position: relative; margin-top: 8px; - .card-container{ - display: inline-block; - width: 70%; - .hed-one{ - color: #2298EE; - font-size: 18px; + .card-container { + .card-header { + height: 48px; + display: flex; + align-items: center; + justify-content: space-between; + background: #f3f9fe; + padding: 0 32px 0 15px; + box-sizing: border-box; } - .one-hed{ - margin-top: 15px; - .box{ - display: inline-block; - margin-right: 20px; + .card-header-left { + display: flex; + align-items: center; + color: #999999; + font-family: 'Microsoft YaHei UI'; + font-size: 18px; + font-weight: 700; + .value { + color: #3d3d3d; + } + + .states { + width: 54px; + height: 22px; + line-height: 22px; + text-align: center; + border-radius: 4px; + border: 1px solid #f9675b99; + background: #f9675b1a; + font-family: 'Microsoft YaHei'; + color: #f9675b; + font-size: 13px; + font-style: normal; + font-weight: 400; + margin-left: 8px; + } + .states-income { + border: 1px solid #39ad6199; + background: #39ad610f; + color: #39ad61; } } - .span-two{ - color: #83919e; - font-size: 14px; + .one-hed { + margin-top: 15px; + padding: 0 32px 0 15px; + box-sizing: border-box; + .box { + display: inline-block; + margin-right: 20px; + } + .span-two { + color: #83919e; + font-size: 14px; + } } - .card-end{ + .card-end { font-size: 14px; color: #3d3d3d; margin-top: 15px; - display: flex; - flex-wrap: wrap; - .two-end{ - width: calc(33.33% - 20px); - margin-bottom: 15px; + display: flex; + flex-wrap: wrap; + font-family: 'Microsoft YaHei UI'; + padding: 0 16px; + box-sizing: border-box; + .item { + width: 379px; + height: 60px; + padding: 8px 12px 9px 12px; + box-sizing: border-box; + align-items: center; + gap: 8px; + flex-shrink: 0; + background: #f9f9f9; + margin-right: 15px; + margin-bottom: 15px; + &:last-child { + margin-right: 0; + } + .name { + height: 22px; + line-height: 22px; + } + .value-box { + display: flex; + .value-box-item { + margin-right: 20px; + .label { + color: #99999999; + line-height: 22px; + } + .value { + color: #ff3131; + } + } + } } } - } - .card-but{ - position: absolute; - right: 20px; - top: 40%; - } - } - </style> -- Gitblit v1.9.1