请款

src/views/fund/funds/index.vue

@@ -18,12 +18,7 @@ import commonList from "@/components/common-list.vue";
 const proxy = getCurrentInstance().proxy;
 const onClickLeft = () => proxy.$router.push("/main/working");
 const onClickRight = () => {
-  // proxy.$router.push({
-  //   path: "flowOfFundsAdd",
-  //   query: {
-  //     type: "add",
-  //   },
-  // });
+  proxy.$router.push("/main/processDtl?flowKey=account_request_funds_flow");
 };
 const req = ref({
   pageNum: 1,

src/views/processApproval/components/SendFunds.vue

@@ -0,0 +1,322 @@
+<template>
+  <div class="form">
+    <van-tabs v-model:active="active">
+      <van-tab title="申购信息">
+        <div class="common-process-card">
+          <div class="common-title">申购信息</div>
+          <van-form @submit="onSubmit" label-align="top" style="margin-top: 20px">
+            <van-cell-group inset>
+              <van-field
+                v-model="formData.deptName"
+                is-link
+                readonly
+                :label="$t('purchased.procurementDepartment')"
+                :placeholder="$t('purchased.selectProcurementDepartment')"
+                :rules="[{ required: true, message: $t('purchased.procurementDepartmentCanNotBeEmpty') }]"
+                @click="submitType === 'edit' ? (typeModal = false) : (typeModal = true)"
+                :readonly="submitType === 'edit'"
+                required />
+              <van-popup v-model:show="typeModal" round position="bottom">
+                <van-picker :columns="columns" @cancel="typeModal = false" @confirm="onConfirm" />
+              </van-popup>
+              <van-field
+                v-model="formData.subcribeName"
+                type="text"
+                :name="$t('purchased.procurementPersonName')"
+                :label="$t('purchased.procurementPersonName')"
+                :placeholder="$t('purchased.pleaseFillInTheProcurementPersonName')"
+                :rules="[{ required: true, message: $t('purchased.procurementPersonNameCanNotBeEmpty') }]"
+                required
+                :readonly="submitType === 'edit'" />
+              <van-field
+                v-model="formData.subcribeTime"
+                is-link
+                readonly
+                name="datePicker"
+                :label="$t('purchased.procurementTime')"
+                :placeholder="$t('purchased.clickToSelectTime')"
+                :rules="[{ required: true, message: $t('purchased.procurementTimeCanNotBeEmpty') }]"
+                @click="submitType === 'edit' ? (timePicker = false) : (timePicker = true)"
+                required
+                :readonly="submitType === 'edit'" />
+              <van-popup v-model:show="timePicker" position="bottom">
+                <van-date-picker @confirm="timeOnConfirm" @cancel="timePicker = false" />
+              </van-popup>
+              <van-field
+                v-model="formData.subcribeContent"
+                type="textarea"
+                :name="$t('purchased.procurementDescription')"
+                :label="$t('purchased.procurementDescription')"
+                :placeholder="$t('purchased.pleaseFillInTheProcurementDescription')"
+                :rules="[{ required: true, message: $t('purchased.procurementDescriptionCanNotBeEmpty') }]"
+                required
+                :readonly="submitType === 'edit'"
+                rows="3" />
+            </van-cell-group>
+          </van-form>
+        </div>
+      </van-tab>
+      <van-tab title="明细">
+        <div class="common-process-card">
+          <div class="common-title">明细</div>
+          <!-- 明细列表 -->
+          <div v-for="(item, index) in formData.subscribeDetailList" :key="index">
+            <div class="commons-delete">
+              <div class="title">{{ $t("common.details") }}{{ index + 1 }}</div>
+              <div class="delete" @click.native="handleDel(index)" v-if="!route.query.id">
+                <van-icon name="cross" />
+              </div>
+            </div>
+            <van-cell-group inset>
+              <van-field
+                v-model="formData.subscribeDetailList[index].bussinessName"
+                is-link
+                readonly
+                :label="$t('purchased.procurementProduct')"
+                :placeholder="$t('purchased.selectProcurementProduct')"
+                :readonly="submitType === 'edit'"
+                @click="handleSelect(index)"
+                :rules="[{ required: true, message: $t('purchased.procurementProductCanNotBeEmpty') }]"
+                required />
+              <van-field
+                v-model="formData.subscribeDetailList[index].count"
+                :label="$t('subscribe.quantity')"
+                :placeholder="$t('subscribe.pleaseEnterTheQuantity')"
+                :rules="[{ required: true, message: $t('subscribe.quantityCanNotBeEmpty') }]"
+                required
+                type="number"
+                :readonly="submitType === 'edit'" />
+
+              <van-field
+                v-model="formData.subscribeDetailList[index].content"
+                :label="$t('subscribe.cause')"
+                :placeholder="$t('subscribe.pleaseEnterTheCause')"
+                :rules="[{ required: true, message: $t('subscribe.causeCanNotBeEmpty') }]"
+                :readonly="submitType === 'edit'"
+                rows="3"
+                type="textarea"
+                required />
+            </van-cell-group>
+          </div>
+          <van-popup v-model:show="typeModalOne" round position="bottom">
+            <van-picker :columns="columnsOne" @cancel="typeModalOne = false" @confirm="(data) => onConfirmOne(data)" />
+          </van-popup>
+          <div class="commons-add-btn" v-if="!route.query.id">
+            <van-button icon="plus" type="default" size="small" style="margin-top: 10px" block @click="handleAddRow">{{ $t("common.addDetails") }}</van-button>
+          </div>
+          <!-- <div style="margin: 16px" v-if="!route.query.id">
+						<van-button round block type="primary" native-type="submit">
+							{{$t('common.submit')}}
+						</van-button>
+					</div> -->
+          <div class="common-mobile-table">
+            <table>
+              <thead>
+                <tr>
+                  <th>物料编码</th>
+                  <th>物料名称</th>
+                  <th>规格型号</th>
+                  <th>规格型号</th>
+                  <th>规格型号</th>
+                  <th>规格型号</th>
+                  <th>规格型号</th>
+                </tr>
+              </thead>
+              <tbody>
+                <tr>
+                  <td>1000000001</td>
+                  <td>电脑</td>
+                  <td>台</td>
+                </tr>
+                <tr>
+                  <td>1000000002</td>
+                  <td>显示器</td>
+                  <td>台</td>
+                </tr>
+              </tbody>
+            </table>
+          </div>
+        </div>
+      </van-tab>
+      <van-tab title="标签 3">内容 3</van-tab>
+      <van-tab title="标签 4">内容 4</van-tab>
+      <van-tab title="标签 4">内容 4</van-tab>
+      <van-tab title="标签 4">内容 4</van-tab>
+    </van-tabs>
+  </div>
+</template>
+
+<script setup>
+import { ref, getCurrentInstance, onMounted, defineProps, defineExpose, watch } from "vue";
+import { showSuccessToast, showFailToast } from "vant";
+import { useRoute } from "vue-router";
+// 接收父组件的传值
+const props = defineProps({
+  queryData: String,
+});
+
+const proxy = getCurrentInstance().proxy;
+const route = useRoute();
+const typeModal = ref(false);
+const typeModalOne = ref(false);
+let selectIndex = ref(null);
+const timePicker = ref(false);
+const formData = ref({
+  productionTaskId: "",
+  code: "",
+  productName: "",
+  quantity: "",
+  personLiableName: "",
+  dueDate: "",
+  subscribeDetailList: [],
+});
+const handleAddRow = () => {
+  console.log(formData.value);
+  if (!formData.value.subscribeDetailList) formData.value.subscribeDetailList = [];
+  formData.value.subscribeDetailList.push({
+    bussinessId: "",
+    bussinessName: "",
+    name: "",
+    quantity: "",
+    content: "",
+    count: "",
+  });
+};
+watch(
+  props.queryData,
+  () => {
+    if (props.queryData && ["10", "20", "30"].includes(route.query.processType)) {
+      for (const key in props.queryData) {
+        formData.data[key] = props.queryData[key];
+      }
+    }
+  },
+  {
+    deep: true,
+  }
+);
+const timeOnConfirm = ({ selectedValues }) => {
+  formData.value.subcribeTime = selectedValues.join("-");
+  timePicker.value = false;
+};
+
+const getDict = () => {
+  proxy.get("/tenantDept/list", { pageNum: 1, pageSize: 9999 }).then((res) => {
+    columns.value = res.data.map((item) => {
+      return {
+        ...item,
+        text: item.deptName,
+        value: item.deptId,
+      };
+    });
+  });
+  setInterval(() => {
+    //停止循环
+    if (proxy.queryData) {
+      formData.value = proxy.queryData;
+      clearInterval();
+    }
+  }, 1000);
+  proxy.post("/productInfo/page", { pageNum: 1, pageSize: 9999 }).then((res) => {
+    columnsOne.value = res.data.rows.map((item) => {
+      return {
+        ...item,
+        text: item.name,
+        value: item.id,
+      };
+    });
+  });
+};
+
+const getDetails = (id) => {
+  proxy.post("/subscribe/detail", { id: id }).then((res) => {
+    res.data.subscribeDetailList.map((item) => {
+      columnsOne.value.map((itemOne) => {
+        if (itemOne.value === item.bussinessId) {
+          item.bussinessName = itemOne.name;
+        }
+      });
+    });
+    formData.value = res.data;
+
+    console.log(formData.value);
+  });
+};
+
+const columns = ref([]);
+const columnsOne = ref([]);
+const submitType = ref("add");
+
+const onConfirm = ({ selectedOptions }) => {
+  formData.value.deptName = selectedOptions[0].text;
+  formData.value.productionTaskId = selectedOptions[0].value;
+  formData.value.productName = selectedOptions[0].productName;
+  formData.value.quantity = selectedOptions[0].quantity;
+  formData.value.personLiableName = selectedOptions[0].personLiableName;
+  formData.value.dueDate = selectedOptions[0].dueDate;
+  typeModal.value = false;
+};
+
+const onConfirmOne = ({ selectedOptions }) => {
+  formData.value.subscribeDetailList[selectIndex.value].bussinessId = selectedOptions[0].value;
+  formData.value.subscribeDetailList[selectIndex.value].bussinessName = selectedOptions[0].text;
+  typeModalOne.value = false;
+};
+
+const handleSelect = (index) => {
+  if (submitType.value === "edit") return;
+  selectIndex.value = index;
+  typeModalOne.value = true;
+};
+
+const handleDel = (index) => {
+  formData.value.subscribeDetailList.splice(index, 1);
+};
+
+const handleSubmit = async () => {
+  return formData.value;
+};
+const onSubmit = () => {
+  if (!formData.value.subscribeDetailList.length > 0) return showFailToast(proxy.t("common.pleaseAddDetails"));
+  proxy
+    .post("/flowProcess/initiate", {
+      flowKey: "subscribe_flow",
+      data: formData.value,
+      remark: null,
+    })
+    .then(
+      (res) => {
+        setTimeout(() => {
+          showSuccessToast(proxy.t("common.procurementSuccess"));
+          proxy.$router.push("/main/subscribe");
+        }, 500);
+      },
+      (err) => {
+        return showFailToast(err.message);
+      }
+    );
+};
+defineExpose({
+  handleSubmit,
+});
+onMounted(() => {
+  getDict();
+});
+</script>
+<style lang="scss" scoped>
+.row {
+  display: flex;
+  padding: 5px 15px;
+  justify-content: space-between;
+  align-items: center;
+  color: #999999;
+  .title {
+    flex: 1;
+  }
+  .delete {
+    width: 20px;
+    cursor: pointer;
+    text-align: center;
+  }
+}
+</style>

src/views/processApproval/processDtl.vue

@@ -93,10 +93,11 @@
 import { ref, getCurrentInstance, onMounted, reactive } from 'vue'
 import { useRoute } from 'vue-router'
 import SendSubscribe from './components/SendSubscribe'
+import SendFunds from './components/SendFunds'
 import { showSuccessToast, showFailToast } from 'vant'
 const route = useRoute()
 const proxy = getCurrentInstance().proxy
-const onClickLeft = () => proxy.$router.push('/main/working')
+const onClickLeft = () => proxy.$router.push(componentObj.value[route.query.flowKey].backUrl)
 const message = ref('')
 const onClickRight = () => {
 	proxy.$router.push('/main/working')
@@ -129,6 +130,11 @@ let componentObj = ref({
 		component: SendSubscribe,
 		backUrl: '/main/subscribe',
 	},
+	account_request_funds_flow: {
+		title: '请款',
+		component: SendFunds,
+		backUrl: '/main/funds',
+	},
 })
 
 let dialogVisible = ref(false)