|
|
@@ -1,6 +1,6 @@
|
|
|
<template>
|
|
|
<div>
|
|
|
- <div v-show="!writeFormState.show && !formDetailState.show" class="app-container">
|
|
|
+ <div v-show="!fillingAddState.show && !tableDetailsState.show" class="app-container">
|
|
|
<div>
|
|
|
<transition name="fade">
|
|
|
<div v-show="showSearch">
|
|
|
@@ -41,7 +41,9 @@
|
|
|
</el-col>
|
|
|
<el-col :span="6">
|
|
|
<el-button type="primary" @click="handleQuery">查询</el-button>
|
|
|
- <el-button @click="resetQuery">重置</el-button>
|
|
|
+ <el-button type="primary" @click="resetQuery">重置</el-button>
|
|
|
+ <el-button type="primary" @click="exportTableData()">导出</el-button>
|
|
|
+ <el-button type="primary" @click="handleAdd()">新增</el-button>
|
|
|
</el-col>
|
|
|
</el-row>
|
|
|
</el-form>
|
|
|
@@ -57,7 +59,7 @@
|
|
|
<el-table-column label="任务状态" align="center" prop="status" />
|
|
|
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
<template #default="scope">
|
|
|
- <el-text v-if="scope.row.release_status === '待发布'" class="common-btn-text-primary" @click="handleWrite(scope.row)">下发</el-text>
|
|
|
+ <el-text v-if="scope.row.release_status === '待发布'" class="common-btn-text-primary" @click="scope.row;">下发</el-text>
|
|
|
<el-text class="common-btn-text-primary" @click="handleView(scope.row)">详情</el-text>
|
|
|
</template>
|
|
|
</el-table-column>
|
|
|
@@ -66,20 +68,19 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <WriteForm v-if="writeFormState.show" :event-id="writeFormState.eventId" @close="handleCancel" />
|
|
|
- <FormDetail v-if="formDetailState.show" :event-id="formDetailState.eventId" @close="handleCancel" />
|
|
|
+ <FillingAdd v-if="fillingAddState.show" :event-id="fillingAddState.eventId" @close="handleCancel" />
|
|
|
+ <TableDetails v-if="tableDetailsState.show" :event-id="tableDetailsState.eventId" @close="handleCancel" />
|
|
|
</template>
|
|
|
<script setup lang="ts">
|
|
|
import { onMounted, reactive, ref } from 'vue';
|
|
|
-import WriteForm from './writeForm.vue';
|
|
|
-import FormDetail from './formDetail.vue';
|
|
|
+import FillingAdd from './fillingAdd.vue';
|
|
|
+import TableDetails from './tableDetails.vue';
|
|
|
+import { ElButton, ElCol } from 'element-plus';
|
|
|
|
|
|
const loading = ref(true);
|
|
|
const showSearch = ref(true);
|
|
|
const selectedTime = ref([]);
|
|
|
-const multiple = ref(true);
|
|
|
const ids = ref<Array<number | string>>([]);
|
|
|
-const single = ref(true);
|
|
|
const total = ref(0);
|
|
|
const tableData = ref([]);
|
|
|
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
|
|
|
@@ -130,30 +131,31 @@ const staticData = [
|
|
|
status: '在用'
|
|
|
}
|
|
|
];
|
|
|
-let writeFormState = reactive({
|
|
|
+let fillingAddState = reactive({
|
|
|
show: false,
|
|
|
eventId: ''
|
|
|
});
|
|
|
-let formDetailState = reactive({
|
|
|
+
|
|
|
+let tableDetailsState = reactive({
|
|
|
show: false,
|
|
|
eventId: ''
|
|
|
});
|
|
|
+
|
|
|
const handleCancel = () => {
|
|
|
- writeFormState.show = false;
|
|
|
- formDetailState.show = false;
|
|
|
+ fillingAddmState.show = false;
|
|
|
+ tableDetailsState.show = false;
|
|
|
};
|
|
|
-const handleWrite = (row) => {
|
|
|
- if (row) {
|
|
|
- writeFormState.eventId = row.id;
|
|
|
- writeFormState.show = true;
|
|
|
- }
|
|
|
+const handleAdd = () => {
|
|
|
+ fillingAddState.eventId = null; // 表示新增记录
|
|
|
+ fillingAddState.show = true;
|
|
|
};
|
|
|
const handleView = (row) => {
|
|
|
if (row) {
|
|
|
- formDetailState.eventId = row.id;
|
|
|
- formDetailState.show = true;
|
|
|
+ tableDetailsState.eventId = row.id;
|
|
|
+ tableDetailsState.show = true;
|
|
|
}
|
|
|
};
|
|
|
+
|
|
|
// 初始化数据
|
|
|
onMounted(() => {
|
|
|
tableData.value = staticData;
|
|
|
@@ -177,4 +179,22 @@ const handleSelectionChange = (selection) => {
|
|
|
const handleTimeChange = (value) => {
|
|
|
selectedTimeLabel.value = value ? `${value[0]} 至 ${value[1]}` : '请选择时间';
|
|
|
};
|
|
|
+
|
|
|
+const exportTableData = () => {
|
|
|
+ const dataForExport = tableData.value.map((item) => ({
|
|
|
+ table_id: item.table_id,
|
|
|
+ table_name: item.table_name,
|
|
|
+ release_time: item.release_time,
|
|
|
+ release_status: item.release_status,
|
|
|
+ filling_time: item.filling_time,
|
|
|
+ status: item.status
|
|
|
+ }));
|
|
|
+
|
|
|
+ // 使用 xlsx库创建一个工作簿和工作表，然后填入数据
|
|
|
+ const workbook = XLSXLSX.utils.book_new();
|
|
|
+ XLSX.utils.sheet_add_aoa(workbook, dataForExport, { name: 'sheet1' });
|
|
|
+
|
|
|
+ // 生成Excel文件并下载
|
|
|
+ XLSX.utils.save_a(workbook, 'tableData.xlsx');
|
|
|
+};
|
|
|
</script>
|
