From 332c012e7336f2996c4fe5c8c110d00713c1bde2 Mon Sep 17 00:00:00 2001
From: haoyahui <2032914783@qq.com>
Date: 星期六, 11 十一月 2023 18:51:33 +0800
Subject: [PATCH] 采购单，采购明细，库存管理，出入库，调拨管理，库存盘点
---
admin-web/src/views/stock/procure/purchaseOrder/detail.vue | 201 +++++++++++++++++++++++++++++++++-----------------
1 files changed, 133 insertions(+), 68 deletions(-)
diff --git a/admin-web/src/views/stock/procure/purchaseOrder/detail.vue b/admin-web/src/views/stock/procure/purchaseOrder/detail.vue
index 35f7d41..d98bfd2 100644
--- a/admin-web/src/views/stock/procure/purchaseOrder/detail.vue
+++ b/admin-web/src/views/stock/procure/purchaseOrder/detail.vue
@@ -1,15 +1,5 @@
<template>
- <el-dialog
- title="璇︽儏"
- width="60%"
- :modal="true"
- :visible.sync="visible"
- :top="'15vh'"
- :close-on-click-modal="false"
- :append-to-body="true"
- :destroy-on-close="true"
- @close="close"
- >
+ <win-md class="stock-detail" :title="setting.title" @close="close" :width="'800px'">
<el-row :gutter="20">
<el-col :span="8">
<span>鍏ュ簱鍗曞彿锛�</span>
@@ -17,17 +7,17 @@
</el-col>
<el-col :span="8">
<span>鍏ュ簱浠撳簱锛�</span>
- <span>{{ detail.goodsTemplateName }}</span>
+ <span>{{ detail.warehouseName }}</span>
</el-col>
<el-col :span="8">
<span>鎵�灞炴満鏋勶細</span>
- <span>{{ detail.agencyId }}</span>
+ <span>{{ detail.agencyName }}</span>
</el-col>
</el-row>
<el-row :gutter="20" style="margin-top: 20px">
<el-col :span="8">
<span>鐘舵�侊細</span>
- <span>{{ detail.states==1?'寰呭叆搴�':'宸插叆搴�' }}</span>
+ <span>{{ detail.states == 1 ? '寰呭叆搴�' : '宸插叆搴�' }}</span>
</el-col>
<el-col :span="8">
<span>鍒涘缓浜猴細</span>
@@ -35,34 +25,42 @@
</el-col>
<el-col :span="8">
<span>鍏ュ簱鏃堕棿锛�</span>
- <span>{{ detail.time }}</span>
+ <span>{{ detail.incomeTime | formatTime }}</span>
+ </el-col>
+ </el-row>
+ <el-row :gutter="20" style="margin-top: 20px">
+ <el-col class="img-row" :span="12">
+ <span>閲囪喘绫诲瀷锛�</span>
+ <span>{{ detail.buyType == 1 ? '闆嗛噰' : '鑷噰' }}</span>
</el-col>
</el-row>
<el-row :gutter="20" style="margin-top: 20px">
<el-col class="img-row" :span="24">
<span>閲囪喘鎵嬬画鐓х墖锛�</span>
- <div class="img-box"></div>
+ <div class="img-box" v-for="(item, index) in fileList" :key="index" @click="handlePreview(item)">
+ <img class="img" :src="getUrl(item.path)" alt="" />
+ </div>
</el-col>
</el-row>
<div class="goods-card" v-for="(goodsItem, goodsIndex) in detail.procureGoods" :key="goodsIndex">
<el-row :gutter="20">
<el-col :span="8">
<span>鐗╁搧鍒嗙被锛�</span>
- <span>{{ goodsItem.baseCategoryId }}</span>
+ <span>{{ goodsItem.baseCategoryName }}</span>
</el-col>
<el-col :span="8">
<span>鐗╁搧鍚嶇О锛�</span>
- <span>{{ goodsItem.baseGoodsTemplateId }}</span>
+ <span>{{ goodsItem.goodsTemplateName }}</span>
</el-col>
<el-col :span="8">
<span>渚涜揣鍟嗭細</span>
<span>{{ goodsItem.supplier }}</span>
</el-col>
</el-row>
- <el-table :data="goodsItem.models" :stripe="true" style="margin-top: 20px;">
- <el-table-column prop="baseGoodsModelsId" label="瑙勬牸鍨嬪彿" align="center">
+ <el-table :data="goodsItem.models" :stripe="true" style="margin-top: 20px">
+ <el-table-column prop="baseGoodsModelsName" label="瑙勬牸鍨嬪彿" align="center">
<template slot-scope="scope">
- {{ scope.row.baseGoodsModelsId }}
+ {{ scope.row.baseGoodsModelsName }}
</template>
</el-table-column>
<el-table-column label="鍗曚綅" align="center">
@@ -70,78 +68,145 @@
{{ scope.row.unit }}
</template>
</el-table-column>
- <el-table-column prop="price" label="鐜版湁搴撳瓨" align="center">
+ <el-table-column prop="price" label="鍗曚环" align="center">
<template slot-scope="scope">
- <el-input v-model="scope.row.price"></el-input>
+ {{ scope.row.price }}
</template>
</el-table-column>
- <el-table-column prop="counts" label="鍑哄簱鏁伴噺" align="center">
+ <el-table-column prop="counts" label="鍏ュ簱鏁伴噺" align="center">
<template slot-scope="scope">
- <el-input v-model="scope.row.counts"></el-input>
+ {{ scope.row.counts }}
+ </template>
+ </el-table-column>
+ <el-table-column prop="counts" label="閲戦" align="center">
+ <template slot-scope="scope">
+ {{ (scope.row.price * scope.row.counts).toFixed(2) }}
</template>
</el-table-column>
</el-table>
</div>
- </el-dialog>
+ <div id="uploadPreviewImages" style="display: none">
+ <span v-for="(src, index) in fileList" :key="index">
+ <img
+ v-if="checkImg(src.name)"
+ class="v-img"
+ :src="src.url"
+ :alt="src.name"
+ style="width: 100px; height: 100px"
+ />
+ </span>
+ </div>
+ </win-md>
</template>
<script>
-import {
- procureDetail,
-} from '@/api/stock/procure/purchaseOrder';
+import { procureDetail } from '@/api/stock/procure/purchaseOrder';
+import winMd from '@/components/win/win-md';
+import * as DateFormatter from '@/utils/DateFormatter';
+import { getDownUrl } from '@/utils/base';
+import Viewer from 'viewerjs';
+import 'viewerjs/dist/viewer.css';
+
+let viewer = null;
+
export default {
+ components: { winMd },
+
+ props: {
+ setting: {
+ type: Object,
+ default: () => {},
+ },
+ },
data() {
return {
- visible: false,
+ fileList: [],
detail: {
- businessFormCode:'',
- goodsTemplateName:'',
- agencyId:'',
- states:'',
- createName:'',
- time:'',
- procureGoods:[{},{}]
+ baseCategoryName: '',
+ businessFormCode: '',
+ goodsTemplateName: '',
+ procureDoc: '',
+ agencyId: '',
+ agencyName: '',
+ states: '',
+ createName: '',
+ time: '',
+ procureGoods: [{}, {}],
+ fileKey: Math.random(),
},
};
},
+ filters: {
+ formatTime(time) {
+ if (!time) return;
+ return DateFormatter.LongToDateTime(time);
+ },
+ },
+ created() {
+ procureDetail({ id: this.setting.id }).then((res) => {
+ this.detail = res;
+ this.fileList = this.detail.procureDoc ? JSON.parse(this.detail.procureDoc) : [];
+ this.$nextTick(() => {
+ this.initPreviewImg();
+ });
+ });
+ },
methods: {
- open(id) {
- this.visible = true;
- procureDetail({ id }).then(res=>{
- this.detail = res
- })
+ initPreviewImg() {
+ if (viewer != null) {
+ viewer.destroy();
+ }
+ const ViewerDom = document.querySelector('#uploadPreviewImages');
+ viewer = new Viewer(ViewerDom, {});
+ },
+ handlePreview(file) {
+ if (!this.checkImg(file.name)) {
+ return false;
+ }
+ let index = 0;
+ for (let i = 0; i < this.fileList.length; i++) {
+ const f = this.fileList[i];
+ if (this.checkImg(f.name)) {
+ if (file.id == f.id) {
+ break;
+ }
+ index++;
+ }
+ }
+ // this.fileList.forEach((f, i) => {
+ // if (file.uid == f.uid) {
+ // index = i
+ // }
+ // })
+ // document.querySelector('#uploadPreviewImages').children[0].click()
+ viewer.view(index);
+ },
+ checkImg(name) {
+ const suffix = name.substring(name.lastIndexOf('.'), name.length);
+ const imgArray = ['.jpg', '.jpeg', '.png', '.bmp'];
+ if (imgArray.indexOf(suffix) < 0) {
+ return false;
+ }
+ return true;
+ },
+ getUrl(path) {
+ if (path.substr(0, 7).toLowerCase() == 'http://' || path.substr(0, 8).toLowerCase() == 'https://') {
+ return path;
+ } else {
+ return getDownUrl() + path;
+ }
},
close() {
- this.visible = false;
+ this.$emit('close');
},
},
};
</script>
<style lang="scss" scoped>
-.img-row {
- display: flex;
- align-content: center;
+@import url(../../index.scss);
+.el-dialog {
+ z-index: 1100 !important;
}
-.img-box {
- display: inline-block;
- width: 80px;
- height: 80px;
- background: #f9f9f9;
- margin-right: 20px;
- img {
- width: 100%;
- }
-}
-
-.goods-card {
- position: relative;
- background: #f6f6f6;
- padding: 20px;
- box-sizing: border-box;
- border-radius: 4px;
- background-color: #f9f9f9;
- margin-top: 20px;
- &:nth-of-type(1) {
- margin-top: 0;
- }
+>>> .el-dialog {
+ z-index: 1100 !important;
}
</style>
--
Gitblit v1.9.1