资金流水页面开发

src/components/testForm/index.vue

@@ -97,6 +97,7 @@
           <!-- 单选 -->
           <van-field
             v-if="i.type == 'picker' && i.itemType == 'onePicker'"
+            v-show="!i.showStatus"
             :label="i.label"
             :name="i.prop"
             v-model="formData[i.prop + 'Name']"

src/lang/cn.js

@@ -1061,7 +1061,30 @@ export const lang = {
 		company: '归属公司',
 		account: '资金账户',
 		amount: '交易金额',
+		amountMsg: '请输入交易金额',
 		tradingHour: '交易时间',
+		tradingHourMsg: '请选择交易时间',
 		digest: '摘要',
+		add: '添加流水',
+		edit: '编辑流水',
+		tradeInformation: '交易信息',
+		selectAccount: '选择账户',
+		selectAccountMsg: '请选择账户',
+		tradeType: '交易类型',
+		tradeTypeMsg: '请选择交易类型',
+		income: '收入',
+		disburse: '支出',
+		currency: '币种',
+		currencyMsg: '请选择币种',
+		contractArrival: '合同到账',
+		contractArrivalMsg: '请选择合同到账',
+		yes: '是',
+		no: '否',
+		peerInformation: '对方信息',
+		accountName: '账户名称',
+		bankDeposit: '开户银行',
+		bankAccountNumber: '银行账号',
+		otherInformation: '其他信息',
+		remark: '备注',
 	}
 }

src/router/routerLXF.js

@@ -70,6 +70,11 @@ export function routesLXF() {
       name: "资金流水",
       component: () => import("../views/fund/flow-of-funds/index.vue"),
     },
+    {
+      path: "flowOfFundsAdd",
+      name: "添加流水",
+      component: () => import("../views/fund/flow-of-funds/add.vue"),
+    },
   ];
   return routesLXF;
 }

src/views/fund/flow-of-funds/add.vue

@@ -0,0 +1,230 @@
+<template>
+  <div class="form">
+    <van-nav-bar :title="$t('flowFunds.' + route.query.type)" :left-text="$t('common.back')" 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, getCurrentInstance, onMounted, reactive } from "vue";
+import { showSuccessToast } from "vant";
+import { useRoute } from "vue-router";
+import { getUserInfo, formatDate } from "@/utils/auth";
+import testForm from "@/components/testForm/index.vue";
+
+const proxy = getCurrentInstance().proxy;
+const onClickLeft = () => history.back();
+const route = useRoute();
+const getDict = () => {
+  proxy
+    .post("/dictTenantData/page", {
+      pageNum: 1,
+      pageSize: 999,
+      dictCode: "account_currency",
+      tenantId: getUserInfo().tenantId,
+    })
+    .then((res) => {
+      if (res.data.rows && res.data.rows.length > 0) {
+        formConfig[4].data = res.data.rows.map((item) => {
+          return {
+            text: item.dictValue,
+            value: item.dictKey,
+          };
+        });
+      }
+    });
+  proxy.post("/accountManagement/page", { pageNum: 1, pageSize: 999 }).then((res) => {
+    if (res.data.rows && res.data.rows.length > 0) {
+      formConfig[1].data = res.data.rows.map((item) => {
+        return {
+          text: item.alias,
+          value: item.id,
+        };
+      });
+    }
+  });
+};
+getDict();
+const formData = reactive({
+  data: {
+    accountManagementId: null,
+    status: null,
+    amount: null,
+    currency: null,
+    name: null,
+    openingBank: null,
+    accountOpening: null,
+    transactionTime: formatDate(new Date(), "yyyy-MM-dd"),
+    remarks: null,
+    received: "20",
+  },
+});
+const formDom = ref(null);
+const formOption = reactive({
+  readonly: false, //用于控制整个表单是否只读
+  disabled: false,
+  labelAlign: "top",
+  scroll: true,
+  labelWidth: "62pk",
+});
+const formConfig = reactive([
+  {
+    type: "title",
+    title: proxy.t("flowFunds.tradeInformation"),
+  },
+  {
+    type: "picker",
+    label: proxy.t("flowFunds.selectAccount"),
+    prop: "accountManagementId",
+    itemType: "onePicker",
+    showPicker: false,
+    fieldNames: {
+      text: "text",
+      value: "value",
+    },
+    data: [],
+  },
+  {
+    type: "picker",
+    label: proxy.t("flowFunds.tradingHour"),
+    prop: "transactionTime",
+    itemType: "datePicker",
+    showPicker: false,
+    split: "-",
+    columnsType: ["year", "month", "day"],
+  },
+  {
+    type: "picker",
+    label: proxy.t("flowFunds.tradeType"),
+    prop: "status",
+    itemType: "onePicker",
+    showPicker: false,
+    fieldNames: {
+      text: "label",
+      value: "value",
+    },
+    data: [
+      {
+        label: proxy.t("flowFunds.income"),
+        value: "10",
+      },
+      {
+        label: proxy.t("flowFunds.disburse"),
+        value: "20",
+      },
+    ],
+    changeFn: (option, item, index) => {
+      formData.data[item.prop] = option.selectedOptions[0].value;
+      formData.data[item.prop + "Name"] = option.selectedOptions[0].label;
+      formConfig[index].showPicker = false;
+      formData.data.received = "20";
+      formData.data.receivedName = "否";
+      if (option.selectedOptions[0].value == "10") {
+        formConfig[6].showStatus = false;
+      } else {
+        formConfig[6].showStatus = true;
+      }
+    },
+  },
+  {
+    type: "picker",
+    label: proxy.t("flowFunds.currency"),
+    prop: "currency",
+    itemType: "onePicker",
+    showPicker: false,
+    fieldNames: {
+      text: "text",
+      value: "value",
+    },
+    data: [],
+  },
+  {
+    type: "input",
+    label: proxy.t("flowFunds.amount"),
+    prop: "amount",
+    itemType: "number",
+  },
+  {
+    type: "picker",
+    label: proxy.t("flowFunds.contractArrival"),
+    prop: "received",
+    itemType: "onePicker",
+    showPicker: false,
+    showStatus: true,
+    fieldNames: {
+      text: "label",
+      value: "value",
+    },
+    data: [
+      {
+        label: proxy.t("flowFunds.yes"),
+        value: "10",
+      },
+      {
+        label: proxy.t("flowFunds.no"),
+        value: "20",
+      },
+    ],
+  },
+  {
+    type: "title",
+    title: proxy.t("flowFunds.peerInformation"),
+  },
+  {
+    type: "input",
+    itemType: "text",
+    label: proxy.t("flowFunds.accountName"),
+    prop: "name",
+    clearable: true,
+  },
+  {
+    type: "input",
+    itemType: "text",
+    label: proxy.t("flowFunds.bankDeposit"),
+    prop: "openingBank",
+    clearable: true,
+  },
+  {
+    type: "input",
+    itemType: "text",
+    label: proxy.t("flowFunds.bankAccountNumber"),
+    prop: "accountOpening",
+    clearable: true,
+  },
+  {
+    type: "title",
+    title: proxy.t("flowFunds.otherInformation"),
+  },
+  {
+    type: "input",
+    itemType: "textarea",
+    label: proxy.t("flowFunds.remark"),
+    prop: "remarks",
+    clearable: true,
+  },
+]);
+const rules = {
+  accountManagementId: [{ required: true, message: proxy.t("flowFunds.selectAccountMsg") }],
+  transactionTime: [{ required: true, message: proxy.t("flowFunds.tradingHourMsg") }],
+  status: [{ required: true, message: proxy.t("flowFunds.tradeTypeMsg") }],
+  currency: [{ required: true, message: proxy.t("flowFunds.currencyMsg") }],
+  amount: [{ required: true, message: proxy.t("flowFunds.amountMsg") }],
+  received: [{ required: true, message: proxy.t("flowFunds.contractArrivalMsg") }],
+};
+const onSubmit = () => {
+  formData.data.transactionTime = formData.data.transactionTime + " " + formatDate(new Date(), "hh:mm:ss");
+  proxy.post("/accountRunningWater/" + route.query.type, formData.data).then(() => {
+    showSuccessToast(proxy.t("common.addSuccess"));
+    setTimeout(() => {
+      history.back();
+    }, 500);
+  });
+};
+onMounted(() => {
+  if (route.query.id) {
+    proxy.post("/accountRunningWater/detail", { id: route.query.id }).then((res) => {
+      formData.data = res.data;
+    });
+  }
+});
+</script>

src/views/fund/flow-of-funds/index.vue

@@ -18,12 +18,12 @@ import commonList from "@/components/common-list.vue";
 const proxy = getCurrentInstance().proxy;
 const onClickLeft = () => proxy.$router.push("/main/working");
 const onClickRight = () => {
-  //   proxy.$router.push({
-  //     path: "materialLibraryAdd",
-  //     query: {
-  //       type: "add",
-  //     },
-  //   });
+  proxy.$router.push({
+    path: "flowOfFundsAdd",
+    query: {
+      type: "add",
+    },
+  });
 };
 const req = ref({
   pageNum: 1,
@@ -73,13 +73,13 @@ const getList = (type) => {
     });
 };
 const toDtl = (row) => {
-  //   proxy.$router.push({
-  //     path: "materialLibraryAdd",
-  //     query: {
-  //       id: row.id,
-  //       type: 'edit'
-  //     },
-  //   });
+  proxy.$router.push({
+    path: "flowOfFundsAdd",
+    query: {
+      id: row.id,
+      type: "edit",
+    },
+  });
 };
 const listConfig = ref([
   {