|
@@ -0,0 +1,291 @@
|
|
|
+<template>
|
|
|
+ <div v-loading="loading">
|
|
|
+ <div class="form-box">
|
|
|
+ <el-form
|
|
|
+ label-position="top"
|
|
|
+ :model="form"
|
|
|
+ ref="ruleForm"
|
|
|
+ :rules="formRules"
|
|
|
+ label-width="100px"
|
|
|
+ >
|
|
|
+ <div>
|
|
|
+ <labelTitle content="基本信息"></labelTitle>
|
|
|
+ </div>
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-form-item label="供应商" prop="supplierId">
|
|
|
+ <el-select
|
|
|
+ v-model="form.supplierId"
|
|
|
+ placeholder="请选择"
|
|
|
+ style="width: 100%"
|
|
|
+ @change="handleChangeSupply"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in supplySelectList"
|
|
|
+ :key="item.id"
|
|
|
+ :label="item.name"
|
|
|
+ :value="item.id"
|
|
|
+ >
|
|
|
+ <span style="float: left">{{
|
|
|
+ `${item.name}(${dictDataEcho(item.type, supplyTypeList)})`
|
|
|
+ }}</span>
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="12">
|
|
|
+ <el-form-item label="备注" prop="flowRemark">
|
|
|
+ <el-input
|
|
|
+ v-model="form.flowRemark"
|
|
|
+ placeholder="请输入"
|
|
|
+ type="textarea"
|
|
|
+ rows="4"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+
|
|
|
+ <div style="margin-bottom: 20px">
|
|
|
+ <labelTitle content="采购明细"></labelTitle>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-form-item>
|
|
|
+ <el-table :data="form.goodsList">
|
|
|
+ <el-table-column label="物品编码" prop="goodsCode">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="物品名称" prop="goodsName">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="物品类型"
|
|
|
+ prop="goodsType"
|
|
|
+ :formatter="(row) => dictDataEcho(row.goodsType, productTypeList)"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="单位" prop="goodsUnit"> </el-table-column>
|
|
|
+ <el-table-column label="采购数量" prop="quantityOne">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="已采购数量" prop="purchaseQuantity">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="此次采购数量" prop="quantity">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item
|
|
|
+ :prop="'goodsList.' + scope.$index + '.quantity'"
|
|
|
+ :rules="formRules.quantity"
|
|
|
+ :inline-message="true"
|
|
|
+ label-width="0"
|
|
|
+ >
|
|
|
+ <el-input-number
|
|
|
+ v-model="scope.row.quantity"
|
|
|
+ label="请输入"
|
|
|
+ style="width: 100%"
|
|
|
+ size="mini"
|
|
|
+ :controls="false"
|
|
|
+ :min="1"
|
|
|
+ :max="9999999"
|
|
|
+ >
|
|
|
+ </el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column label="单价" prop="unitPrice">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form-item
|
|
|
+ :prop="'goodsList.' + scope.$index + '.unitPrice'"
|
|
|
+ :rules="formRules.unitPrice"
|
|
|
+ :inline-message="true"
|
|
|
+ label-width="0"
|
|
|
+ >
|
|
|
+ <el-input-number
|
|
|
+ v-model="scope.row.unitPrice"
|
|
|
+ label="请输入"
|
|
|
+ style="width: 100%"
|
|
|
+ size="mini"
|
|
|
+ :controls="false"
|
|
|
+ :min="1"
|
|
|
+ :max="9999999"
|
|
|
+ >
|
|
|
+ </el-input-number>
|
|
|
+ </el-form-item>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="小计" prop="sum">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ {{ (scope.row.quantity * scope.row.unitPrice).toFixed(2) }}
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+
|
|
|
+ <el-table-column label="操作" width="100" align="left">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button type="text" @click="deleteRow(scope.$index)"
|
|
|
+ >删除</el-button
|
|
|
+ >
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+import labelTitle from "@/components/label-title/index.vue";
|
|
|
+import { getSupplierPrice } from "@/api/purchase-management/purchase/index.js";
|
|
|
+import { supplyPriceList } from "@/api/product-material/supply/priceMaintenance.js";
|
|
|
+import { supplySelect } from "@/api/product-material/supply/index.js";
|
|
|
+
|
|
|
+import { getToken } from "@/util/auth";
|
|
|
+
|
|
|
+export default {
|
|
|
+ name: "addPurchase",
|
|
|
+ components: { labelTitle },
|
|
|
+ props: {
|
|
|
+ form: {
|
|
|
+ type: Object,
|
|
|
+ default: () => {},
|
|
|
+ },
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ uploadHeader: {
|
|
|
+ Authorization: "Basic c2FiZXI6c2FiZXJfc2VjcmV0",
|
|
|
+ "Blade-Auth": "bearer " + getToken(),
|
|
|
+ },
|
|
|
+ supplySelectList: [],
|
|
|
+ supplyTypeList: [],
|
|
|
+ productTypeList: [],
|
|
|
+ loading: false,
|
|
|
+ formRules: {
|
|
|
+ supplierId: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请选择供应商",
|
|
|
+ trigger: "change",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ quantity: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入采购数量",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ unitPrice: [
|
|
|
+ {
|
|
|
+ required: true,
|
|
|
+ message: "请输入单价",
|
|
|
+ trigger: "blur",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ },
|
|
|
+ queryParams: {
|
|
|
+ pageNum: 1,
|
|
|
+ pageSize: 10,
|
|
|
+ keyword: "",
|
|
|
+ supplierId: "",
|
|
|
+ materialId: "",
|
|
|
+ supplierName: "",
|
|
|
+ materialName: "",
|
|
|
+ materialCode: "",
|
|
|
+ materialType: "",
|
|
|
+ },
|
|
|
+ tableList: [],
|
|
|
+ priceData: {},
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ // supplyPriceList(this.queryParams).then(
|
|
|
+ // (res) => {
|
|
|
+ // this.tableList = res.data.data.records;
|
|
|
+ // },
|
|
|
+ // (err) => {
|
|
|
+ // console.log("supplyPriceList: " + err);
|
|
|
+ // }
|
|
|
+ // );
|
|
|
+ const businessDictData = JSON.parse(
|
|
|
+ window.localStorage.getItem("businessDict")
|
|
|
+ );
|
|
|
+ this.productTypeList = businessDictData.find(
|
|
|
+ (item) => item.code === "productType"
|
|
|
+ ).children;
|
|
|
+ this.supplyTypeList = businessDictData.find(
|
|
|
+ (item) => item.code === "supplyType"
|
|
|
+ ).children;
|
|
|
+
|
|
|
+ supplySelect({ name: "", code: "", type: "" }).then((res) => {
|
|
|
+ this.supplySelectList = res.data.data;
|
|
|
+ });
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleSubmit() {
|
|
|
+ this.$refs.form.validate((valid) => {
|
|
|
+ if (valid) {
|
|
|
+ const data = [...this.form.goodsList];
|
|
|
+ for (let i = 0; i < data.length; i++) {
|
|
|
+ const e = data[i];
|
|
|
+ if (Number(e.assw) + Number(e.quantity) > Number(e.quantity)) {
|
|
|
+ return this.msgInfo("此次采购数量和已采购数量合不可大于采购数量");
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.loading = true;
|
|
|
+ this.$emit("submit");
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleCancel() {
|
|
|
+ this.$emit("cancel");
|
|
|
+ },
|
|
|
+ handleChange() {},
|
|
|
+ deleteRow(index) {
|
|
|
+ if (this.form.goodsList.length === 1) {
|
|
|
+ return this.msgInfo("已经是最后一条数据啦!");
|
|
|
+ }
|
|
|
+ this.form.goodsList.splice(index, 1);
|
|
|
+ this.msgSuccess("删除成功");
|
|
|
+ },
|
|
|
+ handleChangeSupply(val) {
|
|
|
+ const productIdList = this.form.goodsList.map((x) => {
|
|
|
+ return x.goodsId;
|
|
|
+ });
|
|
|
+ getSupplierPrice({ supplierId: val, productIdList }).then((res) => {
|
|
|
+ const priceData = res.data.data;
|
|
|
+ for (let i = 0; i < this.form.goodsList.length; i++) {
|
|
|
+ const x = this.form.goodsList[i];
|
|
|
+ if (Object.keys(priceData).length > 0) {
|
|
|
+ for (const key in priceData) {
|
|
|
+ if (x.goodsId === key) {
|
|
|
+ this.form.goodsList[i].unitPrice = priceData[key];
|
|
|
+ }
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.form.goodsList[i].unitPrice = "";
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
+};
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+// .form-box {
|
|
|
+// height: calc(100vh - 280px);
|
|
|
+// overflow: auto;
|
|
|
+// box-sizing: border-box;
|
|
|
+// padding: 10px;
|
|
|
+// }
|
|
|
+::v-deep {
|
|
|
+ .el-form-item {
|
|
|
+ margin-bottom: 3px;
|
|
|
+ }
|
|
|
+ .el-form--label-top .el-form-item__label {
|
|
|
+ padding: 8px 0 0 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|