|
|
@@ -0,0 +1,70 @@
|
|
|
+<!--
|
|
|
+ * @Author: niezch@dashoo.cn
|
|
|
+ * @Date: 2023-04-03 09:32:08
|
|
|
+ * @LastEditors: niezch@dashoo.cn
|
|
|
+ * @LastEditTime: 2023-04-06 18:07:13
|
|
|
+ * @Description: file content
|
|
|
+ * @FilePath: \opms_frontend\src\views\report\proj\index.vue
|
|
|
+-->
|
|
|
+<template>
|
|
|
+ <div class="detail">
|
|
|
+ <h2 style="text-align: center">售后运维到期统计表</h2>
|
|
|
+ <div style="float: right; margin-bottom: 10px">
|
|
|
+ <p>
|
|
|
+ <el-date-picker v-model="month" type="month" value-format="yyyy-MM" @change="fetchData" />
|
|
|
+ </p>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <el-table ref="businessTable" v-loading="loading" border :data="tableData" :height="$baseTableHeight(1)">
|
|
|
+ <el-table-column
|
|
|
+ v-for="(item, key) in header"
|
|
|
+ :key="key"
|
|
|
+ align="center"
|
|
|
+ :label="item.label"
|
|
|
+ :prop="item.prop"
|
|
|
+ show-overflow-tooltip>
|
|
|
+ <template #default="{ row }">
|
|
|
+ <span>{{ row[item.prop] }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import reportApi from '@/api/contract/report'
|
|
|
+ import { parseTime } from '@/utils'
|
|
|
+
|
|
|
+ export default {
|
|
|
+ name: 'ContractReport',
|
|
|
+ components: {},
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ month: parseTime(new Date(), '{y}-{m}'),
|
|
|
+ loading: false,
|
|
|
+ header: undefined,
|
|
|
+ tableData: undefined,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.fetchData()
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ async fetchData() {
|
|
|
+ this.loading = true
|
|
|
+ const {
|
|
|
+ data: { header, data },
|
|
|
+ } = await reportApi.queryContractExpireNum({ date: this.month })
|
|
|
+ this.header = header
|
|
|
+ this.tableData = data
|
|
|
+ this.loading = false
|
|
|
+ },
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .detail {
|
|
|
+ padding: 30px;
|
|
|
+ }
|
|
|
+</style>
|
lk