506 lines
18 KiB
JavaScript
506 lines
18 KiB
JavaScript
|
//思路：1、根据renderController生成的目录，将每个目录下的getpage文件读取出来，查找<any,和>(`中间的字符串获取到接口返回类型的名称，
|
|||
|
|
//2、将获取到的类型名称，从interface目录下读取出来，然后查找data:和下一个;之间的字符串，用replace方法将空格去掉，获取到data的类型名称
|
|||
|
|
//2.1、继续在getpage文件中查找 `符号和`符号间的数据例如`/api/admin/api/get-page`，用replace去掉/get-page，然后再将/替换成冒号:（用来设置权限）
|
|||
|
|
// 3、将获取到的data的类型名称，从interface目录下读取出来，然后查找list:和下一个;之间的字符串,用replace方法将[]和空格去掉，获取到list的类型名称
|
|||
|
|
// 4、将获取到的list的类型名称，从interface目录下读取出来，查找大括号{}中的数据，将这个字符串放到之前我写好的内容中（待改善），可以生成到table中每一个字段的column
|
|||
|
|
|
|||
|
|
const content = `
|
|||
|
|
<!--
|
|||
|
|
此代码由renderVue工具自动生成
|
|||
|
|
作者：mask
|
|||
|
|
-->
|
|||
|
|
|
|||
|
|
<template>
|
|||
|
|
<div class="my-layout">
|
|||
|
|
<el-card class="mt8" shadow="never" :body-style="{ paddingBottom: '0' }">
|
|||
|
|
<el-form :inline="true" @submit.stop.prevent>
|
|||
|
|
<div class="search-box">
|
|||
|
|
<div class="search-simple-box">
|
|||
|
|
<el-form-item>
|
|||
|
|
<my-select-input v-model="state.basic" :filters="state.filters" />
|
|||
|
|
</el-form-item>
|
|||
|
|
<el-form-item>
|
|||
|
|
<el-link type="primary" @click.prevent="openAdvancedSearch">高级搜索</el-link>
|
|||
|
|
</el-form-item>
|
|||
|
|
</div>
|
|||
|
|
<div class="func-btn-box">
|
|||
|
|
<el-form-item>
|
|||
|
|
<el-checkbox class="mr10" v-model="listView.state.pageInput.isDelete" label="已删除" size="large"
|
|||
|
|
@change="onSearch" />
|
|||
|
|
<el-button type="primary" :loading="listView.state.listLoading" size="default" @click="onSearch"> 查询
|
|||
|
|
</el-button>
|
|||
|
|
<el-button type="warning" size="default" @click="cleanSearchParams"> 重置
|
|||
|
|
</el-button>
|
|||
|
|
<el-button v-auth="'<%= permissionPrefix %>:add'" type="primary" size="default" @click="onAdd"> 新增 </el-button>
|
|||
|
|
<!-- 判断条件需要放到单独的标签中，否则切换时会导致渲染问题 -->
|
|||
|
|
<template v-if="!listView.state.pageInput.isDelete">
|
|||
|
|
<el-button :loading="listView.state.batchSoftDeleteLoading" size="default"
|
|||
|
|
v-auth="'<%= permissionPrefix %>:soft-delete'" type="danger" :disabled="!selected.length"
|
|||
|
|
@click="onSelectSoftDelete">
|
|||
|
|
批量删除
|
|||
|
|
</el-button>
|
|||
|
|
</template>
|
|||
|
|
<template v-if="listView.state.pageInput.isDelete">
|
|||
|
|
<el-button :loading="listView.state.batchDeleteLoading" size="default" v-auth="'<%= permissionPrefix %>:delete'"
|
|||
|
|
type="danger" :disabled="!selected.length" @click="onSelectDelete"> 批量彻底删除
|
|||
|
|
</el-button>
|
|||
|
|
<el-button :loading="listView.state.batchRecoveryLoading" size="default" v-auth="'<%= permissionPrefix %>:delete'"
|
|||
|
|
type="success" :disabled="!selected.length" @click="onSelectRefresh">
|
|||
|
|
批量恢复
|
|||
|
|
</el-button>
|
|||
|
|
</template>
|
|||
|
|
<el-button :loading="listView.state.downloadLoading" size="default" v-auth="'<%= permissionPrefix %>:add'"
|
|||
|
|
type="success" @click="onDownload">
|
|||
|
|
下载导入模板 </el-button>
|
|||
|
|
<!-- bind解决this指向的问题 -->
|
|||
|
|
<el-upload v-auth="'<%= permissionPrefix %>:add'" class="upload-import" :action="importObject.importUrl"
|
|||
|
|
:headers="{ 'Authorization': listView.token }"
|
|||
|
|
:on-success="importObject.onImportSuccess.bind(importObject)"
|
|||
|
|
:on-error="importObject.onImportError.bind(importObject)"
|
|||
|
|
:on-progress="importObject.onImportProgress.bind(importObject)" :auto-upload="true"
|
|||
|
|
:show-file-list="false">
|
|||
|
|
<el-button :loading="importObject.importLoading" size="default" type="warning" class="ml10">
|
|||
|
|
导入模板
|
|||
|
|
</el-button>
|
|||
|
|
</el-upload>
|
|||
|
|
</el-form-item>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</el-form>
|
|||
|
|
</el-card>
|
|||
|
|
<el-card class="my-fill mt8" shadow="never">
|
|||
|
|
<el-table ref="table" :data="listView.state.list" style="width: 100%" v-loading="listView.state.listLoading"
|
|||
|
|
row-key="id" default-expand-all @selection-change="handleSelectionChange">
|
|||
|
|
<el-table-column type="selection" width="55" />
|
|||
|
|
<%- tableColumn %>
|
|||
|
|
<el-table-column label="操作" width="180" fixed="right" header-align="center" align="center">
|
|||
|
|
<template #default="{ row, $index }">
|
|||
|
|
<el-button v-auth="'<%= permissionPrefix %>:update'" size="small" text type="primary" @click.stop="onEdit(row)"
|
|||
|
|
v-if="!row.isDeleted">编辑</el-button>
|
|||
|
|
<el-button v-auth="'<%= permissionPrefix %>:soft-delete'" size="small" text type="danger"
|
|||
|
|
@click.stop="onSoftDelete(row)" v-if="!row.isDeleted">删除</el-button>
|
|||
|
|
<el-button v-auth="'<%= permissionPrefix %>:get'" size="small" text type="warning" @click.stop="onOpenDetail(row)"
|
|||
|
|
v-if="!row.isDeleted">查看</el-button>
|
|||
|
|
<el-button v-auth="'<%= permissionPrefix %>:delete'" size="small" text type="danger" @click.stop="onDelete(row)"
|
|||
|
|
v-if="row.isDeleted">彻底删除</el-button>
|
|||
|
|
<el-button v-auth="'<%= permissionPrefix %>:delete'" size="small" text type="success" @click.stop="onRefresh(row)"
|
|||
|
|
v-if="row.isDeleted">恢复</el-button>
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>
|
|||
|
|
</el-table>
|
|||
|
|
|
|||
|
|
<div class="my-flex my-flex-end" style="margin-top: 20px">
|
|||
|
|
<el-pagination v-model:currentPage="listView.state.pageInput.currentPage"
|
|||
|
|
v-model:page-size="listView.state.pageInput.pageSize" :total="listView.state.total"
|
|||
|
|
:page-sizes="[10, 20, 50, 100]" small background @size-change="onSizeChange" @current-change="onCurrentChange"
|
|||
|
|
layout="total, sizes, prev, pager, next, jumper" />
|
|||
|
|
</div>
|
|||
|
|
</el-card>
|
|||
|
|
<!-- 根据新增接口中是否有字典类型生成sexOptions -->
|
|||
|
|
<FormDialog ref="FormDialogRef" @refresh="onQuery">
|
|||
|
|
</FormDialog>
|
|||
|
|
<DetailDialog ref="detailDialogRef" />
|
|||
|
|
<AdvancedSearch ref="AdvancedSearchRef" v-model="listView.state.isShowAdvancedSearch"
|
|||
|
|
:modelFilter="state.advancedSearchParams" v-model:model-controlinput="state.controlinput" :filters="state.filters"
|
|||
|
|
@get-model-controlinput="getAdvancedSearchControlinput" @getData="getAdvancedSearchData">
|
|||
|
|
</AdvancedSearch>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script lang="ts" setup name="<%= permissionPrefix.replaceAll(':','-') %>">
|
|||
|
|
import { ref, reactive, onMounted, getCurrentInstance, onBeforeMount, defineAsyncComponent, onActivated, onDeactivated } from 'vue'
|
|||
|
|
import { formatterTime } from '/@/utils/format'
|
|||
|
|
import { <%= dirName %>ListOutput } from '/@/api/interface'
|
|||
|
|
import { getDictLabel } from '/@/utils/dictUtils';
|
|||
|
|
import { useDictListInfo } from '/@/stores/dictListInfo';
|
|||
|
|
import { storeToRefs } from 'pinia';
|
|||
|
|
import {
|
|||
|
|
<%= lowerCasedirName %>GetPage,
|
|||
|
|
<%= lowerCasedirName %>BatchDelete,
|
|||
|
|
<%= lowerCasedirName %>Delete,
|
|||
|
|
<%= lowerCasedirName %>BatchSoftDelete,
|
|||
|
|
<%= lowerCasedirName %>BatchRecovery,
|
|||
|
|
<%= lowerCasedirName %>DownloadTemplate,
|
|||
|
|
<%= lowerCasedirName %>SoftDelete,
|
|||
|
|
<%= lowerCasedirName %>Recovery,
|
|||
|
|
} from '/@/api/controller'
|
|||
|
|
import { useListView } from '/@/hooks/useListView'
|
|||
|
|
|
|||
|
|
const storesUseUserInfo = useDictListInfo()
|
|||
|
|
const { dictListInfo } = storeToRefs(storesUseUserInfo)
|
|||
|
|
|
|||
|
|
// 引入组件
|
|||
|
|
const AdvancedSearch = defineAsyncComponent(() => import('/@/components/AdvancedSearch/index.vue'))
|
|||
|
|
|
|||
|
|
const FormDialog = defineAsyncComponent(() => import('./components/form-dialog.vue'))
|
|||
|
|
const DetailDialog = defineAsyncComponent(() => import('./components/detail-dialog.vue'))
|
|||
|
|
const MySelectInput = defineAsyncComponent(() => import('/@/components/my-select-input/index.vue'))
|
|||
|
|
|
|||
|
|
const { proxy } = getCurrentInstance() as any
|
|||
|
|
|
|||
|
|
const FormDialogRef = ref()
|
|||
|
|
|
|||
|
|
const detailDialogRef = ref()
|
|||
|
|
|
|||
|
|
const listView = useListView()
|
|||
|
|
|
|||
|
|
const state = reactive({
|
|||
|
|
//基础搜索
|
|||
|
|
basic: {} as DynamicFilterInfo,
|
|||
|
|
//AdvancedSearch组件中的ControlScreenInput组件 作用：回显
|
|||
|
|
controlinput: [] as Array<DynamicFilterInfo>,
|
|||
|
|
//高级搜索参数
|
|||
|
|
advancedSearchParams: {},
|
|||
|
|
//高级搜索
|
|||
|
|
filters: [
|
|||
|
|
<% filters.forEach(function(itemKey,itemIndex) { %>{
|
|||
|
|
field: '<%= itemKey.field %>',
|
|||
|
|
operator: '<%= itemKey.operator %>',
|
|||
|
|
description: '<%= itemKey.description %>',
|
|||
|
|
componentName: '<%= itemKey.componentName %>',
|
|||
|
|
defaultSelect: <%= !itemIndex %>,
|
|||
|
|
},<% }) %>
|
|||
|
|
] as Array<DynamicFilterInfo>,
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
//处理获取列表的请求参数
|
|||
|
|
function initListParams() {
|
|||
|
|
//state.controlinput 为 ControlScreenInput组件过滤的参数
|
|||
|
|
//state.filter 为 其余筛选组件过滤的参数
|
|||
|
|
let params = [state.basic, ...Object.values(state.advancedSearchParams)]
|
|||
|
|
console.log(state.advancedSearchParams);
|
|||
|
|
|
|||
|
|
let filters = params.map((item: any) => {
|
|||
|
|
if ((typeof item.value === 'object' && item.value.length) || (typeof item.value == 'string' && item.value) || typeof item.value == 'number' || typeof item.value == 'boolean') {
|
|||
|
|
return item
|
|||
|
|
} else {
|
|||
|
|
return {}
|
|||
|
|
}
|
|||
|
|
}).filter(obj => Object.keys(obj).length !== 0)
|
|||
|
|
|
|||
|
|
listView.state.pageInput.dynamicFilter = {
|
|||
|
|
...listView.state.pageInput.dynamicFilter,
|
|||
|
|
//用来筛选表中没有储存的数据
|
|||
|
|
filters: filters
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function onQuery() {
|
|||
|
|
//注意这里的<%= lowerCasedirName %>GetPage的规则是 （接口的http请求方式 + 接口的完整路径） （驼峰命名，首字母小写）
|
|||
|
|
initListParams()
|
|||
|
|
listView.onQuery(<%= lowerCasedirName %>GetPage)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//搜索
|
|||
|
|
function onSearch() {
|
|||
|
|
listView.initPageInput()
|
|||
|
|
onQuery()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const selected: any = ref([])
|
|||
|
|
|
|||
|
|
//表格多选
|
|||
|
|
const handleSelectionChange = (selection: any) => {
|
|||
|
|
selected.value = selection
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//将选中的多选内容，装换成只含id的数组
|
|||
|
|
function initSelectParams(): number[] | [] {
|
|||
|
|
return selected.value.map((item: any) => {
|
|||
|
|
return item.id
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//批量删除
|
|||
|
|
function onSelectSoftDelete() {
|
|||
|
|
listView.onMultipleSoftDelete(<%= lowerCasedirName %>BatchSoftDelete, initSelectParams(), onSearch)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//批量彻底删除
|
|||
|
|
function onSelectDelete() {
|
|||
|
|
listView.onMultipleDelete(<%= lowerCasedirName %>BatchDelete, initSelectParams(), onSearch)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//批量恢复
|
|||
|
|
function onSelectRefresh() {
|
|||
|
|
listView.onMultipleRecovery(<%= lowerCasedirName %>BatchRecovery, initSelectParams(), onSearch)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//恢复 注意修改row.name
|
|||
|
|
const onRefresh = async (row: <%= dirName %>ListOutput) => {
|
|||
|
|
proxy.$modal
|
|||
|
|
.confirmDelete(\`确定要恢复当前数据?\`)
|
|||
|
|
.then(async () => {
|
|||
|
|
if (row.id) {
|
|||
|
|
await <%= lowerCasedirName %>Recovery({ id: row.id })
|
|||
|
|
onQuery()
|
|||
|
|
} else {
|
|||
|
|
proxy.$modal.msgError('id为空')
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
.catch(() => { })
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//下载模板
|
|||
|
|
function onDownload() {
|
|||
|
|
listView.onDownload(<%= lowerCasedirName %>DownloadTemplate)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//软删除 注意修改row.name
|
|||
|
|
const onSoftDelete = (row: <%= dirName %>ListOutput) => {
|
|||
|
|
proxy.$modal
|
|||
|
|
.confirmDelete(\`确定要删除当前数据?\`)
|
|||
|
|
.then(async () => {
|
|||
|
|
try {
|
|||
|
|
if (row.id == undefined) return proxy.$modal.msgError('id不能为空')
|
|||
|
|
let res = await <%= lowerCasedirName %>SoftDelete({ id: row.id })
|
|||
|
|
if (res.success) {
|
|||
|
|
onQuery()
|
|||
|
|
proxy.$modal.msgSuccess('删除成功')
|
|||
|
|
} else {
|
|||
|
|
proxy.$modal.msgError(res.msg)
|
|||
|
|
}
|
|||
|
|
} catch (error) {
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//彻底删除 注意修改row.name
|
|||
|
|
const onDelete = (row: <%= dirName %>ListOutput) => {
|
|||
|
|
proxy.$modal
|
|||
|
|
.confirmDelete(\`确定要删除当前数据?\`)
|
|||
|
|
.then(async () => {
|
|||
|
|
if (row.id) {
|
|||
|
|
try {
|
|||
|
|
let res = await <%= lowerCasedirName %>Delete({ id: row.id })
|
|||
|
|
if (res.success) {
|
|||
|
|
onQuery()
|
|||
|
|
proxy.$modal.msgSuccess('删除成功')
|
|||
|
|
} else {
|
|||
|
|
proxy.$modal.msgError(res.msg)
|
|||
|
|
}
|
|||
|
|
} catch (error) {
|
|||
|
|
proxy.$modal.msgError(error)
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
proxy.$modal.msgError('id为空')
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const importObject = new listView.ImportFile(onSearch, '/api/demo/demo/import')
|
|||
|
|
|
|||
|
|
const onAdd = () => {
|
|||
|
|
console.log(FormDialogRef.value);
|
|||
|
|
FormDialogRef.value.open()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const onEdit = (row: any) => {
|
|||
|
|
FormDialogRef.value.open(row)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// 打开详情
|
|||
|
|
const onOpenDetail = (row: any) => {
|
|||
|
|
detailDialogRef.value.open(row)
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const onSizeChange = (val: number) => {
|
|||
|
|
listView.state.pageInput.pageSize = val
|
|||
|
|
onQuery()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
const onCurrentChange = (val: number) => {
|
|||
|
|
listView.state.pageInput.currentPage = val
|
|||
|
|
onQuery()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 打开高级搜索
|
|||
|
|
*/
|
|||
|
|
function openAdvancedSearch() {
|
|||
|
|
listView.state.isShowAdvancedSearch = true
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 重置搜索
|
|||
|
|
*/
|
|||
|
|
const AdvancedSearchRef = ref()
|
|||
|
|
function cleanSearchParams() {
|
|||
|
|
state.basic.value = ''
|
|||
|
|
AdvancedSearchRef.value.exportReset()
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 获取高级搜索中的数据
|
|||
|
|
*/
|
|||
|
|
function getAdvancedSearchData(pararm: any) {
|
|||
|
|
state.advancedSearchParams = JSON.parse(JSON.stringify(pararm)) // 深拷贝，防止修改state中的数据
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
function getAdvancedSearchControlinput(controlinput: DynamicFilterInfo[]) {
|
|||
|
|
state.controlinput = JSON.parse(JSON.stringify(controlinput)) // 深拷贝，防止修改state中的数据
|
|||
|
|
}
|
|||
|
|
onActivated(() => {
|
|||
|
|
// listView.onQuery(<%= lowerCasedirName %>GetPage(state.pageInput))
|
|||
|
|
// !!!!!!!!!!!注意这里<%= dirName %>需要根据列表名称进行改动，不然有可能会出问题
|
|||
|
|
// 表单组件中的<%= dirName %>也需要更改
|
|||
|
|
// （页面缓存时使用）
|
|||
|
|
// eventBus.off('refresh<%= dirName %>')
|
|||
|
|
// eventBus.on('refresh<%= dirName %>', () => {
|
|||
|
|
// onQuery()
|
|||
|
|
// })
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
onDeactivated(() => {
|
|||
|
|
//这里销毁 （页面缓存时使用）
|
|||
|
|
// eventBus.off('refresh<%= dirName %>')
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 下一步封装计划
|
|||
|
|
*
|
|||
|
|
* 1. 列表中操作栏的按钮需要封装成一个按钮组件，才能拥有自己单独的loading
|
|||
|
|
* 2. 封装表单新增/修改方法
|
|||
|
|
*
|
|||
|
|
* **/
|
|||
|
|
|
|||
|
|
onMounted(() => {
|
|||
|
|
onQuery()
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
|
|||
|
|
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped lang="scss"></style>
|
|||
|
|
`;
|
|||
|
|
let ejs = require('ejs');
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 生成表格的列
|
|||
|
|
* @param {*} barr { label: string, prop: string, type: string }[]
|
|||
|
|
*/
|
|||
|
|
function renderElTableColumn(barr) {
|
|||
|
|
/**
|
|||
|
|
* 生成的el-table-column数据
|
|||
|
|
*/
|
|||
|
|
let tableColumn = '';
|
|||
|
|
// 遍历过滤后的数组
|
|||
|
|
for (let i = 0; i < barr.length; i++) {
|
|||
|
|
// 如果对象标签中包含字典
|
|||
|
|
if (barr[i].label.indexOf('字典') != -1) {
|
|||
|
|
// 调用renderDictColumn函数，生成el-table-column数据
|
|||
|
|
tableColumn += renderDictColumn(barr[i]);
|
|||
|
|
// 如果对象标签中包含是否
|
|||
|
|
} else if (barr[i].label.indexOf('是否') != -1) {
|
|||
|
|
// 调用renderBooleanColumn函数，生成el-table-column数据
|
|||
|
|
tableColumn += renderBooleanColumn(barr[i]);
|
|||
|
|
// 如果对象标签中包含日期
|
|||
|
|
} else if (barr[i].label.indexOf('日期') != -1) {
|
|||
|
|
// 调用renderDateColumn函数，生成el-table-column数据
|
|||
|
|
tableColumn += renderDateColumn(barr[i]);
|
|||
|
|
// 如果对象标签中不包含字典、是否、日期
|
|||
|
|
} else {
|
|||
|
|
// 调用renderDateColumn函数，生成el-table-column数据
|
|||
|
|
tableColumn += `${`<el-table-column label="${barr[i].label}" prop="${barr[i].prop}" show-overflow-tooltip />\n`}`;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
return tableColumn;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 生成表格的高级搜索参数
|
|||
|
|
* @param {*} barr { label: string, prop: string, type: string }[]
|
|||
|
|
*/
|
|||
|
|
function renderFilters(barr) {
|
|||
|
|
let filters = [];
|
|||
|
|
for (let i = 0; i < barr.length; i++) {
|
|||
|
|
// 如果对象标签中包含字典
|
|||
|
|
if (barr[i].type == 'string') {
|
|||
|
|
filters.push({
|
|||
|
|
field: barr[i].prop,
|
|||
|
|
operator: 'Contains',
|
|||
|
|
description: barr[i].label,
|
|||
|
|
componentName: 'el-input',
|
|||
|
|
defaultSelect: !i,
|
|||
|
|
});
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
return filters;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 生成表格列表页
|
|||
|
|
* @param {array} arr
|
|||
|
|
* @param {string} dirName 文件夹名称
|
|||
|
|
* @param {string} permissionPrefix 权限前缀
|
|||
|
|
* @returns
|
|||
|
|
*/
|
|||
|
|
function renderTable(arr, dirName, permissionPrefix) {
|
|||
|
|
/**
|
|||
|
|
* 生成的el-table-column数据
|
|||
|
|
*/
|
|||
|
|
let tableColumn = '';
|
|||
|
|
let filters = [];
|
|||
|
|
// 过滤掉不需要生成的字段
|
|||
|
|
let filter = ['附件'];
|
|||
|
|
|
|||
|
|
// 过滤数组
|
|||
|
|
let barr = arr.filter((item) => {
|
|||
|
|
// 声明一个布尔值
|
|||
|
|
let isFlag = true;
|
|||
|
|
// 遍历过滤字段
|
|||
|
|
filter.map((filterItem) => {
|
|||
|
|
// 如果过滤字段在对象标签中，则将布尔值设置为false
|
|||
|
|
if (item.label.indexOf(filterItem) !== -1) {
|
|||
|
|
return (isFlag = false);
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
// 如果布尔值为false，则返回false
|
|||
|
|
if (!isFlag) {
|
|||
|
|
return false;
|
|||
|
|
// 如果布尔值为true，则返回true
|
|||
|
|
} else {
|
|||
|
|
return true;
|
|||
|
|
}
|
|||
|
|
});
|
|||
|
|
|
|||
|
|
tableColumn = renderElTableColumn(barr);
|
|||
|
|
filters = renderFilters(barr);
|
|||
|
|
let lowerCasedirName = dirName.charAt(0).toLowerCase() + dirName.slice(1);
|
|||
|
|
let templateStr = ejs.render(content, { barr, permissionPrefix, tableColumn, filters: filters, dirName, lowerCasedirName });
|
|||
|
|
|
|||
|
|
return templateStr;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//生成字典行
|
|||
|
|
function renderDictColumn(item) {
|
|||
|
|
return `${`<el-table-column prop="${item.prop}" label="${item.label}" min-width="120" show-overflow-tooltip>
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
{{ getDictLabel(dictListInfo.${item.prop},
|
|||
|
|
row.${item.prop}) }}
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>`}\n`;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//生成 是否 字段的行
|
|||
|
|
function renderBooleanColumn(item) {
|
|||
|
|
return `${`<el-table-column label="${item.label}" prop="${item.prop}" >
|
|||
|
|
<template #default="{ row }">
|
|||
|
|
{{ row.${item.prop} ? '是' : '否' }}
|
|||
|
|
</template>
|
|||
|
|
</el-table-column>`}\n`;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//生成 日期 字段的行
|
|||
|
|
function renderDateColumn(item) {
|
|||
|
|
return `${`<el-table-column prop="${item.prop}" label="${item.label}" :formatter="formatterTime" min-width="120" />\n`}`;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
module.exports = {
|
|||
|
|
renderTable,
|
|||
|
|
};
|