1111

src/views/funding/modules/plan-data.vue

@@ -1,149 +0,0 @@
-<template>
-    <hc-dialog v-model="isShow" ui="hc-funding-plan-dialog" is-table widths="50rem" title="新增资金预算期" @close="cancelClick">
-        <hc-card-item>
-            <template #header>
-                <el-tooltip :visible="editVisible" effect="light" placement="bottom-start">
-                    <template #content>
-                        <div class="text-sm text-red">
-                            1.日期不能为空<br>
-                            2.同一期的结束日期不能小于开始日期<br>
-                            3.连续的两期，上一期结束日期和下一期的开始日期必须连续<br>
-                            如：期号1的结束日期为2018-1-25，则期号2的开始日期必须是2018-1-26 ！<br>
-                            4.已经存在数据的计量周期不能进行删除！<br>
-                            5.已经存在上报数据的计量周期不能进行数据修改
-                        </div>
-                    </template>
-                    <el-button type="danger" @mouseenter="editVisible = true" @mouseleave="editVisible = false">
-                        <hc-icon name="question" />
-                        <span>编辑说明</span>
-                    </el-button>
-                </el-tooltip>
-            </template>
-            <template #extra>
-                <el-button type="primary" @click="addPreRow">
-                    <hc-icon name="page-separator" :line="false" />
-                    <span>插入上一行</span>
-                </el-button>
-                <el-button type="primary" @click="addNextRow">
-                    <hc-icon name="page-separator" :line="false" />
-                    <span>插入下一行</span>
-                </el-button>
-            </template>
-            <hc-table
-                is-new :index-style="{ width: 60 }" :column="tableColumn" :datas="tableData"
-                :loading="tableLoading" is-current-row @row-click="hangeRow"
-            >
-                <template #key1="{ row }">
-                    <hc-table-input v-model="row.key1" />
-                </template>
-                <template #key2="{ row }">
-                    <el-select v-model="row.key2" placeholder="选择年份" filterable block>
-                        <el-option v-for="item in yearData" :key="item" :label="item" :value="item" />
-                    </el-select>
-                </template>
-                <template #action="{ row, index }">
-                    <el-link type="danger" @click="delRow(row, index)">删除</el-link>
-                </template>
-            </hc-table>
-        </hc-card-item>
-        <template #footer>
-            <el-button @click="cancelClick">取消</el-button>
-            <el-button type="primary" :loading="confirmLoading" @click="confirmClick">确定</el-button>
-        </template>
-    </hc-dialog>
-</template>
-
-<script setup>
-import { ref, watch } from 'vue'
-import { useAppStore } from '~src/store'
-import mainApi from '~api/funding/budget'
-
-//事件
-const emit = defineEmits(['finish', 'close'])
-
-//双向绑定
-const isShow = defineModel('modelValue', {
-    default: false,
-})
-
-//获取全局变量
-const store = useAppStore()
-const projectId = ref(store.getProjectId)
-const contractId = ref(store.getContractId)
-
-//监听显示
-watch(isShow, (val) => {
-    if (val) setInitData()
-})
-
-//弹窗打开后，初始化数据
-const setInitData = () => {
-    projectId.value = store.getProjectId
-    contractId.value = store.getContractId
-}
-
-//年份
-const yearData = ref([])
-
-//表格数据
-const tableData = ref([
-    {},
-])
-const tableColumn = ref([
-    { key: 'key1', name: '期名称' },
-    { key: 'key2', name: '年份' },
-    { key: 'action', name: '操作', width: 80, align: 'center' },
-])
-
-//获取数据
-const tableLoading = ref(false)
-const getTableData = async () => {
-
-}
-
-//编辑说明提示
-const editVisible = ref(false)
-
-//插入上一行
-const addPreRow = () => {
-    //tableData.value.splice(curIndex.value, 0, { isNew: true })
-}
-
-//插入下一行
-const addNextRow = () => {
-    /*if (!curRow.value?.endDate) {
-        curRow.value.endDate = tableEditData.value[tableEditData.value.length - 1].endDate
-    }
-    const netxtDay = getNextDate(curRow.value?.endDate)
-    tableData.value.splice(curIndex.value + 1, 0, { isNew: true, startDate: netxtDay })*/
-}
-
-//行被点击
-const hangeRow = () => {
-
-}
-
-//删除行
-const delRow = (row) => {
-
-}
-
-//确认提交保存
-const confirmLoading = ref(false)
-const confirmClick = () => {
-    cancelClick()
-    emit('finish')
-}
-
-//取消并关闭弹窗
-const cancelClick = () => {
-    isShow.value = false
-    emit('close')
-}
-</script>
-
-<style lang="scss">
-.el-dialog.hc-funding-plan-dialog .el-dialog__body .hc-new-dialog-body{
-    padding: 10px 0;
-}
-</style>

src/views/funding/plan.vue

@@ -1,42 +1,35 @@
 <template>
     <hc-card title="资金预算期">
         <template #extra>
-            <el-button hc-btn type="primary" @click="addRowClick">新增</el-button>
-            <el-button hc-btn type="primary" @click="addRowClick1">新增1</el-button>
+            <el-button hc-btn type="primary" @click="addRowClick">
+                <hc-icon name="add" />
+                <span>新增</span>
+            </el-button>
         </template>
-        <hc-table :column="tableColumn" :datas="tableData" :loading="tableLoading" />
-        <template #action>
-            <hc-pages :pages="searchForm" @change="pageChange" />
-        </template>
-        <!-- 新增/修改 -->
-        <HcPlanData v-model="isBudgetDataShow" @finish="getTableData" />
-        <!-- 测试的弹窗 -->
-        <hc-dialog v-model="isAddRowShow1" widths="24rem" title="新增资金预算期" @close="isAddRowShow1 = false">
-            <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" label-width="auto" size="large">
-                <el-form-item label="资金预算期名称：">
-                    <el-input v-model="formModel.key1" placeholder="请输入期名称" />
-                </el-form-item>
-                <el-form-item label="资金预算期年份：" prop="key2">
-                    <el-select v-model="formModel.key2" filterable block placeholder="请选择年份">
-                        <el-option label="2023年" value="2023" />
-                        <el-option label="2024年" value="2024" />
-                        <el-option label="2025年" value="2025" />
-                    </el-select>
-                </el-form-item>
-            </el-form>
-            <template #footer>
-                <el-button @click="isAddRowShow1 = false">取消</el-button>
-                <el-button type="primary" :loading="confirmLoading" @click="confirmClick">确定</el-button>
+        <hc-table :column="tableColumn" :datas="tableData" :loading="tableLoading">
+            <template #key1="{ row }">
+                <hc-table-input v-if="isNullES(row.id)" v-model="row.key1" />
+                <span v-else>{{ row.key1 }}</span>
+            </template>
+            <template #key2="{ row }">
+                <el-select v-if="isNullES(row.id)" v-model="row.key2" placeholder="选择年份" filterable block>
+                    <el-option v-for="item in yearDatas" :key="item" :label="item" :value="item" />
+                </el-select>
+                <span v-else>{{ row.key2 }}</span>
+            </template>
+            <template #action="{ row }">
+                <el-link type="danger" @click="delRowClick(row)">删除</el-link>
             </template>
-        </hc-dialog>
+        </hc-table>
     </hc-card>
 </template>
 
 <script setup>
 import { onActivated, ref } from 'vue'
 import { useAppStore } from '~src/store'
-import { formValidate, getArrValue } from 'js-fast-way'
-import HcPlanData from './modules/plan-data.vue'
+import { HcDelMsg } from 'hc-vue3-ui'
+import { getArrValue, isNullES } from 'js-fast-way'
+import dayjs from 'dayjs'
 import mainApi from '~api/funding/budget'
 
 //获取全局变量
@@ -52,26 +45,32 @@ defineOptions({
 onActivated(() => {
     projectId.value = store.getProjectId
     contractId.value = store.getContractId
+    setYearDatas()
     getTableData()
 })
 
-//搜索表单
-const searchForm = ref({ current: 1, size: 20, total: 0 })
-
-//分页
-const pageChange = ({ current, size }) => {
-    searchForm.value.current = current
-    searchForm.value.size = size
-    getTableData()
+//生成年份 (根据当前年，生成上下 10年的日期)
+const yearDatas = ref([])
+const setYearDatas = () => {
+    let newYear = []
+    const year = Number(new dayjs().format('YYYY'))
+    for (let i = 0; i < 11; i++) {
+        newYear.push(year - i)
+        newYear.push(year + i)
+    }
+    const newArr = [...new Set(newYear)]
+    newArr.sort((a, b) => a - b)
+    yearDatas.value = newArr
 }
 
 //表格数据
 const tableData = ref([
-    { key1:'2024年资金预算', key2: '2024' },
+    { id: '1', key1:'2024年资金预算', key2: '2024' },
 ])
 const tableColumn = ref([
     { key: 'key1', name: '期名称' },
     { key: 'key2', name: '年份' },
+    { key: 'action', name: '操作', width: 80, align: 'center' },
 ])
 
 //获取表格数据
@@ -88,30 +87,35 @@ const getTableData = async () => {
 }
 
 //新增数据
-const isBudgetDataShow = ref(false)
 const addRowClick = () => {
-    isBudgetDataShow.value = true
+    let year, toYear = Number(new dayjs().format('YYYY'))
+    const data = tableData.value, years = yearDatas.value
+    if (data.length <= 0) {
+        year = toYear //如果没有上一条数据，就取今年
+    } else {
+        //如果存在上一条数据
+        const newYear = Number(data[data.length - 1].key2) + 1
+        //判断，上一条数据的年份 + 1，是否超过了可选的年份
+        if (years[years.length - 1] < newYear) {
+            //如果超过了，就取可选年份的最后一年
+            year = years[years.length - 1]
+        } else {
+            //如果没有超过，就取上一条数据的年份 + 1
+            year = newYear
+        }
+    }
+    //插入数据
+    tableData.value.push({ key2: year })
 }
 
-//测试的弹窗
-const isAddRowShow1 = ref(false)
-const addRowClick1 = () => {
-    isAddRowShow1.value = true
-}
-
-//表单弹窗
-const formRef = ref(null)
-const formModel = ref({})
-const formRules = {
-    key2: { required: true, trigger: 'blur', message: '请选择年份' },
-}
-
-//提交保存
-const confirmLoading = ref(false)
-const confirmClick = async () => {
-    const isForm = await formValidate(formRef.value)
-    if (!isForm) return
-    console.log(formModel.value)
+//删除数据
+const delRowClick = (row) => {
+    HcDelMsg(async (resolve) => {
+        console.log('删除中...')
+        setTimeout(() => {
+            resolve() //关闭弹窗的回调
+        }, 3000)
+    })
 }
 </script>