|
@@ -0,0 +1,278 @@
|
|
|
|
+<template>
|
|
|
|
+ <div class="form">
|
|
|
|
+ <van-nav-bar
|
|
|
|
+ title="销售合同"
|
|
|
|
+ left-text="返回"
|
|
|
|
+ left-arrow
|
|
|
|
+ @click-left="onClickLeft"
|
|
|
|
+ >
|
|
|
|
+ </van-nav-bar>
|
|
|
|
+ <testForm
|
|
|
|
+ v-model="formData.data"
|
|
|
|
+ :formOption="formOption"
|
|
|
|
+ :formConfig="formConfig"
|
|
|
|
+ :rules="rules"
|
|
|
|
+ @onSubmit="onSubmit"
|
|
|
|
+ ref="formDom"
|
|
|
|
+ ></testForm>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script setup>
|
|
|
|
+import { ref, reactive, getCurrentInstance, onMounted } from "vue";
|
|
|
|
+import { showSuccessToast, showFailToast } from "vant";
|
|
|
|
+import { useRoute } from "vue-router";
|
|
|
|
+import testForm from "@/components/testForm/index.vue";
|
|
|
|
+const proxy = getCurrentInstance().proxy;
|
|
|
|
+const route = useRoute();
|
|
|
|
+const formDom = ref(null);
|
|
|
|
+const formData = reactive({
|
|
|
|
+ data: {
|
|
|
|
+ list: [],
|
|
|
|
+ },
|
|
|
|
+});
|
|
|
|
+const rules = {
|
|
|
|
+ warehouseName: [{ required: true, message: "仓库名称不能为空" }],
|
|
|
|
+ productName: [{ required: true, message: "物品名称不能为空" }],
|
|
|
|
+ quantity: [{ required: true, message: "入库数量不能为空" }],
|
|
|
|
+};
|
|
|
|
+const formOption = reactive({
|
|
|
|
+ readonly: false, //用于控制整个表单是否只读
|
|
|
|
+ disabled: false,
|
|
|
|
+ labelAlign: "top",
|
|
|
|
+ scroll: true,
|
|
|
|
+ labelWidth: "62pk",
|
|
|
|
+ btnConfig: {
|
|
|
|
+ isNeed: true,
|
|
|
|
+ prop: "list",
|
|
|
|
+ plain: true,
|
|
|
|
+ listTitle: "合同明细",
|
|
|
|
+ listConfig: [
|
|
|
|
+ {
|
|
|
|
+ type: "picker",
|
|
|
|
+ label: "产品名称",
|
|
|
|
+ prop: "productId",
|
|
|
|
+ itemType: "onePicker",
|
|
|
|
+ showPicker: false,
|
|
|
|
+ readonly: false,
|
|
|
|
+ fieldNames: {
|
|
|
|
+ text: "label",
|
|
|
|
+ value: "value",
|
|
|
|
+ },
|
|
|
|
+ data: [],
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "picker",
|
|
|
|
+ label: "是否定制",
|
|
|
|
+ prop: "productId",
|
|
|
|
+ itemType: "onePicker",
|
|
|
|
+ showPicker: false,
|
|
|
|
+ readonly: false,
|
|
|
|
+ fieldNames: {
|
|
|
|
+ text: "label",
|
|
|
|
+ value: "value",
|
|
|
|
+ },
|
|
|
|
+ data: [
|
|
|
|
+ {
|
|
|
|
+ label: "是",
|
|
|
|
+ value: "1",
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: "否",
|
|
|
|
+ value: "2",
|
|
|
|
+ },
|
|
|
|
+ ],
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "input",
|
|
|
|
+ itemType: "number",
|
|
|
|
+ label: "单价",
|
|
|
|
+ prop: "quantity",
|
|
|
|
+ clearable: true,
|
|
|
|
+ changeFn: (index, val) => {
|
|
|
|
+ changeAmount(index);
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "input",
|
|
|
|
+ itemType: "number",
|
|
|
|
+ label: "数量",
|
|
|
|
+ prop: "quantity1",
|
|
|
|
+ clearable: true,
|
|
|
|
+ changeFn: (index, val) => {
|
|
|
|
+ changeAmount(index);
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "input",
|
|
|
|
+ itemType: "number",
|
|
|
|
+ label: "金额小计",
|
|
|
|
+ prop: "quantity2",
|
|
|
|
+ placeholder: "根据单价、数量自动计算",
|
|
|
|
+ readonly: true,
|
|
|
|
+ },
|
|
|
|
+ ],
|
|
|
|
+ clickFn: () => {
|
|
|
|
+ if (formData.data.list && formData.data.list.length > 0) {
|
|
|
|
+ formData.data.list.push({
|
|
|
|
+ productId: "",
|
|
|
|
+ quantity: "",
|
|
|
|
+ });
|
|
|
|
+ } else {
|
|
|
|
+ formData.data.list = [
|
|
|
|
+ {
|
|
|
|
+ productId: "",
|
|
|
|
+ quantity: "",
|
|
|
|
+ },
|
|
|
|
+ ];
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ },
|
|
|
|
+});
|
|
|
|
+const formConfig = reactive([
|
|
|
|
+ {
|
|
|
|
+ type: "picker",
|
|
|
|
+ label: "客户名称",
|
|
|
|
+ prop: "warehouseId",
|
|
|
|
+ itemType: "onePicker",
|
|
|
|
+ showPicker: false,
|
|
|
|
+ fieldNames: {
|
|
|
|
+ text: "label",
|
|
|
|
+ value: "value",
|
|
|
|
+ },
|
|
|
|
+ data: [],
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "picker",
|
|
|
|
+ label: "交货期限",
|
|
|
|
+ prop: "date",
|
|
|
|
+ itemType: "datePicker",
|
|
|
|
+ showPicker: false,
|
|
|
|
+ split: "-",
|
|
|
|
+ columnsType: ["year", "month", "day"],
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "picker",
|
|
|
|
+ label: "付款方式",
|
|
|
|
+ prop: "warehouseId",
|
|
|
|
+ itemType: "onePicker",
|
|
|
|
+ showPicker: false,
|
|
|
|
+ fieldNames: {
|
|
|
|
+ text: "label",
|
|
|
|
+ value: "value",
|
|
|
|
+ },
|
|
|
|
+ data: [],
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "picker",
|
|
|
|
+ label: "云费支付方",
|
|
|
|
+ prop: "warehouseId",
|
|
|
|
+ itemType: "onePicker",
|
|
|
|
+ showPicker: false,
|
|
|
|
+ fieldNames: {
|
|
|
|
+ text: "label",
|
|
|
|
+ value: "value",
|
|
|
|
+ },
|
|
|
|
+ data: [
|
|
|
|
+ {
|
|
|
|
+ label: "甲方",
|
|
|
|
+ value: "1",
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ label: "乙方",
|
|
|
|
+ value: "2",
|
|
|
|
+ },
|
|
|
|
+ ],
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "input",
|
|
|
|
+ itemType: "textarea",
|
|
|
|
+ label: "备注",
|
|
|
|
+ prop: "reamlke",
|
|
|
|
+ },
|
|
|
|
+ {
|
|
|
|
+ type: "input",
|
|
|
|
+ itemType: "number",
|
|
|
|
+ label: "合同总金额",
|
|
|
|
+ prop: "total",
|
|
|
|
+ readonly: true,
|
|
|
|
+ },
|
|
|
|
+]);
|
|
|
|
+const onClickLeft = () => history.back();
|
|
|
|
+const fundsPaymentMethod = ref([]);
|
|
|
|
+const customerData = ref([]);
|
|
|
|
+const productData = ref([]);
|
|
|
|
+const getDict = () => {
|
|
|
|
+ proxy.getDictOne(["funds_payment_method"]).then((res) => {
|
|
|
|
+ fundsPaymentMethod.value = res["funds_payment_method"].data.map((x) => ({
|
|
|
|
+ label: x.dictValue,
|
|
|
|
+ value: x.dictKey,
|
|
|
|
+ }));
|
|
|
|
+ formConfig[2].data = fundsPaymentMethod.value;
|
|
|
|
+ });
|
|
|
|
+ proxy.post("/customer/page", { pageNum: 1, pageSize: 9999 }).then((res) => {
|
|
|
|
+ customerData.value = res.data.rows.map((x) => ({
|
|
|
|
+ label: x.name,
|
|
|
|
+ value: x.id,
|
|
|
|
+ }));
|
|
|
|
+ formConfig[0].data = customerData.value;
|
|
|
|
+ });
|
|
|
|
+ proxy
|
|
|
|
+ .post("/productInfo/page", { pageNum: 1, pageSize: 9999, definition: "1" })
|
|
|
|
+ .then((res) => {
|
|
|
|
+ productData.value = res.data.rows.map((x) => ({
|
|
|
|
+ label: x.name,
|
|
|
|
+ value: x.id,
|
|
|
|
+ }));
|
|
|
|
+ formOption.btnConfig.listConfig[0].data = productData.value;
|
|
|
|
+ });
|
|
|
|
+};
|
|
|
|
+
|
|
|
|
+const getDetails = (id) => {
|
|
|
|
+ proxy.post("/stockJournal/detail", { id }).then((res) => {
|
|
|
|
+ formData.data = res.data;
|
|
|
|
+ });
|
|
|
|
+};
|
|
|
|
+
|
|
|
|
+onMounted(() => {
|
|
|
|
+ getDict();
|
|
|
|
+ if (route.query.id) getDetails(route.query.id);
|
|
|
|
+});
|
|
|
|
+
|
|
|
|
+const onSubmit = () => {
|
|
|
|
+ if (!formData.data.list.length > 0) return showFailToast("请添加合同明细!");
|
|
|
|
+ proxy.post("/stock/add", formData.data).then(
|
|
|
|
+ () => {
|
|
|
|
+ showSuccessToast("操作成功");
|
|
|
|
+ setTimeout(() => {
|
|
|
|
+ onClickLeft();
|
|
|
|
+ // proxy.$router.push("/main/manualInbound");
|
|
|
|
+ }, 500);
|
|
|
|
+ },
|
|
|
|
+ (err) => {
|
|
|
|
+ return showFailToast(err.message);
|
|
|
|
+ }
|
|
|
|
+ );
|
|
|
|
+};
|
|
|
|
+
|
|
|
|
+const changeAmount = (index) => {
|
|
|
|
+ let total = 0;
|
|
|
|
+ for (let i = 0; i < formData.data.list.length; i++) {
|
|
|
|
+ const element = formData.data.list[i];
|
|
|
|
+ if (element.quantity && element.quantity1) {
|
|
|
|
+ element.quantity2 = parseFloat(
|
|
|
|
+ element.quantity * element.quantity1
|
|
|
|
+ ).toFixed(2);
|
|
|
|
+ total += Number(element.quantity2);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ if (total) {
|
|
|
|
+ formData.data.total = total.toFixed(2);
|
|
|
|
+ }
|
|
|
|
+};
|
|
|
|
+</script>
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
+.form {
|
|
|
|
+ margin-bottom: 60px;
|
|
|
|
+}
|
|
|
|
+</style>
|