|
|
@@ -1,88 +1,103 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
<el-row>
|
|
|
- <el-col
|
|
|
- :span="4"
|
|
|
- >
|
|
|
+ <el-col :span="4">
|
|
|
<el-form-item label="项目名称">
|
|
|
<el-input placeholder="请输入项目名称" />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col
|
|
|
- :span="4"
|
|
|
- :offset="1"
|
|
|
+ :span="4"
|
|
|
+ :offset="1"
|
|
|
>
|
|
|
<el-form-item label="立项时间">
|
|
|
<el-date-picker
|
|
|
- v-model="approvalTime"
|
|
|
- type="month"
|
|
|
- placeholder="请选择立项时间"
|
|
|
+ v-model="approvalTime"
|
|
|
+ type="month"
|
|
|
+ placeholder="请选择立项时间"
|
|
|
/>
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
<el-col
|
|
|
- :span="4"
|
|
|
- :offset="1"
|
|
|
+ :span="4"
|
|
|
+ :offset="1"
|
|
|
>
|
|
|
<el-form-item label="项目状态">
|
|
|
<el-select />
|
|
|
</el-form-item>
|
|
|
</el-col>
|
|
|
+ <el-col
|
|
|
+ :span="2"
|
|
|
+ :offset="1"
|
|
|
+ >
|
|
|
+ <el-button
|
|
|
+ type="primary"
|
|
|
+ :icon="Search"
|
|
|
+ @click="initializedData"
|
|
|
+ >查询</el-button>
|
|
|
+ </el-col>
|
|
|
</el-row>
|
|
|
<el-row>
|
|
|
- <el-col :span="5">
|
|
|
- <div class="bg-white h-24" />
|
|
|
- </el-col>
|
|
|
- <el-col :span="5" :offset="1">
|
|
|
- <div class="bg-white h-24" />
|
|
|
- </el-col>
|
|
|
- <el-col :span="5" :offset="1">
|
|
|
- <div class="bg-white h-24" />
|
|
|
- </el-col>
|
|
|
- <el-col :span="5" :offset="1">
|
|
|
- <div class="bg-white h-24" />
|
|
|
+ <el-col :span="23">
|
|
|
+ <el-row justify="space-between">
|
|
|
+ <el-col :span="5">
|
|
|
+ <div class="bg-white h-24" />
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <div class="bg-white h-24" />
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <div class="bg-white h-24" />
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <div class="bg-white h-24" />
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
<el-form>
|
|
|
<el-row style="margin-top: 20px;">
|
|
|
<el-col
|
|
|
- :span="21"
|
|
|
+ :span="23"
|
|
|
>
|
|
|
- <el-table :data="projectListData" height="650">
|
|
|
+ <el-table
|
|
|
+ :data="projectListData"
|
|
|
+ height="650"
|
|
|
+ >
|
|
|
<el-table-column
|
|
|
- label="项目编码"
|
|
|
- width="200"
|
|
|
- align="center"
|
|
|
+ prop="code"
|
|
|
+ label="项目编码"
|
|
|
+ align="center"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- label="项目名称"
|
|
|
- width="200"
|
|
|
- align="center"
|
|
|
+ prop="name"
|
|
|
+ label="项目名称"
|
|
|
+ align="center"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- label="项目负责人"
|
|
|
- width="200"
|
|
|
- align="center"
|
|
|
+ prop="principal"
|
|
|
+ label="项目负责人"
|
|
|
+ align="center"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- label="项目金额"
|
|
|
- width="200"
|
|
|
- align="center"
|
|
|
+ prop="price"
|
|
|
+ label="项目金额"
|
|
|
+ align="center"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- label="立项日期"
|
|
|
- width="200"
|
|
|
- align="center"
|
|
|
+ prop="CreatedAt"
|
|
|
+ label="立项日期"
|
|
|
+ align="center"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- label="项目进度"
|
|
|
- width="200"
|
|
|
- align="center"
|
|
|
+ prop="progress"
|
|
|
+ label="项目进度"
|
|
|
+ align="center"
|
|
|
/>
|
|
|
<el-table-column
|
|
|
- label="状态"
|
|
|
- width="200"
|
|
|
- align="center"
|
|
|
+ prop="state"
|
|
|
+ label="状态"
|
|
|
+ align="center"
|
|
|
/>
|
|
|
</el-table>
|
|
|
</el-col>
|
|
|
@@ -92,14 +107,55 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup>
|
|
|
-import { ref, reactive } from 'vue'
|
|
|
+import { Search } from '@element-plus/icons-vue'
|
|
|
+import { getProjectList } from '@/api/projectList'
|
|
|
+import { reactive, ref } from 'vue'
|
|
|
+
|
|
|
defineOptions({
|
|
|
name: 'ProjectList'
|
|
|
})
|
|
|
|
|
|
const approvalTime = ref('')
|
|
|
const projectListData = reactive([])
|
|
|
+const listTotal = ref(0)
|
|
|
+const data = {
|
|
|
+ pageInfo: {
|
|
|
+ page: 1,
|
|
|
+ pageSize: 10
|
|
|
+ },
|
|
|
+ name: '',
|
|
|
+ time: '',
|
|
|
+ state: 0
|
|
|
+}
|
|
|
+function formatDate(dateString, locale = 'en-US', timezone = 'Asia/Shanghai') {
|
|
|
+ // 使用 Date 构造函数解析日期字符串
|
|
|
+ const date = new Date(dateString)
|
|
|
+
|
|
|
+ // 检查日期是否有效
|
|
|
+ if (isNaN(date.getTime())) {
|
|
|
+ throw new Error('Invalid date string')
|
|
|
+ }
|
|
|
+
|
|
|
+ // 使用 Date 对象的年份、月份和日期来构建新的日期字符串
|
|
|
+ // 注意：JavaScript 中的月份是从 0 开始的，所以我们需要加 1
|
|
|
+ const formattedDate = `${date.getFullYear()}-${('0' + (date.getMonth() + 1)).slice(-2)}-${('0' + date.getDate()).slice(-2)}`
|
|
|
+
|
|
|
+ return formattedDate
|
|
|
+}
|
|
|
+
|
|
|
+getProjectList(data).then(res => {
|
|
|
+ if (res.code === 0 && res.data.total > 0) {
|
|
|
+ const list = res.data.list
|
|
|
+ list.forEach(item => {
|
|
|
+ item.CreatedAt = formatDate(item.CreatedAt)
|
|
|
+ })
|
|
|
+ projectListData.push(...list)
|
|
|
+ listTotal.value = res.data.total
|
|
|
+ }
|
|
|
+})
|
|
|
+function initializedData() {
|
|
|
|
|
|
+}
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="less">
|
