🦄 refactor: 将所有表单弹出框写成一个文件,将用到的下拉款写成一个文件,将插槽写到src代码里

prettier.json

@@ -3,6 +3,6 @@
   "semi": false,
   "tabWidth": 2,
   "singleQuote": true,
-  "printWidth": 100,
+  "printWidth":200,
   "trailingComma": "none"
 }

src/components/scarchBox.vue

@@ -18,11 +18,11 @@ import { number } from "echarts";
 
 const { colNum, btnNum } = defineProps({
   colNum: {
-    type: number,
+    type: Number,
     default: 10,
   },
   btnNum: {
-    type: number,
+    type: Number,
     default: 2,
   },
 });

src/pages/finance-bill-manage/billBreakage.vue

@@ -16,57 +16,25 @@
             <template #scarchName>
               <t-col :span="3">
                 <t-form-item label="票据编号:" name="billserial">
-                  <t-input
+                  <t-input class="form-item-content" v-model="formData.billserial" maxlength="10"></t-input>
-                    class="form-item-content"
-                    v-model="formData.billserial"
-                    maxlength="10"
-                  ></t-input>
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="报损日期:" name="breakDate">
-                  <t-date-picker
+                  <t-date-picker class="form-item-content" v-model="formData.breakDate" clearable />
-                    class="form-item-content"
-                    v-model="formData.breakDate"
-                    clearable
-                  />
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="票据类型:" name="billType">
-                  <t-select
+                  <t-select class="form-item-content" v-model="formData.billType" placeholder="请选择票据类型" clearable>
-                    class="form-item-content"
+                    <t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                    v-model="formData.billType"
-                    placeholder="请选择票据类型"
-                    clearable
-                  >
-                    <t-option
-                      v-for="item in billType"
-                      :key="item.value"
-                      :value="item.value"
-                      :label="item.label"
-                    ></t-option>
                   </t-select>
                 </t-form-item>
               </t-col>
               <t-col :span="3">
-                <t-form-item
+                <t-form-item label="报损状态:" name="breakStatus" style="margin-bottom: 0.3rem">
-                  label="报损状态:"
+                  <t-select class="form-item-content" v-model="formData.breakStatus" placeholder="请选择报损状态" clearable>
-                  name="breakStatus"
+                    <t-option v-for="item in billStatus" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                  style="margin-bottom: 0.3rem"
-                >
-                  <t-select
-                    class="form-item-content"
-                    v-model="formData.breakStatus"
-                    placeholder="请选择报损状态"
-                    clearable
-                  >
-                    <t-option
-                      v-for="item in approvalStatus"
-                      :key="item.value"
-                      :value="item.value"
-                      :label="item.label"
-                    ></t-option>
                   </t-select>
                 </t-form-item>
               </t-col>
@@ -88,12 +56,7 @@
               <template #icon><add-icon /></template>
               新增报损票据
             </t-button>
-            <t-button
+            <t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
-              shape="circle"
-              theme="primary"
-              @click="refresh"
-              style="margin-left: 0.8rem"
-            >
               <template #icon><load-icon /></template>
             </t-button>
           </div>
@@ -109,48 +72,17 @@
           class="table"
           :max-height="550"
         >
-          <template #breakNum="{ row }">
-            {{ `${row.breakNum}张` }}
-          </template>
-          <!-- <template #billType="{ row }">
-            <div v-for="item in billType" :key="item">
-              <span v-if="row.billType === item.value">{{ item.label }}</span>
-            </div>
-          </template> -->
-          <template #breakStatus="{ row }">
-            <div v-for="item in breakStatus" :key="item">
-              <t-tag
-                v-if="row.breakStatus === item.value"
-                :theme="tagColor(row.breakStatus)"
-                variant="light"
-              >
-                {{ item.label }}
-              </t-tag>
-            </div>
-          </template>
           <template #status="slotProps">
             <t-button
               theme="default"
               variant="text"
               size="small"
               @click="breakEdit(slotProps)"
-              :disabled="
+              :disabled="slotProps.row.breakStatus === 0 || slotProps.row.breakStatus === 1"
-                slotProps.row.breakStatus === 0 ||
-                slotProps.row.breakStatus === 1
-              "
               >修改</t-button
             >
-            <t-popconfirm
+            <t-popconfirm content="确认删除吗" @confirm="breakDelete(slotProps)">
-              content="确认删除吗"
+              <t-button theme="default" variant="text" size="small" :disabled="slotProps.row.breakStatus === 0">删除</t-button>
-              @confirm="breakDelete(slotProps)"
-            >
-              <t-button
-                theme="default"
-                variant="text"
-                size="small"
-                :disabled="slotProps.row.breakStatus === 0"
-                >删除</t-button
-              >
             </t-popconfirm>
           </template>
         </t-base-table>
@@ -167,116 +99,16 @@
         :confirm-btn="null"
         :cancel-btn="null"
       >
-        <t-space direction="vertical" style="width: 100%">
+        <list-form :activeForm="'break'" @childForm="breakEvent" :editFrom="editFrom" />
-          <div>
-            <t-form
-              ref="formDialog"
-              scroll-to-first-error="smooth"
-              label-align="left"
-              :rules="FORM_RULES"
-              :data="dialogData"
-              :colon="true"
-              @submit="breakSub"
-              label-width="calc(2em + 55px)"
-              layout="inline"
-              @reset="onReset"
-            >
-              <t-form-item
-                label="票据编号"
-                name="billserial"
-                :span="10"
-                style="margin-bottom: 0.5rem"
-              >
-                <t-input
-                  v-model="dialogData.billserial"
-                  placeholder="请输入票据编号"
-                  maxlength="10"
-                ></t-input>
-              </t-form-item>
-              <t-form-item
-                label="操作员"
-                name="operator"
-                :span="10"
-                style="margin-bottom: 0.5rem"
-              >
-                <t-input
-                  v-model="dialogData.operator"
-                  placeholder="请输入操作员"
-                ></t-input>
-              </t-form-item>
-              <t-form-item
-                label="票据类型"
-                name="billType"
-                :span="12"
-                style="width: 16rem; margin-bottom: 0.5rem"
-              >
-                <t-select
-                  v-model="dialogData.billType"
-                  clearable
-                  placeholder="请选择票据类型"
-                >
-                  <t-option
-                    v-for="item in billType"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value"
-                  />
-                </t-select>
-              </t-form-item>
-              <t-form-item
-                label="报损数量"
-                name="breakNum"
-                :span="12"
-                style="margin-bottom: 0.5rem"
-              >
-                <t-input
-                  type="number"
-                  v-model="dialogData.breakNum"
-                  placeholder="请输入报损数量"
-                ></t-input>
-              </t-form-item>
-
-              <t-form-item
-                label="报损时间"
-                name="breakDate"
-                :span="10"
-                style="width: 16rem; margin-bottom: 0.5rem"
-              >
-                <t-date-picker
-                  v-model="dialogData.breakDate"
-                  placeholder="请选择报损时间"
-                  clearable
-                />
-              </t-form-item>
-              <t-form-item
-                label="报损原因"
-                name="breakInfo"
-                style="width: 33.6rem"
-              >
-                <t-textarea
-                  v-model="dialogData.breakInfo"
-                  placeholder="请输入备注"
-                ></t-textarea>
-              </t-form-item>
-              <t-form-item />
-              <t-form-item>
-                <t-space size="small">
-                  <t-button theme="primary" type="submit">提交</t-button>
-                  <t-button theme="default" variant="base" type="reset"
-                    >重置</t-button
-                  >
-                </t-space>
-              </t-form-item>
-            </t-form>
-          </div>
-        </t-space>
       </t-dialog>
     </t-space>
   </div>
 </template>
 
-<script setup>
+<script setup lang="jsx">
 import scarchBox from "@/components/scarchBox.vue";
+import listForm from "./form/index.vue";
+import { billType, billStatus } from "./codeValue/index";
 import { ref, onMounted } from "vue";
 import { MessagePlugin } from "tdesign-vue-next";
 import { AddIcon, LoadIcon } from "tdesign-icons-vue-next";
@@ -289,6 +121,7 @@ const breakageList = useBreakage();
 const tableData = ref([]);
 const data = ref([]);
 const headerTitle = ref("");
+const editFrom = ref();
 // 表格表头
 const columns = ref([
   {
@@ -308,7 +141,7 @@ const columns = ref([
     align: "center",
     width: "100",
     cell: (h, { row }) => {
-      const type = billType.value.find((type) => type.value === row.billType);
+      const type = billType.find((type) => type.value === row.billType);
       return type ? type.label : "未知";
     },
   },
@@ -318,7 +151,7 @@ const columns = ref([
     align: "center",
     width: "100",
     cell: (h, { row }) => {
-      return row.breakNum + "张１２３";
+      return row.breakNum + "张";
     },
   },
   {
@@ -338,6 +171,14 @@ const columns = ref([
     title: "报损状态",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      const status = billStatus.find((item) => item.value === row.breakStatus);
+      return (
+        <t-tag theme={tagColor(row.breakStatus)} variant="light">
+          {status.label}
+        </t-tag>
+      );
+    },
   },
   {
     colKey: "breakInfo",
@@ -355,28 +196,11 @@ const columns = ref([
   },
 ]);
 
-// 票据类型
-const billType = ref([
-  { label: "票据类型1", value: 0 },
-  { label: "票据类型2", value: 1 },
-  { label: "票据类型3", value: 2 },
-  { label: "票据类型4", value: 3 },
-  { label: "票据类型5", value: 4 },
-]);
-
-// 审批状态
-const breakStatus = ref([
-  { label: "审核中", value: 0 },
-  { label: "审核通过", value: 1 },
-  { label: "审核拒绝", value: 2 },
-]);
-
 // 获取票据列表
 const tableList = async () => {
   loading.value = true;
-  data.value = tableData.value = await breakageList.getBreakageList();
+  tableData.value = await breakageList.getBreakageList();
-
+  data.value = await breakageList.getBreakageList();
-  // data.value = await breakageList.getBreakageList();
   pagination.value.total = tableData.value.length;
   const timerId = setTimeout(() => {
     loading.value = false;
@@ -400,16 +224,6 @@ const refresh = () => {
   tableList();
 };
 
-// 弹出框表单
-const dialogData = ref({
-  billserial: "",
-  operator: "",
-  billType: "",
-  breakNum: Number,
-  breakDate: "",
-  breakInfo: "",
-});
-
 // 查询表单
 const formData = ref({
   billserial: "",
@@ -442,8 +256,7 @@ const headerQuery = () => {
   if (
     formData.value.billserial === "" &&
     (formData.value.billType === undefined || formData.value.billType === "") &&
-    (formData.value.breakStatus === undefined ||
+    (formData.value.breakStatus === undefined || formData.value.breakStatus === "") &&
-      formData.value.breakStatus === "") &&
     formData.value.breakDate === ""
   ) {
     getNewTable();
@@ -481,41 +294,20 @@ const headerQuery = () => {
 const breakageAdd = () => {
   visiblePost.value = true;
   headerTitle.value = "新增报损票据";
-  dialogData.value = {
-    billserial: "",
-    operator: "",
-    billType: "",
-    breakNum: Number,
-    breakDate: "",
-    breakInfo: "",
-  };
 };
 
 // 关闭窗口
 const closePost = () => {
   visiblePost.value = false;
 };
-// 表单校验
-const FORM_RULES = {
-  billserial: [{ required: true, message: "请输入票据编号", trigger: "blur" }],
-  billType: [{ required: true, message: "请选择票据类型", trigger: "change" }],
-  breakNum: [{ required: true, message: "请输入报损数量", trigger: "blur" }],
-  breakDate: [{ required: true, message: "请选择报损日期", trigger: "change" }],
-  operator: [{ required: true, message: "请输入操作员", trigger: "blur" }],
-  breakInfo: [{ required: true, message: "请输入报损原因", trigger: "blur" }],
-};
 
 // 新增
-const breakSub = async ({ validateResult, firstError }) => {
+const breakEvent = async (data) => {
-  if (validateResult === true) {
+  data.breakStatus = 0;
-    dialogData.value.breakStatus = 0;
+  await breakageList.addBreakageList(data);
-    await breakageList.addBreakageList(dialogData.value);
+  getNewTable();
-    getNewTable();
+  MessagePlugin.success("提交成功");
-    MessagePlugin.success("提交成功");
+  visiblePost.value = false;
-    visiblePost.value = false;
-  } else {
-    console.log("Validate Errors: ", firstError, validateResult);
-  }
 };
 
 // 修改
@@ -524,7 +316,7 @@ const breakEdit = (item) => {
   visiblePost.value = true;
   tableData.value.forEach((itemTable) => {
     if (itemTable.id === item.row.id) {
-      dialogData.value = itemTable;
+      editFrom.value = itemTable;
     }
   });
 };

src/pages/finance-bill-manage/billCancel.vue

@@ -16,57 +16,25 @@
             <template #scarchName>
               <t-col :span="3">
                 <t-form-item label="票据编号:" name="billserial">
-                  <t-input
+                  <t-input class="form-item-content" v-model="scarchData.billserial" maxlength="10"></t-input>
-                    class="form-item-content"
-                    v-model="scarchData.billserial"
-                    maxlength="10"
-                  ></t-input>
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="退库日期:" name="appleDate">
-                  <t-date-picker
+                  <t-date-picker class="form-item-content" v-model="scarchData.appleDate" clearable />
-                    class="form-item-content"
-                    v-model="scarchData.appleDate"
-                    clearable
-                  />
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="票据类型:" name="billType">
-                  <t-select
+                  <t-select class="form-item-content" v-model="scarchData.billType" placeholder="请选择票据类型" clearable>
-                    class="form-item-content"
+                    <t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                    v-model="scarchData.billType"
-                    placeholder="请选择票据类型"
-                    clearable
-                  >
-                    <t-option
-                      v-for="item in billType"
-                      :key="item.value"
-                      :value="item.value"
-                      :label="item.label"
-                    ></t-option>
                   </t-select>
                 </t-form-item>
               </t-col>
               <t-col :span="3">
-                <t-form-item
+                <t-form-item label="审批状态:" name="approvalStatus" style="margin-bottom: 0.3rem">
-                  label="审批状态:"
+                  <t-select class="form-item-content" v-model="scarchData.approvalStatus" placeholder="请选择审批状态" clearable>
-                  name="approvalStatus"
+                    <t-option v-for="item in exaStatus" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                  style="margin-bottom: 0.3rem"
-                >
-                  <t-select
-                    class="form-item-content"
-                    v-model="scarchData.approvalStatus"
-                    placeholder="请选择审批状态"
-                    clearable
-                  >
-                    <t-option
-                      v-for="item in approvalStatus"
-                      :key="item.value"
-                      :value="item.value"
-                      :label="item.label"
-                    ></t-option>
                   </t-select>
                 </t-form-item>
               </t-col>
@@ -84,12 +52,7 @@
             <h4 style="font-size: 110%">票据退库列表</h4>
           </div>
           <div>
-            <t-button
+            <t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
-              shape="circle"
-              theme="primary"
-              @click="refresh"
-              style="margin-left: 0.8rem"
-            >
               <template #icon><load-icon /></template>
             </t-button>
           </div>
@@ -104,35 +67,10 @@
           class="table"
           :max-height="550"
         >
-          <template #billType="{ row }">
-            <div v-for="item in billType" :key="item">
-              <span v-if="row.billType === item.value">{{ item.label }}</span>
-            </div>
-          </template>
-          <template #approvalStatus="{ row }">
-            <div v-for="item in approvalStatus" :key="item">
-              <t-tag
-                v-if="row.approvalStatus === item.value"
-                :theme="tagColor(row.approvalStatus)"
-                variant="light"
-              >
-                {{ item.label }}
-              </t-tag>
-            </div>
-          </template>
           <template #status="slotProps">
-            <t-button
+            <t-button theme="default" variant="text" size="small" @click="Approve(slotProps)">
-              theme="default"
+              <span v-if="slotProps.row.approvalStatus === 0">{{ "审批" }}</span>
-              variant="text"
+              <span v-if="slotProps.row.approvalStatus === 3">{{ "重新审批" }}</span>
-              size="small"
-              @click="Approve(slotProps)"
-            >
-              <span v-if="slotProps.row.approvalStatus === 0">{{
-                "审批"
-              }}</span>
-              <span v-if="slotProps.row.approvalStatus === 3">{{
-                "重新审批"
-              }}</span>
             </t-button>
           </template>
         </t-base-table>
@@ -150,87 +88,20 @@
         :confirm-btn="null"
         :cancel-btn="null"
       >
-        <t-space direction="vertical">
+        <list-form :activeForm="'cancel'" @childForm="cancelromEvent" />
-          <div>
-            <t-form
-              ref="formDialog"
-              scroll-to-first-error="smooth"
-              label-align="left"
-              :rules="FORM_RULES"
-              :data="dialogData"
-              :colon="true"
-              @submit="cancelAdd"
-              label-width="calc(2em + 55px)"
-              @reset="onReset"
-            >
-              <t-form-item
-                label="审批人"
-                name="approver"
-                style="margin-bottom: 1.5rem; width: 35rem"
-              >
-                <t-input
-                  v-model="dialogData.approver"
-                  placeholder="请输入审批人"
-                ></t-input>
-              </t-form-item>
-              <t-form-item
-                label="审批时间"
-                name="approvalDate"
-                style="margin-bottom: 1.5rem; width: 35rem"
-              >
-                <t-date-picker
-                  v-model="dialogData.approvalDate"
-                  placeholder="请选择审批时间"
-                  clearable
-                  style="width: 35rem"
-                />
-              </t-form-item>
-              <t-form-item label="审批原因" name="approvalReason">
-                <t-textarea
-                  v-model="dialogData.approvalReason"
-                  placeholder="请输入审批原因"
-                ></t-textarea>
-              </t-form-item>
-              <t-form-item>
-                <t-space size="small">
-                  <t-button theme="primary" type="submit">提交</t-button>
-                  <t-button theme="default" variant="base" type="reset"
-                    >重置</t-button
-                  >
-                </t-space>
-              </t-form-item>
-            </t-form>
-          </div>
-        </t-space>
       </t-dialog>
     </t-space>
   </div>
 </template>
 
-<script setup>
+<script setup lang="jsx">
 import scarchBox from "@/components/scarchBox.vue";
+import listForm from "./form/index.vue";
+import { billType, exaStatus } from "./codeValue/index.js";
 import { ref, onMounted } from "vue";
 import { MessagePlugin } from "tdesign-vue-next";
 import { LoadIcon } from "tdesign-icons-vue-next";
 import { useCancel } from "@/stores/billCancel";
-
-// 票据类型
-const billType = ref([
-  { label: "票据类型1", value: 0 },
-  { label: "票据类型2", value: 1 },
-  { label: "票据类型3", value: 2 },
-  { label: "票据类型4", value: 3 },
-  { label: "票据类型5", value: 4 },
-]);
-
-// 审批状态
-const approvalStatus = ref([
-  { label: "待审批", value: 0 },
-  { label: "审核中", value: 1 },
-  { label: "审核通过", value: 2 },
-  { label: "审核拒绝", value: 3 },
-]);
-
 // 分页
 const pagination = ref({
   defaultCurrent: 1,
@@ -271,6 +142,10 @@ const columns = ref([
     title: "票据类型",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      const type = billType.find((type) => type.value === row.billType);
+      return type ? type.label : "未知";
+    },
   },
   {
     colKey: "cancelNum",
@@ -295,6 +170,14 @@ const columns = ref([
     title: "审批状态",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      const status = exaStatus.find((item) => item.value === row.approvalStatus);
+      return (
+        <t-tag theme={tagColor(row.approvalStatus)} variant="light">
+          {status.label}
+        </t-tag>
+      );
+    },
   },
   {
     colKey: "reason",
@@ -312,16 +195,6 @@ const columns = ref([
   },
 ]);
 
-// 效验规则
-const FORM_RULES = {
-  approver: [{ required: true, message: "请输入审批人", trigger: "blur" }],
-  approvalDate: [
-    { required: true, message: "请选择入库日期", trigger: "change" },
-  ],
-  approvalReason: [
-    { required: true, message: "请输入审批原因", trigger: "blur" },
-  ],
-};
 // 弹出框表单
 const dialogData = ref({
   approver: "",
@@ -365,10 +238,8 @@ const headerQuery = () => {
   tableData.value = data.value;
   if (
     scarchData.value.billserial === "" &&
-    (scarchData.value.billType === undefined ||
+    (scarchData.value.billType === undefined || scarchData.value.billType === "") &&
-      scarchData.value.billType === "") &&
+    (scarchData.value.approvalStatus === undefined || scarchData.value.approvalStatus === "") &&
-    (scarchData.value.approvalStatus === undefined ||
-      scarchData.value.approvalStatus === "") &&
     scarchData.value.appleDate === ""
   ) {
     getNewTable();
@@ -390,10 +261,12 @@ const headerQuery = () => {
       if (
         scarchData.value.billserial === "" &&
         scarchData.value.billType === "" &&
-        scarchData.value.appleDate === ""
+        scarchData.value.appleDate === "" &&
+        scarchData.value.approvalStatus === ""
       ) {
         arrList = item;
       }
+      console.log(arrList);
       return arrList;
     });
     tableData.value = list;
@@ -425,16 +298,17 @@ const Approve = (value) => {
 const onReset = () => {};
 
 //  表单提交
-const cancelAdd = async ({ validateResult, firstError }) => {
+const cancelromEvent = async () => {
-  if (validateResult === true) {
+  rowItem.value.row.approvalStatus = 1;
-    rowItem.value.row.approvalStatus = 1;
+  await cancelList.editApprovalStatus(rowItem.value);
-    await cancelList.editApprovalStatus(rowItem.value);
+  getNewTable();
-    getNewTable();
+  MessagePlugin.success("提交成功");
-    MessagePlugin.success("提交成功");
+  visiblePost.value = false;
-    visiblePost.value = false;
+};
-  } else {
+
-    console.log("Validate Errors: ", firstError, validateResult);
+// 关闭窗口
-  }
+const closePost = () => {
+  visiblePost.value = false;
 };
 
 // 判断menuManagement里面是否存在数据

src/pages/finance-bill-manage/billDestroy.vue

@@ -16,36 +16,18 @@
             <template #scarchName>
               <t-col :span="3">
                 <t-form-item label="票据编号:" name="billserial">
-                  <t-input
+                  <t-input v-model="formData.billserial" class="form-item-content" maxlength="10"></t-input>
-                    v-model="formData.billserial"
-                    class="form-item-content"
-                    maxlength="10"
-                  ></t-input>
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="报损日期:" name="breakDate">
-                  <t-date-picker
+                  <t-date-picker v-model="formData.breakDate" class="form-item-content" clearable />
-                    v-model="formData.breakDate"
-                    class="form-item-content"
-                    clearable
-                  />
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="票据类型:" name="billType">
-                  <t-select
+                  <t-select v-model="formData.billType" placeholder="请选择票据类型" class="form-item-content" clearable>
-                    v-model="formData.billType"
+                    <t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                    placeholder="请选择票据类型"
-                    class="form-item-content"
-                    clearable
-                  >
-                    <t-option
-                      v-for="item in billType"
-                      :key="item.value"
-                      :value="item.value"
-                      :label="item.label"
-                    ></t-option>
                   </t-select>
                 </t-form-item>
               </t-col>
@@ -63,12 +45,7 @@
             <h4 style="font-size: 110%">票据核销列表</h4>
           </div>
           <div>
-            <t-button
+            <t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
-              shape="circle"
-              theme="primary"
-              @click="refresh"
-              style="margin-left: 0.8rem"
-            >
               <template #icon><load-icon /></template>
             </t-button>
           </div>
@@ -83,22 +60,8 @@
           class="table"
           :height="550"
         >
-          <template #breakNum="{ row }">
-            {{ `${row.breakNum}张` }}
-          </template>
-          <template #billType="{ row }">
-            <div v-for="item in billType" :key="item">
-              <span v-if="row.billType === item.value">{{ item.label }}</span>
-            </div>
-          </template>
           <template #status="slotProps">
-            <t-button
+            <t-button theme="default" variant="text" size="small" @click="breakEdit(slotProps)">审核</t-button>
-              theme="default"
-              variant="text"
-              size="small"
-              @click="breakEdit(slotProps)"
-              >审核</t-button
-            >
           </template>
         </t-base-table>
       </t-content>
@@ -114,53 +77,7 @@
         :confirm-btn="null"
         :cancel-btn="null"
       >
-        <t-space direction="vertical" style="width: 100%">
+        <list-form :activeForm="'destroy'" @childForm="destroyEvent" />
-          <div>
-            <t-form
-              ref="formDialog"
-              scroll-to-first-error="smooth"
-              label-align="left"
-              :rules="FORM_RULES"
-              :data="dialogData"
-              :colon="true"
-              @submit="breakSub"
-              label-width="calc(2em + 55px)"
-              layout="inline"
-              @reset="onReset"
-            >
-              <t-form-item
-                label="审核状态"
-                name="Status"
-                style="margin-bottom: 0.5rem"
-              >
-                <t-radio-group v-model="dialogData.Status">
-                  <t-radio value="1" @click="refuse = false">审核通过</t-radio>
-                  <t-radio value="2" @click="refuse = true">审核拒绝</t-radio>
-                </t-radio-group>
-              </t-form-item>
-              <t-form-item />
-              <t-form-item
-                label="拒绝原因"
-                name="refuseInfo"
-                v-if="refuse"
-                style="width: 33.6rem; margin-bottom: 0.5rem"
-              >
-                <t-textarea
-                  v-model="dialogData.refuseInfo"
-                  placeholder="请输入备注"
-                ></t-textarea>
-              </t-form-item>
-              <t-form-item>
-                <t-space size="small">
-                  <t-button theme="primary" type="submit">提交</t-button>
-                  <t-button theme="default" variant="base" type="reset"
-                    >重置</t-button
-                  >
-                </t-space>
-              </t-form-item>
-            </t-form>
-          </div>
-        </t-space>
       </t-dialog>
     </t-space>
   </div>
@@ -168,6 +85,8 @@
 
 <script setup>
 import scarchBox from "@/components/scarchBox.vue";
+import listForm from "./form/index.vue";
+import { billType, billStatus } from "./codeValue/index";
 import { ref, onMounted } from "vue";
 import { MessagePlugin } from "tdesign-vue-next";
 import { AddIcon, LoadIcon } from "tdesign-icons-vue-next";
@@ -176,11 +95,11 @@ import { useDestroy } from "@/stores/billDestroy";
 // 数据
 const loading = ref(false);
 const visiblePost = ref(false);
-const refuse = ref(false);
+
 const destroyList = useDestroy();
 const tableData = ref([]);
 const data = ref([]);
-const headerTitle = ref("");
+const headerTitle = ref("审核");
 const rowItem = ref({});
 // 表格表头
 const columns = ref([
@@ -200,12 +119,19 @@ const columns = ref([
     title: "票据类型",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      const type = billType.find((type) => type.value === row.billType);
+      return type ? type.label : "未知";
+    },
   },
   {
     colKey: "breakNum",
     title: "报损数量",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      return `${row.breakNum}张`;
+    },
   },
   {
     colKey: "breakDate",
@@ -235,22 +161,6 @@ const columns = ref([
   },
 ]);
 
-// 票据类型
-const billType = ref([
-  { label: "票据类型1", value: 0 },
-  { label: "票据类型2", value: 1 },
-  { label: "票据类型3", value: 2 },
-  { label: "票据类型4", value: 3 },
-  { label: "票据类型5", value: 4 },
-]);
-
-// 审批状态
-const breakStatus = ref([
-  { label: "审核中", value: 0 },
-  { label: "审核通过", value: 1 },
-  { label: "审核拒绝", value: 2 },
-]);
-
 // 获取票据列表
 const tableList = async () => {
   loading.value = true;
@@ -268,12 +178,6 @@ const refresh = () => {
   tableList();
 };
 
-// 弹出框表单
-const dialogData = ref({
-  refuseInfo: "",
-  Status: "",
-});
-
 // 查询表单
 const formData = ref({
   billserial: "",
@@ -321,11 +225,7 @@ const headerQuery = () => {
       if (formData.value.breakDate === item.breakDate) {
         arrList = item;
       }
-      if (
+      if (formData.value.billserial === "" && formData.value.billType === "" && formData.value.breakDate === "") {
-        formData.value.billserial === "" &&
-        formData.value.billType === "" &&
-        formData.value.breakDate === ""
-      ) {
         arrList = item;
       }
       return arrList;
@@ -337,36 +237,23 @@ const headerQuery = () => {
 // 打开窗口
 const breakageAdd = () => {
   visiblePost.value = true;
-  dialogData.value = {
-    refuseInfo: "",
-    Status: "",
-  };
 };
 
 // 关闭窗口
 const closePost = () => {
   visiblePost.value = false;
 };
-// 表单校验
-const FORM_RULES = {
-  Status: [{ required: true, message: "请选择审批状态", trigger: "change" }],
-  refuseInfo: [{ required: true, message: "请输入拒绝原因", trigger: "blur" }],
-};
 
 // 新增
-const breakSub = async ({ validateResult, firstError }) => {
+const destroyEvent = async (data) => {
-  if (validateResult === true) {
+  data = {
-    dialogData.value = {
+    ...rowItem.value.row,
-      ...rowItem.value.row,
+    breakStatus: Number(data.Status),
-      breakStatus: Number(dialogData.value.Status),
+  };
-    };
+  await destroyList.auditDestroyList(data);
-    await destroyList.auditDestroyList(dialogData.value);
+  getNewTable();
-    getNewTable();
+  visiblePost.value = false;
-    visiblePost.value = false;
+  MessagePlugin.success("提交成功");
-    MessagePlugin.success("提交成功");
-  } else {
-    console.log("Validate Errors: ", firstError, validateResult);
-  }
 };
 
 // 审核

src/pages/finance-bill-manage/billDraw.vue

@@ -16,36 +16,18 @@
             <template #scarchName>
               <t-col :span="3">
                 <t-form-item label="票据编号:" name="billserial">
-                  <t-input
+                  <t-input v-model="formData.billserial" class="form-item-content" maxlength="10"></t-input>
-                    v-model="formData.billserial"
-                    class="form-item-content"
-                    maxlength="10"
-                  ></t-input>
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="入库日期:" name="stockDate">
-                  <t-date-picker
+                  <t-date-picker v-model="formData.stockDate" class="form-item-content" clearable />
-                    v-model="formData.stockDate"
-                    class="form-item-content"
-                    clearable
-                  />
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="票据类型:" name="billType">
-                  <t-select
+                  <t-select v-model="formData.billType" placeholder="请选择票据类型" class="form-item-content" clearable>
-                    v-model="formData.billType"
+                    <t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                    placeholder="请选择票据类型"
-                    class="form-item-content"
-                    clearable
-                  >
-                    <t-option
-                      v-for="item in billType"
-                      :key="item.value"
-                      :value="item.value"
-                      :label="item.label"
-                    ></t-option>
                   </t-select>
                 </t-form-item>
               </t-col>
@@ -63,12 +45,7 @@
             <h4 style="font-size: 110%">票据列表</h4>
           </div>
           <div>
-            <t-button
+            <t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
-              shape="circle"
-              theme="primary"
-              @click="refresh"
-              style="margin-left: 0.8rem"
-            >
               <template #icon><load-icon /></template>
             </t-button>
           </div>
@@ -83,22 +60,8 @@
           class="table"
           :max-height="550"
         >
-          <template #stockNum="{ row }">
-            {{ `${row.stockNum}张` }}
-          </template>
-          <template #billType="{ row }">
-            <div v-for="item in billType" :key="item">
-              <span v-if="row.billType === item.value">{{ item.label }}</span>
-            </div>
-          </template>
           <template #status="slotProps">
-            <t-button
+            <t-button theme="default" variant="text" size="small" @click="exportPdf(slotProps)">导出pdf</t-button>
-              theme="default"
-              variant="text"
-              size="small"
-              @click="exportPdf(slotProps)"
-              >导出pdf</t-button
-            >
           </template>
         </t-base-table>
       </t-content>
@@ -108,6 +71,7 @@
 
 <script setup>
 import scarchBox from "@/components/scarchBox.vue";
+import { billType } from "./codeValue/index";
 import { ref, onMounted } from "vue";
 import { MessagePlugin } from "tdesign-vue-next";
 import { LoadIcon } from "tdesign-icons-vue-next";
@@ -137,12 +101,19 @@ const columns = ref([
     title: "票据类型",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      const type = billType.find((type) => type.value === row.billType);
+      return type ? type.label : "未知";
+    },
   },
   {
     colKey: "stockNum",
     title: "入库数量",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      return `${row.stockNum}张`;
+    },
   },
   {
     colKey: "stockDate",
@@ -171,15 +142,6 @@ const columns = ref([
   },
 ]);
 
-// 票据类型
-const billType = ref([
-  { label: "票据类型1", value: 0 },
-  { label: "票据类型2", value: 1 },
-  { label: "票据类型3", value: 2 },
-  { label: "票据类型4", value: 3 },
-  { label: "票据类型5", value: 4 },
-]);
-
 // 获取票据列表
 const tableList = async () => {
   loading.value = true;
@@ -242,11 +204,7 @@ const headerQuery = () => {
       if (formData.value.stockDate === item.stockDate) {
         arrList = item;
       }
-      if (
+      if (formData.value.billserial === "" && formData.value.billType === "" && formData.value.stockDate === "") {
-        formData.value.billserial === "" &&
-        formData.value.billType === "" &&
-        formData.value.stockDate === ""
-      ) {
         arrList = item;
       }
       return arrList;

src/pages/finance-bill-manage/billQuitneck.vue

@@ -16,10 +16,7 @@
         </t-space>
       </t-aside>
       <t-content>
-        <t-layout
+        <t-layout style="height: 100%; background-color: #f5f7fb" v-if="pageJudge">
-          style="height: 100%; background-color: #f5f7fb"
-          v-if="pageJudge"
-        >
           <t-header class="scarch-box">
             <t-form
               ref="form"
@@ -35,40 +32,18 @@
                 <template #scarchName>
                   <t-col :span="3">
                     <t-form-item label="票据编号:" name="billserial">
-                      <t-input
+                      <t-input class="form-item-content" v-model="scarchData.billserial" maxlength="10"></t-input>
-                        class="form-item-content"
-                        v-model="scarchData.billserial"
-                        maxlength="10"
-                      ></t-input>
                     </t-form-item>
                   </t-col>
                   <t-col :span="3">
                     <t-form-item label="领用时间:" name="quitneckDate">
-                      <t-date-picker
+                      <t-date-picker class="form-item-content" v-model="scarchData.quitneckDate" clearable />
-                        class="form-item-content"
-                        v-model="scarchData.quitneckDate"
-                        clearable
-                      />
                     </t-form-item>
                   </t-col>
                   <t-col :span="3">
-                    <t-form-item
+                    <t-form-item label="票据类型:" name="billType" style="margin-bottom: 0.3rem">
-                      label="票据类型:"
+                      <t-select class="form-item-content" v-model="scarchData.billType" placeholder="请选择票据类型" clearable>
-                      name="billType"
+                        <t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                      style="margin-bottom: 0.3rem"
-                    >
-                      <t-select
-                        class="form-item-content"
-                        v-model="scarchData.billType"
-                        placeholder="请选择票据类型"
-                        clearable
-                      >
-                        <t-option
-                          v-for="item in billType"
-                          :key="item.value"
-                          :value="item.value"
-                          :label="item.label"
-                        ></t-option>
                       </t-select>
                     </t-form-item>
                   </t-col>
@@ -86,12 +61,7 @@
                 <h4 style="font-size: 110%">票据退领列表</h4>
               </div>
               <div>
-                <t-button
+                <t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
-                  shape="circle"
-                  theme="primary"
-                  @click="refresh"
-                  style="margin-left: 0.8rem"
-                >
                   <template #icon><load-icon /></template>
                 </t-button>
               </div>
@@ -105,18 +75,7 @@
               :pagination="pagination"
               class="table"
               :max-height="550"
-            >
+            />
-              <template #billType="{ row }">
-                <div v-for="item in billType" :key="item">
-                  <span v-if="row.billType === item.value">{{
-                    item.label
-                  }}</span>
-                </div>
-              </template>
-              <template #quitneckNum="{ row }">
-                {{ `${row.quitneckNum}张` }}
-              </template>
-            </t-base-table>
           </t-content>
         </t-layout>
         <t-layout class="layoutPage" v-else>
@@ -129,6 +88,7 @@
 
 <script setup>
 import scarchBox from "@/components/scarchBox.vue";
+import { billType } from "./codeValue/index.js";
 import { ref, onMounted, nextTick } from "vue";
 import { MessagePlugin } from "tdesign-vue-next";
 import { LoadIcon } from "tdesign-icons-vue-next";
@@ -166,12 +126,19 @@ const columns = ref([
     title: "票据类型",
     align: "center",
     width: 100,
+    cell: (h, { row }) => {
+      const type = billType.find((type) => type.value === row.billType);
+      return type ? type.label : "未知";
+    },
   },
   {
     colKey: "quitneckNum",
     title: "退领数量",
     align: "center",
     width: 100,
+    cell: (h, { row }) => {
+      return `${row.quitneckNum}张`;
+    },
   },
   {
     colKey: "quitneckDate",
@@ -187,14 +154,6 @@ const columns = ref([
     width: 200,
   },
 ]);
-// 票据类型
-const billType = ref([
-  { label: "票据类型1", value: 0 },
-  { label: "票据类型2", value: 1 },
-  { label: "票据类型3", value: 2 },
-  { label: "票据类型4", value: 3 },
-  { label: "票据类型5", value: 4 },
-]);
 
 // 查询表单
 const scarchData = ref({});
@@ -214,17 +173,11 @@ const personList = async () => {
 // 查询
 const headerQuery = () => {
   tableData.value = data.value;
-  console.log(
+  console.log(scarchData.value.billserial, scarchData.value.billType, scarchData.value.quitneckDate);
-    scarchData.value.billserial,
-    scarchData.value.billType,
-    scarchData.value.quitneckDate
-  );
   if (
     scarchData.value.billserial === "" &&
-    (scarchData.value.billType === undefined ||
+    (scarchData.value.billType === undefined || scarchData.value.billType === "") &&
-      scarchData.value.billType === "") &&
+    (scarchData.value.quitneckDate === undefined || scarchData.value.quitneckDate === "")
-    (scarchData.value.quitneckDate === undefined ||
-      scarchData.value.quitneckDate === "")
   ) {
     tableData.value = data.value;
     pagination.value.total = tableData.value.length;
@@ -240,11 +193,7 @@ const headerQuery = () => {
       if (scarchData.value.quitneckDate === item.quitneckDate) {
         arrList = item;
       }
-      if (
+      if (scarchData.value.billserial === "" && scarchData.value.billType === "" && scarchData.value.quitneckDate === "") {
-        scarchData.value.billserial === "" &&
-        scarchData.value.billType === "" &&
-        scarchData.value.quitneckDate === ""
-      ) {
         arrList = item;
       }
       console.log(arrList);
@@ -291,11 +240,11 @@ const onClick = async (context) => {
     clearInterval(timerId);
   }, 300);
 };
-// 刷新列表
+// // 刷新列表
-const refresh = () => {
+// const refresh = () => {
-  getTableData();
+//   getTableData();
-  pagination.value.total = tableData.value.length;
+//   pagination.value.total = tableData.value.length;
-};
+// };
 // 判断ReceiptList里面是否存在数据
 const getPersonName = () => {
   let arr = JSON.parse(localStorage.getItem("ReceiptList"));

src/pages/finance-bill-manage/billReceipt.vue

@@ -32,40 +32,18 @@
                 <template #scarchName>
                   <t-col :span="3">
                     <t-form-item label="票据编号:" name="billserial">
-                      <t-input
+                      <t-input class="form-item-content" v-model="scarchData.billserial" maxlength="10"></t-input>
-                        class="form-item-content"
-                        v-model="scarchData.billserial"
-                        maxlength="10"
-                      ></t-input>
                     </t-form-item>
                   </t-col>
                   <t-col :span="3">
                     <t-form-item label="领用时间:" name="receiptDate">
-                      <t-date-picker
+                      <t-date-picker class="form-item-content" v-model="scarchData.receiptDate" clearable />
-                        class="form-item-content"
-                        v-model="scarchData.receiptDate"
-                        clearable
-                      />
                     </t-form-item>
                   </t-col>
                   <t-col :span="3">
-                    <t-form-item
+                    <t-form-item label="票据类型:" name="billType" style="margin-bottom: 0.3rem">
-                      label="票据类型:"
+                      <t-select class="form-item-content" v-model="scarchData.billType" placeholder="请选择票据类型" clearable>
-                      name="billType"
+                        <t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                      style="margin-bottom: 0.3rem"
-                    >
-                      <t-select
-                        class="form-item-content"
-                        v-model="scarchData.billType"
-                        placeholder="请选择票据类型"
-                        clearable
-                      >
-                        <t-option
-                          v-for="item in billType"
-                          :key="item.value"
-                          :value="item.value"
-                          :label="item.label"
-                        ></t-option>
                       </t-select>
                     </t-form-item>
                   </t-col>
@@ -83,12 +61,7 @@
                 <h4 style="font-size: 110%">票据领用列表</h4>
               </div>
               <div>
-                <t-button
+                <t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
-                  shape="circle"
-                  theme="primary"
-                  @click="refresh"
-                  style="margin-left: 0.8rem"
-                >
                   <template #icon><load-icon /></template>
                 </t-button>
               </div>
@@ -103,16 +76,6 @@
               class="table"
               :max-height="550"
             >
-              <template #billType="{ row }">
-                <div v-for="item in billType" :key="item">
-                  <span v-if="row.billType === item.value">{{
-                    item.label
-                  }}</span>
-                </div>
-              </template>
-              <template #receiptNum="{ row }">
-                {{ `${row.receiptNum}张` }}
-              </template>
               <template #status="slotProps">
                 <t-button
                   theme="default"
@@ -139,59 +102,7 @@
         :confirm-btn="null"
         :cancel-btn="null"
       >
-        <t-space direction="vertical">
+        <list-form :activeForm="'receipt'" @childForm="receiptromEvent" />
-          <div>
-            <t-form
-              ref="formDialog"
-              scroll-to-first-error="smooth"
-              label-align="left"
-              :rules="FORM_RULES"
-              :data="dialogData"
-              :colon="true"
-              @submit="quitneckAdd"
-              label-width="calc(2em + 55px)"
-              @reset="onReset"
-            >
-              <t-form-item
-                label="退领张数"
-                name="quitneckNum"
-                style="margin-bottom: 1.5rem; width: 35rem"
-              >
-                <t-input
-                  v-model="dialogData.quitneckNum"
-                  type="number"
-                  placeholder="请输入退领张数"
-                ></t-input>
-              </t-form-item>
-              <t-form-item
-                label="退领时间"
-                name="quitneckDate"
-                style="margin-bottom: 1.5rem; width: 35rem"
-              >
-                <t-date-picker
-                  v-model="dialogData.quitneckDate"
-                  placeholder="请选择退领时间"
-                  clearable
-                  style="width: 35rem"
-                />
-              </t-form-item>
-              <t-form-item label="退领原因" name="quitneckReason">
-                <t-textarea
-                  v-model="dialogData.quitneckReason"
-                  placeholder="请输入退领原因"
-                ></t-textarea>
-              </t-form-item>
-              <t-form-item>
-                <t-space size="small">
-                  <t-button theme="primary" type="submit">提交</t-button>
-                  <t-button theme="default" variant="base" type="reset"
-                    >重置</t-button
-                  >
-                </t-space>
-              </t-form-item>
-            </t-form>
-          </div>
-        </t-space>
       </t-dialog>
     </t-space>
   </div>
@@ -199,6 +110,8 @@
 
 <script setup>
 import scarchBox from "@/components/scarchBox.vue";
+import listForm from "./form/index.vue";
+import { billType } from "./codeValue/index";
 import { ref, onMounted, nextTick } from "vue";
 import { MessagePlugin } from "tdesign-vue-next";
 import { LoadIcon } from "tdesign-icons-vue-next";
@@ -235,12 +148,19 @@ const columns = ref([
     title: "票据类型",
     align: "center",
     width: 100,
+    cell: (h, { row }) => {
+      const type = billType.find((type) => type.value === row.billType);
+      return type ? type.label : "未知";
+    },
   },
   {
     colKey: "receiptNum",
     title: "领用数量",
     align: "center",
     width: 100,
+    cell: (h, { row }) => {
+      return `${row.receiptNum}张`;
+    },
   },
   {
     colKey: "receiptDate",
@@ -263,19 +183,6 @@ const columns = ref([
     fixed: "right",
   },
 ]);
-// 票据类型
-const billType = ref([
-  { label: "票据类型1", value: 0 },
-  { label: "票据类型2", value: 1 },
-  { label: "票据类型3", value: 2 },
-  { label: "票据类型4", value: 3 },
-  { label: "票据类型5", value: 4 },
-]);
-const dialogData = ref({
-  quitneckDate: "",
-  quitneckReason: "",
-  quitneckNum: "",
-});
 
 // 查询表单
 const scarchData = ref({
@@ -294,31 +201,13 @@ const personList = async () => {
   personName.value = await receiptList.getPersonNameList();
 };
 
-// 效验规则
-const FORM_RULES = {
-  quitneckNum: [{ required: true, message: "请输入退领张数", trigger: "blur" }],
-  quitneckDate: [
-    { required: true, message: "请选择退领日期", trigger: "change" },
-  ],
-  quitneckReason: [
-    { required: true, message: "请输入退领原因", trigger: "blur" },
-  ],
-};
-
 // 查询
 const headerQuery = () => {
   tableData.value = data.value;
-  console.log(
-    scarchData.value.billserial,
-    scarchData.value.billType,
-    scarchData.value.receiptDate
-  );
   if (
     scarchData.value.billserial === "" &&
-    (scarchData.value.billType === undefined ||
+    (scarchData.value.billType === undefined || scarchData.value.billType === "") &&
-      scarchData.value.billType === "") &&
+    (scarchData.value.receiptDate === undefined || scarchData.value.receiptDate === "")
-    (scarchData.value.receiptDate === undefined ||
-      scarchData.value.receiptDate === "")
   ) {
     getNewTable();
   } else {
@@ -333,11 +222,7 @@ const headerQuery = () => {
       if (scarchData.value.receiptDate === item.receiptDate) {
         arrList = item;
       }
-      if (
+      if (scarchData.value.billserial === "" && scarchData.value.billType === "" && scarchData.value.receiptDate === "") {
-        scarchData.value.billserial === "" &&
-        scarchData.value.billType === "" &&
-        scarchData.value.receiptDate === ""
-      ) {
         arrList = item;
       }
       return arrList;
@@ -355,32 +240,25 @@ const resetting = () => {
   };
   getNewTable();
 };
+
+// 退领按钮弹窗
 const Quitneck = (value) => {
-  dialogData.value = {
-    quitneckDate: "",
-    quitneckReason: "",
-    quitneckNum: "",
-  };
   visiblePost.value = true;
   rowItem.value = value;
 };
-//  表单提交
+
-const quitneckAdd = async ({ validateResult, firstError }) => {
+const receiptromEvent = async (data) => {
-  if (validateResult === true) {
+  if (rowItem.value.row.receiptNum - data.quitneckNum < 0) {
-    if (rowItem.value.row.receiptNum - dialogData.value.quitneckNum < 0) {
+    return MessagePlugin.error("退领数量不能大于领用数量");
-      return MessagePlugin.error("退领数量不能大于领用数量");
-    }
-    dialogData.value.id = rowItem.value.row.id;
-    dialogData.value.billserial = rowItem.value.row.billserial;
-    dialogData.value.billType = rowItem.value.row.billType;
-    dialogData.value.proposer = rowItem.value.row.proposer;
-    await receiptList.getquitneckNum(dialogData.value);
-    getTableData();
-    MessagePlugin.success("提交成功");
-    visiblePost.value = false;
-  } else {
-    console.log("Validate Errors: ", firstError, validateResult);
   }
+  data.id = rowItem.value.row.id;
+  data.billserial = rowItem.value.row.billserial;
+  data.billType = rowItem.value.row.billType;
+  data.proposer = rowItem.value.row.proposer;
+  await receiptList.getquitneckNum(data);
+  getTableData();
+  MessagePlugin.success("提交成功");
+  visiblePost.value = false;
 };
 const onClick = async (context) => {
   // 判断是否为顶层节点（无父节点）
@@ -429,9 +307,7 @@ const getTableData = async () => {
   } else {
     await nextTick();
     // 找到第一个具有子节点的节点并模拟点击
-    const firstNodeWithChildren = personName.value.find(
+    const firstNodeWithChildren = personName.value.find((node) => Array.isArray(node.children) && node.children.length > 0);
-      (node) => Array.isArray(node.children) && node.children.length > 0
-    );
     if (firstNodeWithChildren) {
       const simulatedContext = {
         node: {

src/pages/finance-bill-manage/billStock.vue

@@ -16,36 +16,18 @@
             <template #scarchName>
               <t-col :span="3">
                 <t-form-item label="票据编号:" name="billserial">
-                  <t-input
+                  <t-input v-model="formData.billserial" class="form-item-content" maxlength="10"></t-input>
-                    v-model="formData.billserial"
-                    class="form-item-content"
-                    maxlength="10"
-                  ></t-input>
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="入库日期:" name="stockDate">
-                  <t-date-picker
+                  <t-date-picker v-model="formData.stockDate" class="form-item-content" clearable />
-                    v-model="formData.stockDate"
-                    class="form-item-content"
-                    clearable
-                  />
                 </t-form-item>
               </t-col>
               <t-col :span="3">
                 <t-form-item label="票据类型:" name="billType">
-                  <t-select
+                  <t-select v-model="formData.billType" placeholder="请选择票据类型" class="form-item-content" clearable>
-                    v-model="formData.billType"
+                    <t-option v-for="item in billType" :key="item.value" :value="item.value" :label="item.label"></t-option>
-                    placeholder="请选择票据类型"
-                    class="form-item-content"
-                    clearable
-                  >
-                    <t-option
-                      v-for="item in billType"
-                      :key="item.value"
-                      :value="item.value"
-                      :label="item.label"
-                    ></t-option>
                   </t-select>
                 </t-form-item>
               </t-col>
@@ -67,12 +49,7 @@
               <template #icon><add-icon /></template>
               新增票据
             </t-button>
-            <t-button
+            <t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
-              shape="circle"
-              theme="primary"
-              @click="refresh"
-              style="margin-left: 0.8rem"
-            >
               <template #icon><load-icon /></template>
             </t-button>
           </div>
@@ -87,29 +64,10 @@
           class="table"
           :max-height="550"
         >
-          <template #stockNum="{ row }">
-            {{ `${row.stockNum}张` }}
-          </template>
-          <template #billType="{ row }">
-            <div v-for="item in billType" :key="item">
-              <span v-if="row.billType === item.value">{{ item.label }}</span>
-            </div>
-          </template>
           <template #status="slotProps">
-            <t-button
+            <t-button theme="default" variant="text" size="small" @click="stockEdit(slotProps)">修改</t-button>
-              theme="default"
+            <t-popconfirm content="确认删除吗" @confirm="stockDelete(slotProps)">
-              variant="text"
+              <t-button theme="default" variant="text" size="small">删除</t-button>
-              size="small"
-              @click="stockEdit(slotProps)"
-              >修改</t-button
-            >
-            <t-popconfirm
-              content="确认删除吗"
-              @confirm="stockDelete(slotProps)"
-            >
-              <t-button theme="default" variant="text" size="small"
-                >删除</t-button
-              >
             </t-popconfirm>
           </template>
         </t-base-table>
@@ -126,103 +84,7 @@
         :confirm-btn="null"
         :cancel-btn="null"
       >
-        <t-space direction="vertical" style="width: 100%">
+        <list-form :activeForm="'stock'" @childForm="stockromEvent" :editFrom="editFrom" />
-          <div>
-            <t-form
-              ref="formDialog"
-              scroll-to-first-error="smooth"
-              label-align="left"
-              :rules="FORM_RULES"
-              :data="dialogData"
-              :colon="true"
-              @submit="stockAdd"
-              label-width="calc(2em + 55px)"
-              layout="inline"
-              @reset="onReset"
-            >
-              <t-form-item
-                label="票据编号"
-                name="billserial"
-                :span="10"
-                style="margin-bottom: 0.5rem"
-              >
-                <t-input
-                  v-model="dialogData.billserial"
-                  placeholder="请输入票据编号"
-                  maxlength="10"
-                ></t-input>
-              </t-form-item>
-              <t-form-item
-                label="票据类型"
-                name="billType"
-                :span="12"
-                style="width: 16rem; margin-bottom: 0.5rem"
-              >
-                <t-select
-                  v-model="dialogData.billType"
-                  clearable
-                  placeholder="请选择票据类型"
-                >
-                  <t-option
-                    v-for="item in billType"
-                    :key="item.value"
-                    :label="item.label"
-                    :value="item.value"
-                  />
-                </t-select>
-              </t-form-item>
-              <t-form-item
-                label="入库数量"
-                name="stockNum"
-                :span="12"
-                style="margin-bottom: 0.5rem"
-              >
-                <t-input
-                  type="number"
-                  v-model="dialogData.stockNum"
-                  placeholder="请输入入库数量"
-                ></t-input>
-              </t-form-item>
-              <t-form-item
-                label="入库时间"
-                name="stockDate"
-                :span="10"
-                style="width: 16rem; margin-bottom: 0.5rem"
-              >
-                <t-date-picker
-                  v-model="dialogData.stockDate"
-                  placeholder="请选择入库时间"
-                  clearable
-                />
-              </t-form-item>
-              <t-form-item
-                label="操作员"
-                name="operator"
-                :span="10"
-                style="margin-bottom: 0.5rem"
-              >
-                <t-input
-                  v-model="dialogData.operator"
-                  placeholder="请输入操作员"
-                ></t-input>
-              </t-form-item>
-              <t-form-item label="备注" name="remark" style="width: 33.6rem">
-                <t-textarea
-                  v-model="dialogData.remark"
-                  placeholder="请输入备注"
-                ></t-textarea>
-              </t-form-item>
-              <t-form-item>
-                <t-space size="small">
-                  <t-button theme="primary" type="submit">提交</t-button>
-                  <t-button theme="default" variant="base" type="reset"
-                    >重置</t-button
-                  >
-                </t-space>
-              </t-form-item>
-            </t-form>
-          </div>
-        </t-space>
       </t-dialog>
     </t-space>
   </div>
@@ -230,16 +92,19 @@
 
 <script setup>
 import scarchBox from "@/components/scarchBox.vue";
+import listForm from "./form/index.vue";
 import { ref, onMounted } from "vue";
 import { MessagePlugin } from "tdesign-vue-next";
 import { AddIcon, LoadIcon } from "tdesign-icons-vue-next";
 import { useStock } from "@/stores/billStock";
+import { billType } from "./codeValue/index";
 
 // 数据
 const loading = ref(false);
 const visiblePost = ref(false);
 const stockList = useStock();
 const tableData = ref();
+const editFrom = ref();
 const data = ref();
 // 表格表头
 const columns = ref([
@@ -259,12 +124,19 @@ const columns = ref([
     title: "票据类型",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      const type = billType.find((type) => type.value === row.billType);
+      return type ? type.label : "未知";
+    },
   },
   {
     colKey: "stockNum",
     title: "入库数量",
     align: "center",
     width: "100",
+    cell: (h, { row }) => {
+      return `${row.stockNum}张`;
+    },
   },
   {
     colKey: "stockDate",
@@ -293,15 +165,6 @@ const columns = ref([
   },
 ]);
 
-// 票据类型
-const billType = ref([
-  { label: "票据类型1", value: 0 },
-  { label: "票据类型2", value: 1 },
-  { label: "票据类型3", value: 2 },
-  { label: "票据类型4", value: 3 },
-  { label: "票据类型5", value: 4 },
-]);
-
 // 获取票据列表
 const tableList = async () => {
   loading.value = true;
@@ -319,16 +182,6 @@ const refresh = () => {
   tableList();
 };
 
-// 弹出框表单
-const dialogData = ref({
-  billserial: "",
-  stockNum: Number,
-  unit: "",
-  operator: "",
-  remark: "",
-  stockDate: "",
-});
-
 // 查询表单
 const formData = ref({
   billserial: "",
@@ -374,11 +227,7 @@ const headerQuery = () => {
       if (formData.value.stockDate === item.stockDate) {
         arrList = item;
       }
-      if (
+      if (formData.value.billserial === "" && formData.value.billType === "" && formData.value.stockDate === "") {
-        formData.value.billserial === "" &&
-        formData.value.billType === "" &&
-        formData.value.stockDate === ""
-      ) {
         arrList = item;
       }
       return arrList;
@@ -391,48 +240,26 @@ const headerQuery = () => {
 // 打开窗口
 const addStock = () => {
   visiblePost.value = true;
-  dialogData.value = {
+};
-    billserial: "",
+
-    stockNum: "",
+const stockromEvent = async (data) => {
-    unit: "",
+  await stockList.addStockList(data);
-    operator: "",
+  getNewTable();
-    remark: "",
+  MessagePlugin.success("提交成功");
-    stockDate: "",
+  visiblePost.value = false;
-  };
 };
 
 // 关闭窗口
 const closePost = () => {
   visiblePost.value = false;
 };
-// 表单校验
-const FORM_RULES = {
-  billserial: [{ required: true, message: "请输入票据编号", trigger: "blur" }],
-  billType: [{ required: true, message: "请选择票据类型", trigger: "change" }],
-  stockNum: [{ required: true, message: "请输入库存数量", trigger: "blur" }],
-  unit: [{ required: true, message: "请输入单位", trigger: "blur" }],
-  stockDate: [{ required: true, message: "请选择入库日期", trigger: "change" }],
-  operator: [{ required: true, message: "请输入操作员", trigger: "blur" }],
-};
-
-// 新增
-const stockAdd = async ({ validateResult, firstError }) => {
-  if (validateResult === true) {
-    await stockList.addStockList(dialogData.value);
-    getNewTable();
-    MessagePlugin.success("提交成功");
-    visiblePost.value = false;
-  } else {
-    console.log("Validate Errors: ", firstError, validateResult);
-  }
-};
 
 // 修改
 const stockEdit = (item) => {
   visiblePost.value = true;
   tableData.value.forEach((itemTable) => {
     if (itemTable.id === item.row.id) {
-      dialogData.value = itemTable;
+      editFrom.value = itemTable;
     }
   });
 };
@@ -443,9 +270,6 @@ const stockDelete = async (itme) => {
   getNewTable();
 };
 
-// 弹出框表单重置
-const onReset = () => {};
-
 // 判断menuManagement里面是否存在数据
 const getNewTable = () => {
   let arr = JSON.parse(localStorage.getItem("menuManagement"));

src/pages/finance-bill-manage/codeValue/index.js

@@ -0,0 +1,22 @@
+// 票据类型
+export const billType = [
+  { label: "票据类型1", value: 0 },
+  { label: "票据类型2", value: 1 },
+  { label: "票据类型3", value: 2 },
+  { label: "票据类型4", value: 3 },
+  { label: "票据类型5", value: 4 },
+];
+
+// 状态
+export const billStatus = [
+  { label: "审核中", value: 0 },
+  { label: "审核通过", value: 1 },
+  { label: "审核拒绝", value: 2 },
+];
+// 审批状态
+export const exaStatus = [
+  { label: "待审批", value: 0 },
+  { label: "审核中", value: 1 },
+  { label: "审核通过", value: 2 },
+  { label: "审核拒绝", value: 3 },
+];

src/pages/finance-bill-manage/detailReport.vue

@@ -16,10 +16,7 @@
             <template #scarchName>
               <t-col :span="3" style="padding-left: 0">
                 <t-form-item label="部门:" name="branch">
-                  <t-input
+                  <t-input v-model="scarchData.branch" class="form-item-content"></t-input>
-                    v-model="scarchData.branch"
-                    class="form-item-content"
-                  ></t-input>
                 </t-form-item>
               </t-col>
             </template>
@@ -36,15 +33,8 @@
             <h4 style="font-size: 110%">报表明细</h4>
           </div>
           <div>
-            <t-button theme="primary" size="small" @click="exportExcel">
+            <t-button theme="primary" size="small" @click="exportExcel"> 导出报表明细 </t-button>
-              导出报表明细
+            <t-button shape="circle" theme="primary" @click="refresh" style="margin-left: 0.8rem">
-            </t-button>
-            <t-button
-              shape="circle"
-              theme="primary"
-              @click="refresh"
-              style="margin-left: 0.8rem"
-            >
               <template #icon><load-icon /></template>
             </t-button>
           </div>
@@ -59,9 +49,6 @@
           class="table"
           :max-height="550"
         >
-          <template #quitneckNum="{ row }">
-            {{ `${row.quitneckNum}张` }}
-          </template>
         </t-base-table>
       </t-content>
     </t-layout>

src/pages/finance-bill-manage/form/index.vue

@@ -0,0 +1,344 @@
+<template>
+  <div>
+    <t-space direction="vertical" style="width: 100%" v-if="props.activeForm === 'stock'">
+      <div>
+        <t-form
+          ref="formDialog"
+          scroll-to-first-error="smooth"
+          label-align="left"
+          :rules="FORM_RULES_STOCK"
+          :data="stockData"
+          :colon="true"
+          @submit="stockAdd"
+          label-width="calc(2em + 55px)"
+          layout="inline"
+          @reset="onReset"
+        >
+          <t-form-item label="票据编号" name="billserial" :span="10" style="margin-bottom: 0.5rem">
+            <t-input v-model="stockData.billserial" placeholder="请输入票据编号" maxlength="10"></t-input>
+          </t-form-item>
+          <t-form-item label="票据类型" name="billType" :span="12" style="width: 16rem; margin-bottom: 0.5rem">
+            <t-select v-model="stockData.billType" clearable placeholder="请选择票据类型">
+              <t-option v-for="item in billType" :key="item.value" :label="item.label" :value="item.value" />
+            </t-select>
+          </t-form-item>
+          <t-form-item label="入库数量" name="stockNum" :span="12" style="margin-bottom: 0.5rem">
+            <t-input type="number" v-model="stockData.stockNum" placeholder="请输入入库数量"></t-input>
+          </t-form-item>
+          <t-form-item label="入库时间" name="stockDate" :span="10" style="width: 16rem; margin-bottom: 0.5rem">
+            <t-date-picker v-model="stockData.stockDate" placeholder="请选择入库时间" clearable />
+          </t-form-item>
+          <t-form-item label="操作员" name="operator" :span="10" style="margin-bottom: 0.5rem">
+            <t-input v-model="stockData.operator" placeholder="请输入操作员"></t-input>
+          </t-form-item>
+          <t-form-item label="备注" name="remark" style="width: 33.6rem">
+            <t-textarea v-model="stockData.remark" placeholder="请输入备注"></t-textarea>
+          </t-form-item>
+          <t-form-item>
+            <t-space size="small">
+              <t-button theme="primary" type="submit">提交</t-button>
+              <t-button theme="default" variant="base" type="reset">重置</t-button>
+            </t-space>
+          </t-form-item>
+        </t-form>
+      </div>
+    </t-space>
+    <t-space direction="vertical" v-if="props.activeForm === 'cancel'">
+      <div>
+        <t-form
+          ref="formDialog"
+          scroll-to-first-error="smooth"
+          label-align="left"
+          :rules="FORM_RULES_CANCEL"
+          :data="cancelData"
+          :colon="true"
+          @submit="cancelAdd"
+          label-width="calc(2em + 55px)"
+          @reset="onReset"
+        >
+          <t-form-item label="审批人" name="approver" style="margin-bottom: 1.5rem; width: 35rem">
+            <t-input v-model="cancelData.approver" placeholder="请输入审批人"></t-input>
+          </t-form-item>
+          <t-form-item label="审批时间" name="approvalDate" style="margin-bottom: 1.5rem; width: 35rem">
+            <t-date-picker v-model="cancelData.approvalDate" placeholder="请选择审批时间" clearable style="width: 35rem" />
+          </t-form-item>
+          <t-form-item label="审批原因" name="approvalReason">
+            <t-textarea v-model="cancelData.approvalReason" placeholder="请输入审批原因"></t-textarea>
+          </t-form-item>
+          <t-form-item>
+            <t-space size="small">
+              <t-button theme="primary" type="submit">提交</t-button>
+              <t-button theme="default" variant="base" type="reset">重置</t-button>
+            </t-space>
+          </t-form-item>
+        </t-form>
+      </div>
+    </t-space>
+    <t-space direction="vertical" v-if="props.activeForm === 'receipt'">
+      <div>
+        <t-form
+          ref="formDialog"
+          scroll-to-first-error="smooth"
+          label-align="left"
+          :rules="FORM_RULES_RECEIPT"
+          :data="receiptData"
+          :colon="true"
+          @submit="quitneckAdd"
+          label-width="calc(2em + 55px)"
+          @reset="onReset"
+        >
+          <t-form-item label="退领张数" name="quitneckNum" style="margin-bottom: 1.5rem; width: 35rem">
+            <t-input v-model="receiptData.quitneckNum" type="number" placeholder="请输入退领张数"></t-input>
+          </t-form-item>
+          <t-form-item label="退领时间" name="quitneckDate" style="margin-bottom: 1.5rem; width: 35rem">
+            <t-date-picker v-model="receiptData.quitneckDate" placeholder="请选择退领时间" clearable style="width: 35rem" />
+          </t-form-item>
+          <t-form-item label="退领原因" name="quitneckReason">
+            <t-textarea v-model="receiptData.quitneckReason" placeholder="请输入退领原因"></t-textarea>
+          </t-form-item>
+          <t-form-item>
+            <t-space size="small">
+              <t-button theme="primary" type="submit">提交</t-button>
+              <t-button theme="default" variant="base" type="reset">重置</t-button>
+            </t-space>
+          </t-form-item>
+        </t-form>
+      </div>
+    </t-space>
+    <t-space direction="vertical" v-if="props.activeForm === 'break'" style="width: 100%">
+      <div>
+        <t-form
+          ref="formDialog"
+          scroll-to-first-error="smooth"
+          label-align="left"
+          :rules="FORM_RULES_BREAK"
+          :data="breakData"
+          :colon="true"
+          @submit="breakSub"
+          label-width="calc(2em + 55px)"
+          layout="inline"
+          @reset="onReset"
+        >
+          <t-form-item label="票据编号" name="billserial" :span="10" style="margin-bottom: 0.5rem">
+            <t-input v-model="breakData.billserial" placeholder="请输入票据编号" maxlength="10"></t-input>
+          </t-form-item>
+          <t-form-item label="操作员" name="operator" :span="10" style="margin-bottom: 0.5rem">
+            <t-input v-model="breakData.operator" placeholder="请输入操作员"></t-input>
+          </t-form-item>
+          <t-form-item label="票据类型" name="billType" :span="12" style="width: 16rem; margin-bottom: 0.5rem">
+            <t-select v-model="breakData.billType" clearable placeholder="请选择票据类型">
+              <t-option v-for="item in billType" :key="item.value" :label="item.label" :value="item.value" />
+            </t-select>
+          </t-form-item>
+          <t-form-item label="报损数量" name="breakNum" :span="12" style="margin-bottom: 0.5rem">
+            <t-input type="number" v-model="breakData.breakNum" placeholder="请输入报损数量"></t-input>
+          </t-form-item>
+          <t-form-item label="报损时间" name="breakDate" :span="10" style="width: 16rem; margin-bottom: 0.5rem">
+            <t-date-picker v-model="breakData.breakDate" placeholder="请选择报损时间" clearable />
+          </t-form-item>
+          <t-form-item label="报损原因" name="breakInfo" style="width: 33.6rem">
+            <t-textarea v-model="breakData.breakInfo" placeholder="请输入备注"></t-textarea>
+          </t-form-item>
+          <t-form-item />
+          <t-form-item>
+            <t-space size="small">
+              <t-button theme="primary" type="submit">提交</t-button>
+              <t-button theme="default" variant="base" type="reset">重置</t-button>
+            </t-space>
+          </t-form-item>
+        </t-form>
+      </div>
+    </t-space>
+    <t-space direction="vertical" v-if="props.activeForm === 'destroy'" style="width: 100%">
+      <div>
+        <t-form
+          ref="formDialog"
+          scroll-to-first-error="smooth"
+          label-align="left"
+          :rules="FORM_RULES_DESTROY"
+          :data="destroyData"
+          :colon="true"
+          @submit="destroySub"
+          label-width="calc(2em + 55px)"
+          layout="inline"
+          @reset="onReset"
+        >
+          <t-form-item label="审核状态" name="Status" style="margin-bottom: 0.5rem">
+            <t-radio-group v-model="destroyData.Status">
+              <t-radio value="1" @click="refuse = false">审核通过</t-radio>
+              <t-radio value="2" @click="refuse = true">审核拒绝</t-radio>
+            </t-radio-group>
+          </t-form-item>
+          <t-form-item />
+          <t-form-item label="拒绝原因" name="refuseInfo" v-if="refuse" style="width: 33.6rem; margin-bottom: 0.5rem">
+            <t-textarea v-model="destroyData.refuseInfo" placeholder="请输入备注"></t-textarea>
+          </t-form-item>
+          <t-form-item>
+            <t-space size="small">
+              <t-button theme="primary" type="submit">提交</t-button>
+              <t-button theme="default" variant="base" type="reset">重置</t-button>
+            </t-space>
+          </t-form-item>
+        </t-form>
+      </div>
+    </t-space>
+  </div>
+</template>
+
+<script setup>
+import { billType } from "../codeValue/index";
+import { ref, onMounted, onUpdated, watchEffect } from "vue";
+
+const props = defineProps({
+  activeForm: {
+    type: String,
+    default: "",
+  },
+  editFrom: {
+    type: Object,
+    default: () => {},
+  },
+});
+
+const refuse = ref(false);
+const emit = defineEmits();
+
+// 票据入库表单
+const stockData = ref({
+  billserial: "",
+  stockNum: Number,
+  unit: "",
+  operator: "",
+  remark: "",
+  stockDate: "",
+});
+
+// 票据入库表单校验
+const FORM_RULES_STOCK = {
+  billserial: [{ required: true, message: "请输入票据编号", trigger: "blur" }],
+  billType: [{ required: true, message: "请选择票据类型", trigger: "change" }],
+  stockNum: [{ required: true, message: "请输入库存数量", trigger: "blur" }],
+  unit: [{ required: true, message: "请输入单位", trigger: "blur" }],
+  stockDate: [{ required: true, message: "请选择入库日期", trigger: "change" }],
+  operator: [{ required: true, message: "请输入操作员", trigger: "blur" }],
+};
+// 票据入库提交
+const stockAdd = async ({ validateResult, firstError }) => {
+  if (validateResult === true) {
+    await emit("childForm", stockData.value);
+  } else {
+    console.log("Validate Errors: ", firstError, validateResult);
+  }
+};
+
+// 票据退库表单
+const cancelData = ref({
+  approver: "",
+  approvalDate: "",
+  approvalReason: "",
+});
+
+// 票据出库效验规则
+const FORM_RULES_CANCEL = {
+  approver: [{ required: true, message: "请输入审批人", trigger: "blur" }],
+  approvalDate: [{ required: true, message: "请选择入库日期", trigger: "change" }],
+  approvalReason: [{ required: true, message: "请输入审批原因", trigger: "blur" }],
+};
+
+// 票据出库提交
+const cancelAdd = async ({ validateResult, firstError }) => {
+  if (validateResult === true) {
+    await emit("childForm");
+  } else {
+    console.log("Validate Errors: ", firstError, validateResult);
+  }
+};
+
+// 票据领用表单数据
+const receiptData = ref({
+  quitneckDate: "",
+  quitneckReason: "",
+  quitneckNum: "",
+});
+
+// 票据领用效验规则
+const FORM_RULES_RECEIPT = {
+  quitneckNum: [{ required: true, message: "请输入退领张数", trigger: "blur" }],
+  quitneckDate: [{ required: true, message: "请选择退领日期", trigger: "change" }],
+  quitneckReason: [{ required: true, message: "请输入退领原因", trigger: "blur" }],
+};
+
+// 票据领用表单提交
+const quitneckAdd = async ({ validateResult, firstError }) => {
+  if (validateResult === true) {
+    await emit("childForm", receiptData.value);
+  } else {
+    console.log("Validate Errors: ", firstError, validateResult);
+  }
+};
+
+// 票据破损表单
+const breakData = ref({
+  billserial: "",
+  operator: "",
+  billType: "",
+  breakNum: Number,
+  breakDate: "",
+  breakInfo: "",
+});
+
+// 票据破损表单校验
+const FORM_RULES_BREAK = {
+  billserial: [{ required: true, message: "请输入票据编号", trigger: "blur" }],
+  billType: [{ required: true, message: "请选择票据类型", trigger: "change" }],
+  breakNum: [{ required: true, message: "请输入报损数量", trigger: "blur" }],
+  breakDate: [{ required: true, message: "请选择报损日期", trigger: "change" }],
+  operator: [{ required: true, message: "请输入操作员", trigger: "blur" }],
+  breakInfo: [{ required: true, message: "请输入报损原因", trigger: "blur" }],
+};
+
+// 票据破损表单提交
+const breakSub = async ({ validateResult, firstError }) => {
+  if (validateResult === true) {
+    await emit("childForm", breakData.value);
+  } else {
+    console.log("Validate Errors: ", firstError, validateResult);
+  }
+};
+
+// 票据核销表单
+const destroyData = ref({
+  refuseInfo: "",
+  Status: "",
+});
+
+// 票据核销表单校验
+const FORM_RULES_DESTROY = {
+  Status: [{ required: true, message: "请选择审批状态", trigger: "change" }],
+  refuseInfo: [{ required: true, message: "请输入拒绝原因", trigger: "blur" }],
+};
+// 票据核销表单提交
+const destroySub = async ({ validateResult, firstError }) => {
+  if (validateResult === true) {
+    await emit("childForm", destroyData.value);
+  } else {
+    console.log("Validate Errors: ", firstError, validateResult);
+  }
+};
+
+// 弹出框表单重置
+const onReset = () => {};
+
+onUpdated(() => {
+  // 票据入库修改
+  if (props.activeForm === "stock") {
+    stockData.value = props.editFrom;
+  }
+  // 票据破损修改
+  if (props.activeForm === "break") {
+    breakData.value = props.editFrom;
+  }
+});
+</script>
+
+<style lang="less" scoped></style>

src/stores/billCancel.js

@@ -14,10 +14,8 @@ export const useCancel = defineStore("CancelList", {
       return this.cancelList;
     },
     editApprovalStatus(arr) {
-      console.log(arr);
       const index = this.cancelList.findIndex((item) => item.id === arr.row.id);
       if (index !== -1) {
-        console.log("index", index);
         this.cancelList[index] = arr.row;
       }
     },

src/stores/billDestroy.js

@@ -19,18 +19,13 @@ export const useDestroy = defineStore("destroyList", {
       const storedData = localStorage.getItem("breakageList");
       if (storedData) {
         const parsedData = JSON.parse(storedData);
-        parsedData.destroyList = parsedData.destroyList.filter(
+        parsedData.destroyList = parsedData.destroyList.filter((i) => i.id !== item.id);
-          (i) => i.id !== item.id
-        );
         parsedData.breakageList = parsedData.breakageList.map((i) => {
-          console.log(i.id, item.id);
           if (i.id === item.id) {
-            console.log(item.breakStatus);
             return { ...i, breakStatus: item.breakStatus }; // 返回更新后的对象
           }
           return i; // 保持其他项不变
         });
-        console.log(parsedData.breakageList);
         localStorage.setItem("breakageList", JSON.stringify(parsedData));
         this.destroyList = parsedData.destroyList; // 更新store中的destroyList状态
       }

src/stores/billReceipt.js

@@ -1,8 +1,5 @@
 import { defineStore } from "pinia";
-import {
+import { reqPersonName, reqReceiptList } from "@/api/finance-bill-manage/receiptList";
-  reqPersonName,
-  reqReceiptList,
-} from "@/api/finance-bill-manage/receiptList";
 
 export const useReceiptList = defineStore("ReceiptList", {
   state: () => {
@@ -20,7 +17,6 @@ export const useReceiptList = defineStore("ReceiptList", {
     },
 
     async getReceiptList(obj) {
-      console.log("222");
       const { data } = await reqReceiptList(obj);
       this.receiptList = data;
       return this.receiptList;
@@ -28,8 +24,7 @@ export const useReceiptList = defineStore("ReceiptList", {
     async getquitneckNum(obj) {
       const index = this.receiptList.findIndex((item) => item.id === obj.id);
       if (index !== -1) {
-        this.receiptList[index].receiptNum =
+        this.receiptList[index].receiptNum = this.receiptList[index].receiptNum - obj.quitneckNum;
-          this.receiptList[index].receiptNum - obj.quitneckNum;
       }
       this.quitneckList.push(obj);
     },