|
|
@@ -0,0 +1,108 @@
|
|
|
+<template>
|
|
|
+ <div class="button" @click="toDownload">导出数据</div>
|
|
|
+ <el-dialog title="导出数据" v-model="show" :destroy-on-close="true" @close="toClose">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24" class="one">
|
|
|
+ <el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选</el-checkbox>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="two">
|
|
|
+ <el-checkbox-group v-model="checkedExport" @change="checkedExportChange">
|
|
|
+ <el-checkbox v-for="i in ecList" :label="i.column" :key="i.model">{{ i.zh }}</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24" class="btn">
|
|
|
+ <el-button type="primary" size="mini" @click="toFile()">导出</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-dialog>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script setup>
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
+import { UserStore } from '@/store/user'
|
|
|
+const userStore = UserStore()
|
|
|
+const user = computed(() => userStore.user)
|
|
|
+const $checkRes = inject('$checkRes')
|
|
|
+import { get } from 'lodash-es'
|
|
|
+import { ExportConfigStore } from '@/store/api/exportConfig'
|
|
|
+const ecStore = ExportConfigStore()
|
|
|
+const props = defineProps({
|
|
|
+ table: { type: String, required: true }
|
|
|
+})
|
|
|
+const show = ref(false)
|
|
|
+const checkedExport = ref([])
|
|
|
+const checkAll = ref(false)
|
|
|
+const isIndeterminate = ref(false)
|
|
|
+// 全选
|
|
|
+const handleCheckAllChange = (val) => {
|
|
|
+ if (val) {
|
|
|
+ checkedExport.value = ecList.value.map((i) => i.column)
|
|
|
+ } else {
|
|
|
+ checkedExport.value = []
|
|
|
+ }
|
|
|
+ isIndeterminate.value = false
|
|
|
+}
|
|
|
+// 选择
|
|
|
+const checkedExportChange = (value) => {
|
|
|
+ checkedExport.value = value
|
|
|
+ let checkedCount = value.length
|
|
|
+ const isCheckAll = checkedCount === ecList.value.length
|
|
|
+ checkAll.value = isCheckAll
|
|
|
+ if (value.length <= 0) isIndeterminate.value = false
|
|
|
+ else if (isCheckAll) isIndeterminate.value = false
|
|
|
+ else isIndeterminate.value = true
|
|
|
+}
|
|
|
+// 导出数据
|
|
|
+const toFile = async () => {
|
|
|
+ if (checkedExport.value.length > 0) {
|
|
|
+ const reqData = { table: props.table, config: checkedExport.value, user: user.value.id }
|
|
|
+ const res = await ecStore.mission(reqData)
|
|
|
+ if ($checkRes(res)) {
|
|
|
+ ElMessage({ type: `success`, message: `数据正在导出,请进入 导出管理 中查看` })
|
|
|
+ }
|
|
|
+ toClose()
|
|
|
+ } else {
|
|
|
+ ElMessage({ type: `warning`, message: `请选择导出信息字段` })
|
|
|
+ }
|
|
|
+}
|
|
|
+const toClose = () => {
|
|
|
+ show.value = false
|
|
|
+ checkedExport.value = []
|
|
|
+ checkAll.value = false
|
|
|
+ isIndeterminate.value = false
|
|
|
+}
|
|
|
+
|
|
|
+const ecList = ref([])
|
|
|
+const toDownload = async () => {
|
|
|
+ show.value = true
|
|
|
+ const result = await ecStore.fetch(props.table)
|
|
|
+ if ($checkRes(result)) {
|
|
|
+ ecList.value = get(result, 'data.config', [])
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+<style scoped>
|
|
|
+.button {
|
|
|
+ background: #1875df;
|
|
|
+ padding: 0 10px;
|
|
|
+ height: 30px;
|
|
|
+ color: #fff;
|
|
|
+ line-height: 30px;
|
|
|
+ text-align: center;
|
|
|
+ cursor: default;
|
|
|
+ margin: 0 10px 0 0;
|
|
|
+}
|
|
|
+.one {
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+}
|
|
|
+.two {
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ :deep(.el-checkbox) {
|
|
|
+ padding: 0 0 20px 0;
|
|
|
+ }
|
|
|
+}
|
|
|
+.btn {
|
|
|
+ text-align: center;
|
|
|
+ margin: 20px 0 0 0;
|
|
|
+}
|
|
|
+</style>
|
