Web/admin-govern
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修改报表绑定指标

Browse Source
This commit is contained in:
guanj
2025-11-25 15:15:38 +08:00
parent f916721b6a
commit 0c71b2ac32
10 changed files with 785 additions and 572 deletions
Download Patch File Download Diff File Expand all files Collapse all files

251
src/layouts/admin/index.vue
View File

@@ -1,125 +1,126 @@
<template> <template>
<component :is='config.layout.layoutMode'></component> <component :is='config.layout.layoutMode'></component>
</template> </template>
<script setup lang='ts'> <script setup lang='ts'>
import { reactive } from 'vue' import { reactive } from 'vue'
import { useConfig } from '@/stores/config' import { useConfig } from '@/stores/config'
import { useNavTabs } from '@/stores/navTabs' import { useNavTabs } from '@/stores/navTabs'
import { useAdminInfo } from '@/stores/adminInfo' import { useAdminInfo } from '@/stores/adminInfo'
import { useDictData } from '@/stores/dictData' import { useDictData } from '@/stores/dictData'
import { useRoute } from 'vue-router' import { useRoute } from 'vue-router'
import Default from '@/layouts/admin/container/default.vue' import Default from '@/layouts/admin/container/default.vue'
import Classic from '@/layouts/admin/container/classic.vue' import Classic from '@/layouts/admin/container/classic.vue'
import Streamline from '@/layouts/admin/container/streamline.vue' import Streamline from '@/layouts/admin/container/streamline.vue'
import Double from '@/layouts/admin/container/double.vue' import Double from '@/layouts/admin/container/double.vue'
import { onMounted, onBeforeMount } from 'vue' import { onMounted, onBeforeMount } from 'vue'
import { handleAdminRoute, getFirstRoute, routePush } from '@/utils/router' import { handleAdminRoute, getFirstRoute, routePush } from '@/utils/router'
import router from '@/router/index' import router from '@/router/index'
import { useEventListener } from '@vueuse/core' import { useEventListener } from '@vueuse/core'
import { isEmpty } from 'lodash-es' import { isEmpty } from 'lodash-es'
import { setNavTabsWidth } from '@/utils/layout' import { setNavTabsWidth } from '@/utils/layout'
import { adminBaseRoutePath } from '@/router/static' import { adminBaseRoutePath } from '@/router/static'
import { getRouteMenu, dictDataCache } from '@/api/auth' import { getRouteMenu, dictDataCache } from '@/api/auth'
import { getAreaList, areaSelect } from '@/api/common' import { getAreaList, areaSelect } from '@/api/common'
import { BasicDictData } from '@/stores/interface' import { BasicDictData } from '@/stores/interface'
import { getAllUserSimpleList, getUserById } from '@/api/user-boot/user' import { getAllUserSimpleList, getUserById } from '@/api/user-boot/user'
defineOptions({ defineOptions({
components: { Default, Classic, Streamline, Double } components: { Default, Classic, Streamline, Double }
}) })
const navTabs = useNavTabs() const navTabs = useNavTabs()
const config = useConfig() const config = useConfig()
const route = useRoute() const route = useRoute()
const adminInfo = useAdminInfo() const adminInfo = useAdminInfo()
const dictData = useDictData() const dictData = useDictData()
const state = reactive({ const state = reactive({
autoMenuCollapseLock: false autoMenuCollapseLock: false
}) })
onMounted(() => { onMounted(() => {
// if (!adminInfo.token) return router.push({ name: 'login' }) // if (!adminInfo.token) return router.push({ name: 'login' })
init() init()
setNavTabsWidth() setNavTabsWidth()
useEventListener(window, 'resize', setNavTabsWidth) useEventListener(window, 'resize', setNavTabsWidth)
}) })
onBeforeMount(() => { onBeforeMount(() => {
onAdaptiveLayout() onAdaptiveLayout()
useEventListener(window, 'resize', onAdaptiveLayout) useEventListener(window, 'resize', onAdaptiveLayout)
}) })
const init = async () => { const init = async () => {
await Promise.all([getAreaList(), dictDataCache(), getUserById(), areaSelect(),getAllUserSimpleList()]).then(res => { await Promise.all([getAreaList(), dictDataCache(), getUserById(), areaSelect(),getAllUserSimpleList()]).then(res => {
dictData.state.area = res[0].data dictData.state.area = res[0].data
dictData.state.basic = res[1].data dictData.state.basic = res[1].data
// dictData.state.userList=res[4].data // dictData.state.userList=res[4].data
adminInfo.dataFill(res[2].data) adminInfo.dataFill(res[2].data)
// dictData.state.areaTree = res[3].data // dictData.state.areaTree = res[3].data
}) })
/** /**
* 后台初始化请求，获取站点配置，动态路由等信息 * 后台初始化请求，获取站点配置，动态路由等信息
*/ */
getRouteMenu().then((res: any) => { getRouteMenu().then((res: any) => {
const handlerMenu = (data: any) => { const handlerMenu = (data: any) => {
data.forEach((item: any) => { data.forEach((item: any) => {
item.routePath = item.routePath =
item.routePath[0] == '/' ? item.routePath.substring(1, item.routePath.length) : item.routePath item.routePath[0] == '/' ? item.routePath.substring(1, item.routePath.length) : item.routePath
item.path = item.routePath item.path = item.routePath
item.name = item.routePath item.name = item.routePath
item.keepalive = item.routePath item.keepalive = item.routePath
item.component = item.routeName item.component = item.routeName
? item.routeName.indexOf('/src/views/') > -1 ? item.routeName.indexOf('/src/views/') > -1
? item.routeName ? item.routeName
: `/src/views/${item.routeName}/index.vue` : `/src/views/${item.routeName}/index.vue`
: '' : ''
item.type = item.children && item.children.length > 0 ? 'menu_dir' : 'menu' item.type = item.children && item.children.length > 0 ? 'menu_dir' : 'menu'
item.menu_type = item.children && item.children.length > 0 ? null : 'tab' item.menu_type = item.children && item.children.length > 0 ? null : 'tab'
if (item.children) { if (item.children) {
handlerMenu(item.children) handlerMenu(item.children)
} }
}) })
} }
handlerMenu(res.data) handlerMenu(res.data)
handleAdminRoute(res.data) handleAdminRoute(res.data)
if (route.params.to) { if (route.params.to) {
const lastRoute = JSON.parse(route.params.to as string) const lastRoute = JSON.parse(route.params.to as string)
if (lastRoute.path != adminBaseRoutePath) {
let query = !isEmpty(lastRoute.query) ? lastRoute.query : {} if (lastRoute.path != adminBaseRoutePath) {
routePush({ path: lastRoute.path, query: query }) let query = !isEmpty(lastRoute.query) ? lastRoute.query : {}
return routePush({ path: lastRoute.path, query: query })
} return
} }
// 跳转到第一个菜单 }
let firstRoute = getFirstRoute(navTabs.state.tabsViewRoutes) // 跳转到第一个菜单
if (firstRoute) routePush(firstRoute.path) let firstRoute = getFirstRoute(navTabs.state.tabsViewRoutes)
}) if (firstRoute) routePush(firstRoute.path)
} })
}
const onAdaptiveLayout = () => {
let defaultBeforeResizeLayout = { const onAdaptiveLayout = () => {
layoutMode: config.layout.layoutMode, let defaultBeforeResizeLayout = {
menuCollapse: config.layout.menuCollapse layoutMode: config.layout.layoutMode,
} menuCollapse: config.layout.menuCollapse
}
const clientWidth = document.body.clientWidth
if (clientWidth < 1024) { const clientWidth = document.body.clientWidth
/** if (clientWidth < 1024) {
* 锁定窗口改变自动调整 menuCollapse /**
* 避免已是小窗且打开了菜单栏时，意外的自动关闭菜单栏 * 锁定窗口改变自动调整 menuCollapse
*/ * 避免已是小窗且打开了菜单栏时，意外的自动关闭菜单栏
if (!state.autoMenuCollapseLock) { */
state.autoMenuCollapseLock = true if (!state.autoMenuCollapseLock) {
config.setLayout('menuCollapse', true) state.autoMenuCollapseLock = true
} config.setLayout('menuCollapse', true)
config.setLayout('shrink', true) }
config.setLayoutMode('Classic') config.setLayout('shrink', true)
} else { config.setLayoutMode('Classic')
state.autoMenuCollapseLock = false } else {
config.setLayout('menuCollapse', defaultBeforeResizeLayout.menuCollapse) state.autoMenuCollapseLock = false
config.setLayout('shrink', false) config.setLayout('menuCollapse', defaultBeforeResizeLayout.menuCollapse)
config.setLayoutMode(defaultBeforeResizeLayout.layoutMode) config.setLayout('shrink', false)
} config.setLayoutMode(defaultBeforeResizeLayout.layoutMode)
} }
</script> }
</script>

2
src/utils/router.ts
View File

@@ -10,7 +10,7 @@ import { compact, isEmpty, reverse } from 'lodash-es'
import { isAdminApp } from '@/utils/common' import { isAdminApp } from '@/utils/common'
import { getRouteMenu, dictDataCache } from '@/api/auth' import { getRouteMenu, dictDataCache } from '@/api/auth'
import { adminBaseRoutePath } from '@/router/static' import { adminBaseRoutePath } from '@/router/static'
const route = useRouter() const route:any = useRouter()
/** /**
* 导航失败有错误消息的路由push * 导航失败有错误消息的路由push
* @param to — 导航位置，同 router.push * @param to — 导航位置，同 router.push

191
src/views/govern/reportForms/bind.vue
View File

@@ -1,76 +1,115 @@
<template> <template>
<el-tabs v-model.trim="activeName" class="demo-tabs"> <el-tabs v-model.trim="activeName" class="demo-tabs">
<el-tab-pane label="数据单位" name="0"> <el-tab-pane label="数据单位" name="0">
绑定数据单位: 绑定数据单位:
<el-cascader :popper-append-to-body="false" ref="cascaderUnit" placeholder="请选择数据单位" v-model.trim="value" <el-cascader
:options="options1" filterable @change="handleChange" :props="{ :popper-append-to-body="false"
value: 'code', ref="cascaderUnit"
label: 'name' placeholder="请选择数据单位"
}"></el-cascader> v-model.trim="value"
</el-tab-pane> :options="options1"
<el-tab-pane label="数据指标" name="1"> filterable
绑定数据指标: @change="handleChange"
<el-cascader :popper-append-to-body="false" ref="cascaderUnit" placeholder="请选择数据指标" v-model.trim="value" :props="{
:options="options2" filterable @change="handleChange" :props="{ value: 'code',
value: 'name', label: 'name'
label: 'showName' }"
}"></el-cascader> ></el-cascader>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="合格率判定" name="2"> <el-tab-pane label="数据指标" name="1">
绑定合格率判定: <div class="mb10" style="text-align: end;">
<el-cascader :popper-append-to-body="false" ref="cascaderhgl" placeholder="请选择数据合格率" v-model.trim="value" <el-radio-group v-model="frontAndBack">
:options="options3" filterable @change="handleChange" :props="{ <el-radio-button label="治理前" :value="0" />
value: 'name', <el-radio-button label="治理后" :value="1" />
label: 'showName' </el-radio-group>
}"></el-cascader> </div>
</el-tab-pane> <div>
<el-tab-pane label="监测点台账指标" name="3"> 绑定数据指标:
绑定数据指标: <el-cascader
<el-cascader :popper-append-to-body="false" ref="cascaderjcd" placeholder="请选择监测点台账" v-model.trim="value" :popper-append-to-body="false"
:options="options4" filterable @change="handleChange" :props="{ ref="cascaderUnit"
value: 'name', placeholder="请选择数据指标"
label: 'showName' v-model.trim="value"
}"></el-cascader> :options="options2"
</el-tab-pane> filterable
</el-tabs> @change="handleChange"
</template> :props="{
<script setup lang="ts"> value: 'name',
import { ref, onMounted } from 'vue' label: 'showName'
import { codeDicTree } from '@/api/system-boot/dictTree' }"
import { targetLimitChooseTree, getIndex, terminalChooseTree } from '@/api/harmonic-boot/luckyexcel' ></el-cascader>
const emit = defineEmits(['setValue']) </div>
</el-tab-pane>
const activeName = ref('0') <el-tab-pane label="合格率判定" name="2">
const value = ref([]) 绑定合格率判定:
<el-cascader
const options1 = ref([]) :popper-append-to-body="false"
const options2 = ref([]) ref="cascaderhgl"
const options3 = ref([]) placeholder="请选择数据合格率"
const options4: any = ref([]) v-model.trim="value"
:options="options3"
const handleChange = (e: any) => { filterable
value.value = [] @change="handleChange"
:props="{
emit('setValue', e) value: 'name',
} label: 'showName'
}"
codeDicTree({ code: 'Device_Unit' }).then(res => { ></el-cascader>
options1.value = res.data </el-tab-pane>
}) <el-tab-pane label="监测点台账指标" name="3">
getIndex().then(res => { 绑定数据指标:
options2.value = res.data <el-cascader
}) :popper-append-to-body="false"
targetLimitChooseTree().then(res => { ref="cascaderjcd"
options3.value = res.data placeholder="请选择监测点台账"
}) v-model.trim="value"
terminalChooseTree().then(res => { :options="options4"
options4.value = res.data filterable
}) @change="handleChange"
:props="{
onMounted(() => { }) value: 'name',
</script> label: 'showName'
<style lang="scss" scoped> }"
:deep(.el-tab-pane) { ></el-cascader>
padding: 10px; </el-tab-pane>
} </el-tabs>
</style> </template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { codeDicTree } from '@/api/system-boot/dictTree'
import { targetLimitChooseTree, getIndex, terminalChooseTree } from '@/api/harmonic-boot/luckyexcel'
const emit = defineEmits(['setValue'])
const activeName = ref('0')
const value = ref([])
const options1 = ref([])
const options2 = ref([])
const options3 = ref([])
const options4: any = ref([])
const frontAndBack = ref(0)
const handleChange = (e: any) => {
value.value = []
emit('setValue', e, activeName.value == '1' ? frontAndBack.value : 0)
}
codeDicTree({ code: 'Device_Unit' }).then(res => {
options1.value = res.data
})
getIndex().then(res => {
options2.value = res.data
})
targetLimitChooseTree().then(res => {
options3.value = res.data
})
terminalChooseTree().then(res => {
options4.value = res.data
})
onMounted(() => {})
</script>
<style lang="scss" scoped>
:deep(.el-tab-pane) {
padding: 10px;
}
</style>

214
src/views/govern/reportForms/form.vue
View File

@@ -1,107 +1,107 @@
<template> <template>
<el-dialog draggable :title="title" v-model.trim="formVisible" width="30%" :before-close="closeDialog"> <el-dialog draggable :title="title" v-model.trim="formVisible" width="30%" :before-close="closeDialog">
<el-form :model="formdata" label-width="100px" :rules="rules" ref="ruleForm"> <el-form :model="formdata" label-width="100px" :rules="rules" ref="ruleForm">
<el-form-item label="模板名称:" prop="name"> <el-form-item label="模板名称:" prop="name">
<el-input maxlength="32" show-word-limit placeholder="模板名称" v-model.trim="formdata.name" <el-input maxlength="32" show-word-limit placeholder="模板名称" v-model.trim="formdata.name"
style="width: 100%"></el-input> style="width: 100%"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="部门:" prop="deptId"> <!-- <el-form-item label="部门:" prop="deptId">
<Area v-model.trim="formdata.deptId" style="width: 100%" collapse-tags <Area v-model.trim="formdata.deptId" style="width: 100%" collapse-tags
:props="{ multiple: true, label: 'name', value: 'id', emitPath: false }" /> :props="{ multiple: true, label: 'name', value: 'id', emitPath: false }" />
</el-form-item> </el-form-item> -->
<el-form-item label="模板类型:" prop="reportType"> <el-form-item label="模板类型:" prop="reportType">
<el-select style="width: 100%" v-model.trim="formdata.reportType" placeholder="请选择模板类型"> <el-select style="width: 100%" v-model.trim="formdata.reportType" placeholder="请选择模板类型">
<el-option v-for="item in classificationData" :key="item.id" :label="item.label" <el-option v-for="item in classificationData" :key="item.id" :label="item.label"
:value="item.id"></el-option> :value="item.id"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="报表类型:" prop="reportForm"> <el-form-item label="报表类型:" prop="reportForm">
<el-select style="width: 100%" v-model.trim="formdata.reportForm" placeholder="请选择报表类型"> <el-select style="width: 100%" v-model.trim="formdata.reportForm" placeholder="请选择报表类型">
<el-option v-for="item in reportFormList" :key="item.value" :label="item.label" <el-option v-for="item in reportFormList" :key="item.value" :label="item.label"
:value="item.value"></el-option> :value="item.value"></el-option>
</el-select> </el-select>
</el-form-item> </el-form-item>
</el-form> </el-form>
<template #footer> <template #footer>
<el-button @click="closeDialog">取 消</el-button> <el-button @click="closeDialog">取 消</el-button>
<el-button type="primary" @click="preservation">确 定</el-button> <el-button type="primary" @click="preservation">确 定</el-button>
</template> </template>
</el-dialog> </el-dialog>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import Area from '@/components/form/area/index.vue' import Area from '@/components/form/area/index.vue'
import { getCustomReportTemplateById } from '@/api/harmonic-boot/luckyexcel' import { getCustomReportTemplateById } from '@/api/harmonic-boot/luckyexcel'
import { ref, reactive } from 'vue' import { ref, reactive } from 'vue'
const emit = defineEmits(['submitForm']) const emit = defineEmits(['submitForm'])
const title = ref('') const title = ref('')
const list = ref({}) const list = ref({})
const ruleForm = ref() const ruleForm = ref()
const formVisible = ref(false) const formVisible = ref(false)
const classificationData = [ const classificationData = [
{ {
label: '电能质量报表类型', label: '电能质量报表类型',
id: '1' id: '1'
}, },
{ {
label: '用能报表类型', label: '用能报表类型',
id: '2' id: '2'
} }
] ]
const reportFormList = [ const reportFormList = [
{ {
value: '1', value: '1',
label: '分析报表' label: '分析报表'
}, },
{ {
value: '2', value: '2',
label: '统计报表' label: '统计报表'
}, },
{ {
value: '3', value: '3',
label: '自定义报表' label: '自定义报表'
} }
] ]
const rules = { const rules = {
name: [{ required: true, message: '请输入模板名称', trigger: 'blur' }], name: [{ required: true, message: '请输入模板名称', trigger: 'blur' }],
deptId: [{ required: true, message: '请选择部门', trigger: 'change' }], deptId: [{ required: true, message: '请选择部门', trigger: 'change' }],
reportType: [{ required: true, message: '请选择模板类型', trigger: 'change' }], reportType: [{ required: true, message: '请选择模板类型', trigger: 'change' }],
reportForm: [{ required: true, message: '请选择报表类型', trigger: 'change' }] reportForm: [{ required: true, message: '请选择报表类型', trigger: 'change' }]
} }
const formdata = ref({ const formdata = ref({
name: '', name: '',
deptId: [], deptId: [],
reportType: '', reportType: '',
reportForm: '' reportForm: ''
}) })
// 确定 // 确定
const preservation = () => { const preservation = () => {
ruleForm.value.validate((valid: boolean) => { ruleForm.value.validate((valid: boolean) => {
if (valid) { if (valid) {
emit('submitForm', formdata.value, title.value) emit('submitForm', formdata.value, title.value)
} }
}) })
} }
const shutDown = () => { const shutDown = () => {
formVisible.value = false formVisible.value = false
} }
// 关闭 // 关闭
const closeDialog = () => { const closeDialog = () => {
formVisible.value = false formVisible.value = false
} }
const open = (text: string, row?: any) => { const open = (text: string, row?: any) => {
title.value = text title.value = text
if (row.id) { if (row.id) {
getCustomReportTemplateById({ id: row.id }).then(res => { getCustomReportTemplateById({ id: row.id }).then(res => {
formdata.value = res.data formdata.value = res.data
formdata.value.deptId = res.data.valueTitle.split(',') formdata.value.deptId = res.data.valueTitle.split(',')
}) })
} }
formVisible.value = true formVisible.value = true
} }
defineExpose({ open,shutDown }) defineExpose({ open,shutDown })
</script> </script>
<style lang="scss" scoped></style> <style lang="scss" scoped></style>

270
src/views/govern/reportForms/index.vue
View File

@@ -1,135 +1,135 @@
<template> <template>
<div class="default-main"> <div class="default-main">
<div v-show="show && lookShow"> <div v-show="show && lookShow">
<TableHeader ref="TableHeaderRef"> <TableHeader ref="TableHeaderRef">
<template #operation> <template #operation>
<el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button> <el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
</template> </template>
</TableHeader> </TableHeader>
<Table ref="tableRef" /> <Table ref="tableRef" />
</div> </div>
<luckysheet ref="luckysheetRef" v-if="!show" @shutDown="shutDown" /> <luckysheet ref="luckysheetRef" v-if="!show" @shutDown="shutDown" />
<!-- 查看 --> <!-- 查看 -->
<look ref="lookRef" v-if="!lookShow" @shutDown="shutDown" /> <look ref="lookRef" v-if="!lookShow" @shutDown="shutDown" />
<!-- 绑定 --> <!-- 绑定 -->
<department ref="departmentRef" /> <department ref="departmentRef" />
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, provide, nextTick } from 'vue' import { ref, onMounted, provide, nextTick } from 'vue'
import TableStore from '@/utils/tableStore' import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue' import Table from '@/components/table/index.vue'
import TableHeader from '@/components/table/header/index.vue' import TableHeader from '@/components/table/header/index.vue'
import { delTemplate } from '@/api/harmonic-boot/luckyexcel' import { delTemplate } from '@/api/harmonic-boot/luckyexcel'
import { useDictData } from '@/stores/dictData' import { useDictData } from '@/stores/dictData'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import luckysheet from './luckysheet.vue' import luckysheet from './luckysheet.vue'
import look from './look.vue' import look from './look.vue'
import department from './department.vue' import department from './department.vue'
defineOptions({ defineOptions({
name: 'govern/reportForms/index' name: 'govern/reportForms/index'
}) })
const luckysheetRef = ref() const luckysheetRef = ref()
const lookRef = ref() const lookRef = ref()
const departmentRef = ref() const departmentRef = ref()
const show = ref(true) const show = ref(true)
const lookShow = ref(true) const lookShow = ref(true)
const tableStore: any = new TableStore({ const tableStore: any = new TableStore({
url: '/harmonic-boot/customReport/getTemplateList', url: '/harmonic-boot/customReport/getTemplateList',
method: 'POST', method: 'POST',
isWebPaging: true, isWebPaging: true,
column: [ column: [
{ field: 'name', title: '模板名称' }, { field: 'name', title: '模板名称' },
{ field: 'reportForm', title: '模板类型',formatter: (row) => { { field: 'reportForm', title: '模板类型',formatter: (row) => {
return row.cellValue == 1 ? '电能质量报表类型' : row.cellValue == 2 ? '用能报表类型' : '' return row.cellValue == 1 ? '电能质量报表类型' : row.cellValue == 2 ? '用能报表类型' : ''
} }, } },
{ field: 'updateBy', title: '更新用户' }, { field: 'updateBy', title: '更新用户' },
{ field: 'createTime', title: '创建时间' , sortable: true}, { field: 'createTime', title: '创建时间' , sortable: true},
{ field: 'updateTime', title: '更新时间', sortable: true }, { field: 'updateTime', title: '更新时间', sortable: true },
{ {
title: '操作', title: '操作',
width: '220', width: '220',
render: 'buttons', render: 'buttons',
buttons: [ buttons: [
{ {
name: 'edit', name: 'edit',
title: '查看 ', title: '查看 ',
type: 'primary', type: 'primary',
icon: 'el-icon-Plus', icon: 'el-icon-Plus',
render: 'basicButton', render: 'basicButton',
click: row => { click: row => {
lookShow.value = false lookShow.value = false
setTimeout(() => { setTimeout(() => {
lookRef.value.open(row) lookRef.value.open(row)
}, 10) }, 10)
} }
}, },
{ {
name: 'edit', name: 'edit',
title: '编辑', title: '编辑',
type: 'primary', type: 'primary',
icon: 'el-icon-Plus', icon: 'el-icon-Plus',
render: 'basicButton', render: 'basicButton',
click: row => { click: row => {
show.value = false show.value = false
setTimeout(() => { setTimeout(() => {
luckysheetRef.value.open('编辑报表模板', row) luckysheetRef.value.open('编辑报表模板', row)
}, 10) }, 10)
} }
}, },
// { // {
// name: 'edit', // name: 'edit',
// title: '绑定', // title: '绑定',
// type: 'primary', // type: 'primary',
// icon: 'el-icon-Plus', // icon: 'el-icon-Plus',
// render: 'basicButton', // render: 'basicButton',
// click: row => { // click: row => {
// departmentRef.value.open(row) // departmentRef.value.open(row)
// } // }
// }, // },
{ {
name: 'del', name: 'del',
text: '删除', text: '删除',
type: 'danger', type: 'danger',
icon: 'el-icon-Delete', icon: 'el-icon-Delete',
render: 'confirmButton', render: 'confirmButton',
popconfirm: { popconfirm: {
confirmButtonText: '确认', confirmButtonText: '确认',
cancelButtonText: '取消', cancelButtonText: '取消',
confirmButtonType: 'danger', confirmButtonType: 'danger',
title: '确定删除？' title: '确定删除？'
}, },
click: row => { click: row => {
delTemplate({ tempId: row.id, deptId: row.deptId }).then(res => { delTemplate({ tempId: row.id, deptId: row.deptId }).then(res => {
ElMessage.success('删除成功') ElMessage.success('删除成功')
tableStore.index() tableStore.index()
}) })
} }
} }
] ]
} }
], ],
loadCallback: () => {} loadCallback: () => {}
}) })
tableStore.table.params = {} tableStore.table.params = {}
tableStore.table.params.pageSize = 20 tableStore.table.params.pageSize = 20
tableStore.table.params.pageNum = 1 tableStore.table.params.pageNum = 1
provide('tableStore', tableStore) provide('tableStore', tableStore)
// 关闭 // 关闭
const shutDown = () => { const shutDown = () => {
show.value = true show.value = true
lookShow.value = true lookShow.value = true
tableStore.index() tableStore.index()
} }
const add = () => { const add = () => {
show.value = false show.value = false
setTimeout(() => { setTimeout(() => {
luckysheetRef.value.open('新增报表模板') luckysheetRef.value.open('新增报表模板')
}, 10) }, 10)
} }
onMounted(() => { onMounted(() => {
tableStore.index() tableStore.index()
}) })
</script> </script>

52
src/views/govern/reportForms/luckysheet.vue
View File

@@ -1,8 +1,14 @@
<template> <template>
<div class="default-main"> <div class="default-main">
<div class="mb10" style="display: flex; justify-content: flex-end"> <div class="mb10" style="display: flex; justify-content: flex-end">
<el-upload ref="upload" action="" :auto-upload="false" :show-file-list="false" :limit="1" <el-upload
:on-change="beforeUpload"> ref="upload"
action=""
:auto-upload="false"
:show-file-list="false"
:limit="1"
:on-change="beforeUpload"
>
<el-button icon="el-icon-Upload" type="primary" class="mr10">导入excel</el-button> <el-button icon="el-icon-Upload" type="primary" class="mr10">导入excel</el-button>
</el-upload> </el-upload>
<el-button @click="downloadExcel" class="" type="primary" icon="el-icon-Download">导出excel</el-button> <el-button @click="downloadExcel" class="" type="primary" icon="el-icon-Download">导出excel</el-button>
@@ -54,13 +60,13 @@ const info = () => {
luckysheet.create(options.value) luckysheet.create(options.value)
} }
//绑定value //绑定value
const setValue = (e: any) => { const setValue = (e: any, frontAndBack: number) => {
let data = luckysheet.getRange() let data = luckysheet.getRange()
luckysheet.setCellValue( luckysheet.setCellValue(
data[0].row[0], data[0].row[0],
data[0].column[0], data[0].column[0],
{ {
v: e[e.length - 1], v: frontAndBack == 0 ? e[e.length - 1] : `~` + e[e.length - 1],
tr: e tr: e
} }
// checkedNodes[0].data.label // checkedNodes[0].data.label
@@ -119,24 +125,28 @@ const submitForm = (formdata: any, text: string) => {
params.append('reportForm', formdata.reportForm) params.append('reportForm', formdata.reportForm)
ElMessage.info('正在保存请稍等!') ElMessage.info('正在保存请稍等!')
if (text == '新增报表模板') { if (text == '新增报表模板') {
addTemplate(params).then(res => { addTemplate(params)
ElMessage.success('新增成功!') .then(res => {
formFer.value.shutDown() ElMessage.success('新增成功!')
emit('shutDown') formFer.value.shutDown()
}).catch(err => { emit('shutDown')
ElMessage.error('保存失败!') })
formFer.value.shutDown() .catch(err => {
}) ElMessage.error('保存失败!')
formFer.value.shutDown()
})
} else if (text == '编辑报表模板') { } else if (text == '编辑报表模板') {
params.append('id', list.value.id) params.append('id', list.value.id)
dateTemplateup(params).then(res => { dateTemplateup(params)
ElMessage.success('编辑成功!') .then(res => {
formFer.value.shutDown() ElMessage.success('编辑成功!')
emit('shutDown') formFer.value.shutDown()
}).catch(err => { emit('shutDown')
ElMessage.error('保存失败!') })
formFer.value.shutDown() .catch(err => {
}) ElMessage.error('保存失败!')
formFer.value.shutDown()
})
} }
} }
const open = async (text: string, row?: any) => { const open = async (text: string, row?: any) => {
@@ -150,7 +160,7 @@ const open = async (text: string, row?: any) => {
info() info()
} }
defineExpose({ open }) defineExpose({ open })
onMounted(() => { }) onMounted(() => {})
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
:deep(.el-tab-pane) { :deep(.el-tab-pane) {

12
src/views/setting/dictionary/component/add.vue
View File

@@ -19,7 +19,7 @@
<el-form-item class="top" label="组件路径" prop="path"> <el-form-item class="top" label="组件路径" prop="path">
<el-input v-model="form.path" placeholder="请输入组件路径"></el-input> <el-input v-model="form.path" placeholder="请输入组件路径"></el-input>
</el-form-item> </el-form-item>
<el-form-item class="top" label="组件查询时间"> <!-- <el-form-item class="top" label="组件查询时间">
<el-radio-group v-model="form.timeKey" style="width: 100%"> <el-radio-group v-model="form.timeKey" style="width: 100%">
<el-radio-button label="年" value="1" /> <el-radio-button label="年" value="1" />
<el-radio-button label="季" value="2" /> <el-radio-button label="季" value="2" />
@@ -27,7 +27,7 @@
<el-radio-button label="周" value="4" /> <el-radio-button label="周" value="4" />
<el-radio-button label="日" value="5" /> <el-radio-button label="日" value="5" />
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item> -->
<el-form-item class="top" label="组件排序" prop="sort"> <el-form-item class="top" label="组件排序" prop="sort">
<el-input v-model="form.sort" placeholder="请输入组件排序"></el-input> <el-input v-model="form.sort" placeholder="请输入组件排序"></el-input>
</el-form-item> </el-form-item>
@@ -54,15 +54,13 @@ import { ref, inject, onMounted, type Component, defineAsyncComponent, h, markRa
import { reactive } from 'vue' import { reactive } from 'vue'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { useDictData } from '@/stores/dictData' import { useDictData } from '@/stores/dictData'
import TableStore from '@/utils/tableStore' // 若不是列表页面弹框可删除
import { getFatherComponent, componentAdd, componentEdit } from '@/api/user-boot/dept' import { getFatherComponent, componentAdd, componentEdit } from '@/api/user-boot/dept'
import IconSelector from '@/components/baInput/components/iconSelector.vue' import IconSelector from '@/components/baInput/components/iconSelector.vue'
import html2canvas from 'html2canvas' import html2canvas from 'html2canvas'
const emit = defineEmits(['cancel','submit'])
const dictData = useDictData() const dictData = useDictData()
const dialogVisible = ref(false) const dialogVisible = ref(false)
const title = ref('') const title = ref('')
const tableStore = inject('tableStore') as TableStore
const formRef = ref() const formRef = ref()
// 注意不要和表单ref的命名冲突 // 注意不要和表单ref的命名冲突
const form = ref<anyObj>({ const form = ref<anyObj>({
@@ -121,6 +119,7 @@ const submit = () => {
image: url image: url
}).then(res => { }).then(res => {
ElMessage.success('新增成功!') ElMessage.success('新增成功!')
emit('submit')
cancel() cancel()
}) })
} else { } else {
@@ -131,6 +130,7 @@ const submit = () => {
image: url image: url
}).then(res => { }).then(res => {
ElMessage.success('修改成功!') ElMessage.success('修改成功!')
emit('submit')
cancel() cancel()
}) })
} }
@@ -176,7 +176,7 @@ const registerComponent = (path: string): Component | string | null => {
} }
} }
const cancel = () => { const cancel = () => {
tableStore.index() emit('cancel')
dialogVisible.value = false dialogVisible.value = false
} }
defineExpose({ open }) defineExpose({ open })

139
src/views/setting/dictionary/component/addTree.vue Normal file
View File

@@ -0,0 +1,139 @@
<template>
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" width="500px" :title="title" @close="cancel">
<div style="display: flex">
<el-form :inline="false" :model="form" label-width="auto" :rules="rules" ref="formRef" style="flex: 1">
<el-form-item class="top" label="上级树">
<el-cascader
v-model="form.system"
:options="customDeptOption"
:props="props"
clearable
filterable
placeholder="请选择上级树"
style="width: 100%"
/>
</el-form-item>
<el-form-item class="top" label="树名称" prop="name">
<el-input v-model="form.name" placeholder="请输入组件名称"></el-input>
</el-form-item>
<el-form-item class="top" label="树排序" prop="sort">
<el-input v-model="form.sort" placeholder="请输入组件排序"></el-input>
</el-form-item>
</el-form>
</div>
<template #footer>
<span class="dialog-footer">
<el-button @click="cancel">取消</el-button>
<el-button type="primary" @click="submit">确认</el-button>
</span>
</template>
</el-dialog>
</template>
<script lang="ts" setup>
import { ref, inject, onMounted, type Component, defineAsyncComponent, h, markRaw } from 'vue'
import { reactive } from 'vue'
import { ElMessage } from 'element-plus'
import { useDictData } from '@/stores/dictData'
import { getFatherComponent, componentAdd, componentEdit } from '@/api/user-boot/dept'
import { componentTree } from '@/api/user-boot/user'
const dictData = useDictData()
const emit = defineEmits(['cancel', 'submit'])
const dialogVisible = ref(false)
const title = ref('')
const formRef = ref()
// 注意不要和表单ref的命名冲突
const form = ref<anyObj>({
name: '',
sort: 100,
system: ''
})
const props = { label: 'name', value: 'id', checkStrictly: true }
const rules = {
name: [{ required: true, message: '请输输入树名称', trigger: 'blur' }],
system: [{ required: true, message: '请先择父组件节点', trigger: 'change' }],
sort: [{ required: true, message: '请输入排序', trigger: 'blur' }]
}
const customDeptOption: any = ref([])
onMounted(() => {})
const open = (text: string, data?: anyObj) => {
getFather()
title.value = text
dialogVisible.value = true
if (data) {
let Data = JSON.parse(JSON.stringify(data))
form.value.system = Data.systemType
form.value.name = Data.name
form.value.sort = Data.sort
}
}
// 查询父节点
const getFather = () => {
componentTree().then(res => {
customDeptOption.value = deletePathNotNull(JSON.parse(JSON.stringify(res.data)))
})
}
// 递归删除path不为null的数据
function deletePathNotNull(data:any) {
// 若为数组，遍历处理每个元素
if (Array.isArray(data)) {
const filtered = []
for (let item of data) {
// 递归处理子节点
if (item.children && item.children.length > 0) {
item.children = deletePathNotNull(item.children)
}
// 仅保留path为null或空字符串的节点
if (item.path === null || item.path === '') {
filtered.push(item)
}
}
return filtered
}
// 若为单个对象（递归子节点时用）
if (typeof data === 'object' && data !== null) {
if (data.children && data.children.length > 0) {
data.children = deletePathNotNull(data.children)
}
return data.path === null || data.path === '' ? data : null
}
return data
}
const submit = () => {
formRef.value.validate(async (valid: boolean) => {
if (valid) {
if (title.value == '新增树') {
await componentAdd({
...form.value,
systemType: form.value.system[0],
pid: form.value.system[1]
}).then(res => {
ElMessage.success('新增成功!')
emit('submit')
cancel()
})
} else {
await componentEdit({
...form.value,
systemType: form.value.system[0],
pid: form.value.system[1]
}).then(res => {
ElMessage.success('修改成功!')
emit('submit')
cancel()
})
}
}
})
}
const cancel = () => {
emit('cancel')
dialogVisible.value = false
}
defineExpose({ open })
</script>

58
src/views/setting/dictionary/component/index.vue
View File

@@ -2,22 +2,29 @@
<div class="default-main"> <div class="default-main">
<TableHeader :showSearch="false"> <TableHeader :showSearch="false">
<template v-slot:operation> <template v-slot:operation>
<el-button type="primary" @click="add" icon="el-icon-Plus">新增</el-button> <el-button type="primary" @click="addTree" icon="el-icon-Plus">新增树</el-button>
<el-button type="primary" @click="add" icon="el-icon-Plus">新增组件</el-button>
</template> </template>
</TableHeader> </TableHeader>
<Table ref="tableRef" :tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }" <Table
:scroll-y="{ enabled: true }" /> ref="tableRef"
<Add ref="addRef" v-if="addFlag" @onSubmit="tableStore.index()" /> :tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
:scroll-y="{ enabled: true }"
/>
<Add ref="addRef" v-if="addFlag" @cancel="cancel" @submit="tableStore.index()" />
<!-- 新增树 -->
<Tree ref="treeRef" v-if="addFlag" @cancel="cancel" @submit="tableStore.index()" />
</div> </div>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, provide,nextTick } from 'vue' import { ref, onMounted, provide, nextTick } from 'vue'
import TableStore from '@/utils/tableStore' import TableStore from '@/utils/tableStore'
import Table from '@/components/table/index.vue' import Table from '@/components/table/index.vue'
import { useDictData } from '@/stores/dictData' import { useDictData } from '@/stores/dictData'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import TableHeader from '@/components/table/header/index.vue' import TableHeader from '@/components/table/header/index.vue'
import Add from './add.vue' import Add from './add.vue'
import Tree from './addTree.vue'
import { deleteSubassembly } from '@/api/user-boot/dept' import { deleteSubassembly } from '@/api/user-boot/dept'
defineOptions({ defineOptions({
name: 'component' name: 'component'
@@ -25,6 +32,7 @@ defineOptions({
const addRef = ref() const addRef = ref()
const addFlag = ref(false) const addFlag = ref(false)
const tableRef = ref() const tableRef = ref()
const treeRef = ref()
const treeData: any = ref([]) const treeData: any = ref([])
const tableStore = new TableStore({ const tableStore = new TableStore({
url: '/user-boot/component/componentTree', url: '/user-boot/component/componentTree',
@@ -39,7 +47,7 @@ const tableStore = new TableStore({
width: '80', width: '80',
render: 'icon' render: 'icon'
}, },
{ field: 'code', title: '组件标识', minWidth: '100', }, { field: 'code', title: '组件标识', minWidth: '100' },
{ field: 'path', title: '组件路径' }, { field: 'path', title: '组件路径' },
{ field: 'image', title: '组件展示', render: 'image' }, { field: 'image', title: '组件展示', render: 'image' },
{ {
@@ -53,13 +61,18 @@ const tableStore = new TableStore({
type: 'primary', type: 'primary',
icon: 'el-icon-Plus', icon: 'el-icon-Plus',
render: 'basicButton', render: 'basicButton',
disabled: row => {
return row.path == '' || row.path == null
},
click: row => { click: row => {
addFlag.value = true addFlag.value = true
setTimeout(() => { setTimeout(() => {
addRef.value.open('修改组件', row) if (row.path == '' || row.path == null) {
// 修改树
treeRef.value.open('修改树', row)
} else {
// 组件修改
addRef.value.open('修改组件', row)
}
}, 100) }, 100)
} }
}, },
@@ -69,9 +82,7 @@ const tableStore = new TableStore({
type: 'danger', type: 'danger',
icon: 'el-icon-Delete', icon: 'el-icon-Delete',
render: 'confirmButton', render: 'confirmButton',
disabled: row => {
return row.path == '' || row.path == null
},
popconfirm: { popconfirm: {
confirmButtonText: '确认', confirmButtonText: '确认',
cancelButtonText: '取消', cancelButtonText: '取消',
@@ -79,10 +90,13 @@ const tableStore = new TableStore({
title: '确定删除？' title: '确定删除？'
}, },
click: row => { click: row => {
deleteSubassembly({ id: row.id }).then(() => { if (row.path == '' || row.path == null) {
ElMessage.success('删除成功!') } else {
tableStore.index() deleteSubassembly({ id: row.id }).then(() => {
}) ElMessage.success('删除成功!')
tableStore.index()
})
}
} }
} }
] ]
@@ -127,6 +141,16 @@ const add = () => {
addRef.value.open('新增组件') addRef.value.open('新增组件')
}, 100) }, 100)
} }
// 新增数
const addTree = () => {
addFlag.value = true
setTimeout(() => {
treeRef.value.open('新增树')
}, 100)
}
const cancel = () => {
addFlag.value = false
}
provide('tableStore', tableStore) provide('tableStore', tableStore)
onMounted(() => { onMounted(() => {
tableStore.index() tableStore.index()

168
src/views/setting/dictionary/tree/popupForm.vue
View File

@@ -1,84 +1,84 @@
<template> <template>
<el-dialog class="cn-operate-dialog" v-model.trim="dialogVisible" :title="title"> <el-dialog class="cn-operate-dialog" width="500px" v-model.trim="dialogVisible" :title="title">
<el-scrollbar> <el-scrollbar>
<el-form :inline="false" :model="form" label-width="120px" :rules="rules"> <el-form :inline="false" :model="form" label-width="120px" :rules="rules">
<el-form-item label="字典名称:" prop="name"> <el-form-item label="字典名称:" prop="name">
<el-input maxlength="32" show-word-limit v-model.trim="form.name" placeholder="请输入字典名称"></el-input> <el-input maxlength="32" show-word-limit v-model.trim="form.name" placeholder="请输入字典名称"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="序号:" prop="sort" class="top"> <el-form-item label="序号:" prop="sort" class="top">
<el-input maxlength="32" show-word-limit v-model.trim="form.sort" placeholder="请输入序号"></el-input> <el-input maxlength="32" show-word-limit v-model.trim="form.sort" placeholder="请输入序号"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="编码:" prop="code" class="top"> <el-form-item label="编码:" prop="code" class="top">
<el-input maxlength="32" show-word-limit v-model.trim="form.code" placeholder="请输入字典编码"></el-input> <el-input maxlength="32" show-word-limit v-model.trim="form.code" placeholder="请输入字典编码"></el-input>
</el-form-item> </el-form-item>
<el-form-item label="描述:" class="top"> <el-form-item label="描述:" class="top">
<el-input maxlength="32" :autosize="{ minRows: 2, maxRows: 4 }" type="textarea" show-word-limit v-model.trim="form.remark" <el-input maxlength="32" :autosize="{ minRows: 2, maxRows: 4 }" type="textarea" show-word-limit v-model.trim="form.remark"
placeholder="请输入字典描述"></el-input> placeholder="请输入字典描述"></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
</el-scrollbar> </el-scrollbar>
<template #footer> <template #footer>
<span class="dialog-footer"> <span class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button> <el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="submit">确认</el-button> <el-button type="primary" @click="submit">确认</el-button>
</span> </span>
</template> </template>
</el-dialog> </el-dialog>
</template> </template>
<script lang="ts" setup> <script lang="ts" setup>
import { ref, inject } from 'vue' import { ref, inject } from 'vue'
import { reactive } from 'vue' import { reactive } from 'vue'
import TableStore from '@/utils/tableStore' import TableStore from '@/utils/tableStore'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { useAdminInfo } from '@/stores/adminInfo' import { useAdminInfo } from '@/stores/adminInfo'
import { dicAdd, dicUpdate } from '@/api/system-boot/dic' import { dicAdd, dicUpdate } from '@/api/system-boot/dic'
const adminInfo = useAdminInfo() const adminInfo = useAdminInfo()
const tableStore = inject('tableStore') as TableStore const tableStore = inject('tableStore') as TableStore
// do not use same name with ref // do not use same name with ref
const form = reactive({ const form = reactive({
name: '', name: '',
code: '', code: '',
remark: '', remark: '',
sort: 100, sort: 100,
type: 0, type: 0,
pid: 0, pid: 0,
id: '' id: ''
}) })
const rules = { const rules = {
name: [{ required: true, message: '名称不能为空', trigger: 'blur' }], name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
sort: [{ required: true, message: '排序不能为空', trigger: 'blur' }], sort: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
code: [{ required: true, message: '编码不能为空', trigger: 'blur' }] code: [{ required: true, message: '编码不能为空', trigger: 'blur' }]
} }
const dialogVisible = ref(false) const dialogVisible = ref(false)
const title = ref('新增菜单') const title = ref('新增菜单')
const open = (text: string, data?: anyObj) => { const open = (text: string, data?: anyObj) => {
title.value = text title.value = text
dialogVisible.value = true dialogVisible.value = true
if (data) { if (data) {
for (let key in form) { for (let key in form) {
form[key] = data[key] form[key] = data[key]
} }
} else { } else {
for (let key in form) { for (let key in form) {
form[key] = '' form[key] = ''
} }
form.sort = 100 form.sort = 100
form.pid = 0 form.pid = 0
form.type = 0 form.type = 0
} }
} }
const submit = async () => { const submit = async () => {
if (form.id) { if (form.id) {
await dicUpdate(form) await dicUpdate(form)
} else { } else {
await dicAdd(form) await dicAdd(form)
} }
ElMessage.success('保存成功') ElMessage.success('保存成功')
tableStore.index() tableStore.index()
dialogVisible.value = false dialogVisible.value = false
} }
defineExpose({ open }) defineExpose({ open })
</script> </script>