收入分析

web/src/view/finance/components/reimburse.vue

@@ -247,7 +247,7 @@
     </el-drawer>
     <el-drawer
       v-model="reimburseEditShow"
-      title="新增报销记录"
+      title="编辑报销记录"
       size="40%"
     >
       <el-form
@@ -259,22 +259,22 @@
           label="申请人："
         >
           <el-input
-            v-model="createData.applicant"
+            v-model="editData.applicant"
             placeholder="请输入申请人名称"
             clearable
-            @clear="createData.applicant = ''"
+            @clear="editData.applicant = ''"
           />
         </el-form-item>
         <el-form-item
           label="报销日期："
         >
           <el-date-picker
-            v-model="createData.applicationTime"
+            v-model="editData.applicationTime"
             placeholder="请选择报销日期"
             format="YYYY-MM-DD"
             value-format="YYYY-MM-DD"
             clearable
-            @clear="createData.applicationTime = ''"
+            @clear="editData.applicationTime = ''"
           />
         </el-form-item>
         <el-form-item
@@ -312,7 +312,7 @@
           </el-select>
         </el-form-item>
         <el-row
-          v-for="(item,index) in reimburseItem"
+          v-for="(item,index) in editData.feeDetails"
           :key="index"
         >
           <el-col :span="12">
@@ -348,15 +348,15 @@
       <template #footer>
         <div class="dialog-footer">
           <el-button
-            v-show="reimburseItem.length > 1"
+            v-show="deleteDetailShow"
             size="large"
-            @click="reimburseItem.splice(reimburseItem.length - 1,1)"
+            @click="delFeeDetails"
           >
             删除报销详情
           </el-button>
           <el-button
             size="large"
-            @click="addFeeDetails"
+            @click="addEditFeeDetails"
           >
             添加报销详情
           </el-button>
@@ -375,7 +375,7 @@
 
 <script setup>
 import { Search, Delete, Edit, Notebook, Plus } from '@element-plus/icons-vue'
-import { reactive, ref, onMounted } from 'vue'
+import { reactive, ref, onMounted, computed } from 'vue'
 import { reimburseOperate } from '@/pinia/reimbursement/Reimbursement'
 import { codeOperate } from '@/pinia/code/code'
 import { queryExpensesGenre } from '@/api/finance'
@@ -388,6 +388,15 @@ defineOptions({
 // pinia
 const submit = reimburseOperate()
 const serial = codeOperate()
+// 计算属性
+const deleteDetailShow = computed(() => {
+  for (const i in editData) {
+    if (i === 'feeDetails' && editData[i].length > 1) {
+      return true
+    }
+  }
+  return false
+})
 // 数据
 const reimburseAddShow = ref(false)
 const condition = reactive({
@@ -408,15 +417,7 @@ const createData = reactive({
   genre: '',
   feeDetails: []
 })
-const editData = reactive({
-  projectCode: '',
-  applicant: '张三',
-  applicationTime: '',
-  approval: '',
-  price: 0,
-  genre: '',
-  feeDetails: []
-})
+const editData = reactive({})
 const reimburseEditShow = ref(false)
 const costList = reactive([])
 const userList = reactive([])
@@ -445,6 +446,8 @@ const searchReimburse = () => {
 }
 const openReimburseEdit = (row) => {
   console.log(row)
+  reimburseEditShow.value = true
+  Object.assign(editData, row)
 }
 const reimburseDelete = (row) => {
   ElMessageBox.confirm(
@@ -472,7 +475,8 @@ const reimburseDelete = (row) => {
     }).catch(() => {})
 }
 const changeReimbursePage = (value) => {
-  console.log(value)
+  condition.pageInfo.page = value
+  submit.getReimburseList(condition)
 }
 const addReimburse = () => {
   const data = createData
@@ -522,6 +526,16 @@ const addFeeDetails = () => {
     price: 0
   })
 }
+
+const addEditFeeDetails = () => {
+  editData.feeDetails.push({
+    remarks: '',
+    price: 0
+  })
+}
+const delFeeDetails = () => {
+  editData.feeDetails.splice(editData.feeDetails.length - 1, 1)
+}
 </script>
 
 <style scoped>