|
@@ -0,0 +1,58 @@
|
|
|
+<template>
|
|
|
+ <div class="container">
|
|
|
+ <div class="query-container">
|
|
|
+ <div>
|
|
|
+ <span>账期:</span>
|
|
|
+ <el-date-picker v-model="value2" type="month" placeholder="Pick a month" />
|
|
|
+ <el-button type="primary">查询</el-button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <div>
|
|
|
+ <span>节能减排</span>
|
|
|
+ </div>
|
|
|
+ <div>
|
|
|
+ <el-table :data="tableData" stripe style="width: 100%;">
|
|
|
+ <el-table-column prop="smonth" label="账期" />
|
|
|
+ <el-table-column prop="display_name" label="文件名称" />
|
|
|
+ <el-table-column label="操作">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-button type="primary" plain>下载</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+const tableData = [
|
|
|
+ {
|
|
|
+ smonth: '202401',
|
|
|
+ display_name: 'report_205_202401.xls',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: '202401',
|
|
|
+ display_name: 'report_IDC_202401.xlsx',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ date: '202401',
|
|
|
+ display_name: 'report_节能减排报表_202401.xlsx',
|
|
|
+ },
|
|
|
+]
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="css" scoped>
|
|
|
+.container {
|
|
|
+ /* TODO 这里的背景色应该占满整个屏幕,并且不需要有滚动条 */
|
|
|
+ background-color: #F0F2F5;
|
|
|
+}
|
|
|
+
|
|
|
+.query-container {
|
|
|
+ background-color: #FFFFFF;
|
|
|
+ height: 60px;
|
|
|
+ margin: 10px;
|
|
|
+ vertical-align: middle;
|
|
|
+}
|
|
|
+</style>
|