Merge branch 'main' of http://192.168.1.22:3000/Web/admin-govern
This commit is contained in:
@@ -1,125 +1,126 @@
|
||||
<template>
|
||||
<component :is='config.layout.layoutMode'></component>
|
||||
</template>
|
||||
|
||||
<script setup lang='ts'>
|
||||
import { reactive } from 'vue'
|
||||
import { useConfig } from '@/stores/config'
|
||||
import { useNavTabs } from '@/stores/navTabs'
|
||||
import { useAdminInfo } from '@/stores/adminInfo'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { useRoute } from 'vue-router'
|
||||
import Default from '@/layouts/admin/container/default.vue'
|
||||
import Classic from '@/layouts/admin/container/classic.vue'
|
||||
import Streamline from '@/layouts/admin/container/streamline.vue'
|
||||
import Double from '@/layouts/admin/container/double.vue'
|
||||
import { onMounted, onBeforeMount } from 'vue'
|
||||
import { handleAdminRoute, getFirstRoute, routePush } from '@/utils/router'
|
||||
import router from '@/router/index'
|
||||
import { useEventListener } from '@vueuse/core'
|
||||
import { isEmpty } from 'lodash-es'
|
||||
import { setNavTabsWidth } from '@/utils/layout'
|
||||
import { adminBaseRoutePath } from '@/router/static'
|
||||
import { getRouteMenu, dictDataCache } from '@/api/auth'
|
||||
import { getAreaList, areaSelect } from '@/api/common'
|
||||
import { BasicDictData } from '@/stores/interface'
|
||||
import { getAllUserSimpleList, getUserById } from '@/api/user-boot/user'
|
||||
|
||||
defineOptions({
|
||||
components: { Default, Classic, Streamline, Double }
|
||||
})
|
||||
|
||||
const navTabs = useNavTabs()
|
||||
const config = useConfig()
|
||||
const route = useRoute()
|
||||
const adminInfo = useAdminInfo()
|
||||
const dictData = useDictData()
|
||||
const state = reactive({
|
||||
autoMenuCollapseLock: false
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
// if (!adminInfo.token) return router.push({ name: 'login' })
|
||||
|
||||
init()
|
||||
setNavTabsWidth()
|
||||
useEventListener(window, 'resize', setNavTabsWidth)
|
||||
})
|
||||
onBeforeMount(() => {
|
||||
onAdaptiveLayout()
|
||||
useEventListener(window, 'resize', onAdaptiveLayout)
|
||||
})
|
||||
|
||||
const init = async () => {
|
||||
await Promise.all([getAreaList(), dictDataCache(), getUserById(), areaSelect(),getAllUserSimpleList()]).then(res => {
|
||||
dictData.state.area = res[0].data
|
||||
dictData.state.basic = res[1].data
|
||||
// dictData.state.userList=res[4].data
|
||||
adminInfo.dataFill(res[2].data)
|
||||
// dictData.state.areaTree = res[3].data
|
||||
})
|
||||
/**
|
||||
* 后台初始化请求,获取站点配置,动态路由等信息
|
||||
*/
|
||||
getRouteMenu().then((res: any) => {
|
||||
const handlerMenu = (data: any) => {
|
||||
data.forEach((item: any) => {
|
||||
item.routePath =
|
||||
item.routePath[0] == '/' ? item.routePath.substring(1, item.routePath.length) : item.routePath
|
||||
item.path = item.routePath
|
||||
item.name = item.routePath
|
||||
item.keepalive = item.routePath
|
||||
item.component = item.routeName
|
||||
? item.routeName.indexOf('/src/views/') > -1
|
||||
? item.routeName
|
||||
: `/src/views/${item.routeName}/index.vue`
|
||||
: ''
|
||||
item.type = item.children && item.children.length > 0 ? 'menu_dir' : 'menu'
|
||||
item.menu_type = item.children && item.children.length > 0 ? null : 'tab'
|
||||
if (item.children) {
|
||||
handlerMenu(item.children)
|
||||
}
|
||||
})
|
||||
}
|
||||
handlerMenu(res.data)
|
||||
handleAdminRoute(res.data)
|
||||
if (route.params.to) {
|
||||
const lastRoute = JSON.parse(route.params.to as string)
|
||||
if (lastRoute.path != adminBaseRoutePath) {
|
||||
let query = !isEmpty(lastRoute.query) ? lastRoute.query : {}
|
||||
routePush({ path: lastRoute.path, query: query })
|
||||
return
|
||||
}
|
||||
}
|
||||
// 跳转到第一个菜单
|
||||
let firstRoute = getFirstRoute(navTabs.state.tabsViewRoutes)
|
||||
if (firstRoute) routePush(firstRoute.path)
|
||||
})
|
||||
}
|
||||
|
||||
const onAdaptiveLayout = () => {
|
||||
let defaultBeforeResizeLayout = {
|
||||
layoutMode: config.layout.layoutMode,
|
||||
menuCollapse: config.layout.menuCollapse
|
||||
}
|
||||
|
||||
const clientWidth = document.body.clientWidth
|
||||
if (clientWidth < 1024) {
|
||||
/**
|
||||
* 锁定窗口改变自动调整 menuCollapse
|
||||
* 避免已是小窗且打开了菜单栏时,意外的自动关闭菜单栏
|
||||
*/
|
||||
if (!state.autoMenuCollapseLock) {
|
||||
state.autoMenuCollapseLock = true
|
||||
config.setLayout('menuCollapse', true)
|
||||
}
|
||||
config.setLayout('shrink', true)
|
||||
config.setLayoutMode('Classic')
|
||||
} else {
|
||||
state.autoMenuCollapseLock = false
|
||||
config.setLayout('menuCollapse', defaultBeforeResizeLayout.menuCollapse)
|
||||
config.setLayout('shrink', false)
|
||||
config.setLayoutMode(defaultBeforeResizeLayout.layoutMode)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<template>
|
||||
<component :is='config.layout.layoutMode'></component>
|
||||
</template>
|
||||
|
||||
<script setup lang='ts'>
|
||||
import { reactive } from 'vue'
|
||||
import { useConfig } from '@/stores/config'
|
||||
import { useNavTabs } from '@/stores/navTabs'
|
||||
import { useAdminInfo } from '@/stores/adminInfo'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { useRoute } from 'vue-router'
|
||||
import Default from '@/layouts/admin/container/default.vue'
|
||||
import Classic from '@/layouts/admin/container/classic.vue'
|
||||
import Streamline from '@/layouts/admin/container/streamline.vue'
|
||||
import Double from '@/layouts/admin/container/double.vue'
|
||||
import { onMounted, onBeforeMount } from 'vue'
|
||||
import { handleAdminRoute, getFirstRoute, routePush } from '@/utils/router'
|
||||
import router from '@/router/index'
|
||||
import { useEventListener } from '@vueuse/core'
|
||||
import { isEmpty } from 'lodash-es'
|
||||
import { setNavTabsWidth } from '@/utils/layout'
|
||||
import { adminBaseRoutePath } from '@/router/static'
|
||||
import { getRouteMenu, dictDataCache } from '@/api/auth'
|
||||
import { getAreaList, areaSelect } from '@/api/common'
|
||||
import { BasicDictData } from '@/stores/interface'
|
||||
import { getAllUserSimpleList, getUserById } from '@/api/user-boot/user'
|
||||
|
||||
defineOptions({
|
||||
components: { Default, Classic, Streamline, Double }
|
||||
})
|
||||
|
||||
const navTabs = useNavTabs()
|
||||
const config = useConfig()
|
||||
const route = useRoute()
|
||||
const adminInfo = useAdminInfo()
|
||||
const dictData = useDictData()
|
||||
const state = reactive({
|
||||
autoMenuCollapseLock: false
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
// if (!adminInfo.token) return router.push({ name: 'login' })
|
||||
|
||||
init()
|
||||
setNavTabsWidth()
|
||||
useEventListener(window, 'resize', setNavTabsWidth)
|
||||
})
|
||||
onBeforeMount(() => {
|
||||
onAdaptiveLayout()
|
||||
useEventListener(window, 'resize', onAdaptiveLayout)
|
||||
})
|
||||
|
||||
const init = async () => {
|
||||
await Promise.all([getAreaList(), dictDataCache(), getUserById(), areaSelect(),getAllUserSimpleList()]).then(res => {
|
||||
dictData.state.area = res[0].data
|
||||
dictData.state.basic = res[1].data
|
||||
// dictData.state.userList=res[4].data
|
||||
adminInfo.dataFill(res[2].data)
|
||||
// dictData.state.areaTree = res[3].data
|
||||
})
|
||||
/**
|
||||
* 后台初始化请求,获取站点配置,动态路由等信息
|
||||
*/
|
||||
getRouteMenu().then((res: any) => {
|
||||
const handlerMenu = (data: any) => {
|
||||
data.forEach((item: any) => {
|
||||
item.routePath =
|
||||
item.routePath[0] == '/' ? item.routePath.substring(1, item.routePath.length) : item.routePath
|
||||
item.path = item.routePath
|
||||
item.name = item.routePath
|
||||
item.keepalive = item.routePath
|
||||
item.component = item.routeName
|
||||
? item.routeName.indexOf('/src/views/') > -1
|
||||
? item.routeName
|
||||
: `/src/views/${item.routeName}/index.vue`
|
||||
: ''
|
||||
item.type = item.children && item.children.length > 0 ? 'menu_dir' : 'menu'
|
||||
item.menu_type = item.children && item.children.length > 0 ? null : 'tab'
|
||||
if (item.children) {
|
||||
handlerMenu(item.children)
|
||||
}
|
||||
})
|
||||
}
|
||||
handlerMenu(res.data)
|
||||
handleAdminRoute(res.data)
|
||||
if (route.params.to) {
|
||||
const lastRoute = JSON.parse(route.params.to as string)
|
||||
|
||||
if (lastRoute.path != adminBaseRoutePath) {
|
||||
let query = !isEmpty(lastRoute.query) ? lastRoute.query : {}
|
||||
routePush({ path: lastRoute.path, query: query })
|
||||
return
|
||||
}
|
||||
}
|
||||
// 跳转到第一个菜单
|
||||
let firstRoute = getFirstRoute(navTabs.state.tabsViewRoutes)
|
||||
if (firstRoute) routePush(firstRoute.path)
|
||||
})
|
||||
}
|
||||
|
||||
const onAdaptiveLayout = () => {
|
||||
let defaultBeforeResizeLayout = {
|
||||
layoutMode: config.layout.layoutMode,
|
||||
menuCollapse: config.layout.menuCollapse
|
||||
}
|
||||
|
||||
const clientWidth = document.body.clientWidth
|
||||
if (clientWidth < 1024) {
|
||||
/**
|
||||
* 锁定窗口改变自动调整 menuCollapse
|
||||
* 避免已是小窗且打开了菜单栏时,意外的自动关闭菜单栏
|
||||
*/
|
||||
if (!state.autoMenuCollapseLock) {
|
||||
state.autoMenuCollapseLock = true
|
||||
config.setLayout('menuCollapse', true)
|
||||
}
|
||||
config.setLayout('shrink', true)
|
||||
config.setLayoutMode('Classic')
|
||||
} else {
|
||||
state.autoMenuCollapseLock = false
|
||||
config.setLayout('menuCollapse', defaultBeforeResizeLayout.menuCollapse)
|
||||
config.setLayout('shrink', false)
|
||||
config.setLayoutMode(defaultBeforeResizeLayout.layoutMode)
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
@@ -10,7 +10,7 @@ import { compact, isEmpty, reverse } from 'lodash-es'
|
||||
import { isAdminApp } from '@/utils/common'
|
||||
import { getRouteMenu, dictDataCache } from '@/api/auth'
|
||||
import { adminBaseRoutePath } from '@/router/static'
|
||||
const route = useRouter()
|
||||
const route:any = useRouter()
|
||||
/**
|
||||
* 导航失败有错误消息的路由push
|
||||
* @param to — 导航位置,同 router.push
|
||||
|
||||
@@ -1,76 +1,115 @@
|
||||
<template>
|
||||
<el-tabs v-model.trim="activeName" class="demo-tabs">
|
||||
<el-tab-pane label="数据单位" name="0">
|
||||
绑定数据单位:
|
||||
<el-cascader :popper-append-to-body="false" ref="cascaderUnit" placeholder="请选择数据单位" v-model.trim="value"
|
||||
:options="options1" filterable @change="handleChange" :props="{
|
||||
value: 'code',
|
||||
label: 'name'
|
||||
}"></el-cascader>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="数据指标" name="1">
|
||||
绑定数据指标:
|
||||
<el-cascader :popper-append-to-body="false" ref="cascaderUnit" placeholder="请选择数据指标" v-model.trim="value"
|
||||
:options="options2" filterable @change="handleChange" :props="{
|
||||
value: 'name',
|
||||
label: 'showName'
|
||||
}"></el-cascader>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="合格率判定" name="2">
|
||||
绑定合格率判定:
|
||||
<el-cascader :popper-append-to-body="false" ref="cascaderhgl" placeholder="请选择数据合格率" v-model.trim="value"
|
||||
:options="options3" filterable @change="handleChange" :props="{
|
||||
value: 'name',
|
||||
label: 'showName'
|
||||
}"></el-cascader>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="监测点台账指标" name="3">
|
||||
绑定数据指标:
|
||||
<el-cascader :popper-append-to-body="false" ref="cascaderjcd" placeholder="请选择监测点台账" v-model.trim="value"
|
||||
:options="options4" filterable @change="handleChange" :props="{
|
||||
value: 'name',
|
||||
label: 'showName'
|
||||
}"></el-cascader>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</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 handleChange = (e: any) => {
|
||||
value.value = []
|
||||
|
||||
emit('setValue', e)
|
||||
}
|
||||
|
||||
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>
|
||||
<template>
|
||||
<el-tabs v-model.trim="activeName" class="demo-tabs">
|
||||
<el-tab-pane label="数据单位" name="0">
|
||||
绑定数据单位:
|
||||
<el-cascader
|
||||
:popper-append-to-body="false"
|
||||
ref="cascaderUnit"
|
||||
placeholder="请选择数据单位"
|
||||
v-model.trim="value"
|
||||
:options="options1"
|
||||
filterable
|
||||
@change="handleChange"
|
||||
:props="{
|
||||
value: 'code',
|
||||
label: 'name'
|
||||
}"
|
||||
></el-cascader>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="数据指标" name="1">
|
||||
<div class="mb10" style="text-align: end;">
|
||||
<el-radio-group v-model="frontAndBack">
|
||||
<el-radio-button label="治理前" :value="0" />
|
||||
<el-radio-button label="治理后" :value="1" />
|
||||
</el-radio-group>
|
||||
</div>
|
||||
<div>
|
||||
绑定数据指标:
|
||||
<el-cascader
|
||||
:popper-append-to-body="false"
|
||||
ref="cascaderUnit"
|
||||
placeholder="请选择数据指标"
|
||||
v-model.trim="value"
|
||||
:options="options2"
|
||||
filterable
|
||||
@change="handleChange"
|
||||
:props="{
|
||||
value: 'name',
|
||||
label: 'showName'
|
||||
}"
|
||||
></el-cascader>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="合格率判定" name="2">
|
||||
绑定合格率判定:
|
||||
<el-cascader
|
||||
:popper-append-to-body="false"
|
||||
ref="cascaderhgl"
|
||||
placeholder="请选择数据合格率"
|
||||
v-model.trim="value"
|
||||
:options="options3"
|
||||
filterable
|
||||
@change="handleChange"
|
||||
:props="{
|
||||
value: 'name',
|
||||
label: 'showName'
|
||||
}"
|
||||
></el-cascader>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="监测点台账指标" name="3">
|
||||
绑定数据指标:
|
||||
<el-cascader
|
||||
:popper-append-to-body="false"
|
||||
ref="cascaderjcd"
|
||||
placeholder="请选择监测点台账"
|
||||
v-model.trim="value"
|
||||
:options="options4"
|
||||
filterable
|
||||
@change="handleChange"
|
||||
:props="{
|
||||
value: 'name',
|
||||
label: 'showName'
|
||||
}"
|
||||
></el-cascader>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</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>
|
||||
|
||||
@@ -1,107 +1,107 @@
|
||||
<template>
|
||||
<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-item label="模板名称:" prop="name">
|
||||
<el-input maxlength="32" show-word-limit placeholder="模板名称" v-model.trim="formdata.name"
|
||||
style="width: 100%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="部门:" prop="deptId">
|
||||
<Area v-model.trim="formdata.deptId" style="width: 100%" collapse-tags
|
||||
:props="{ multiple: true, label: 'name', value: 'id', emitPath: false }" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="模板类型:" prop="reportType">
|
||||
<el-select style="width: 100%" v-model.trim="formdata.reportType" placeholder="请选择模板类型">
|
||||
<el-option v-for="item in classificationData" :key="item.id" :label="item.label"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="报表类型:" prop="reportForm">
|
||||
<el-select style="width: 100%" v-model.trim="formdata.reportForm" placeholder="请选择报表类型">
|
||||
<el-option v-for="item in reportFormList" :key="item.value" :label="item.label"
|
||||
:value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="closeDialog">取 消</el-button>
|
||||
<el-button type="primary" @click="preservation">确 定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Area from '@/components/form/area/index.vue'
|
||||
import { getCustomReportTemplateById } from '@/api/harmonic-boot/luckyexcel'
|
||||
import { ref, reactive } from 'vue'
|
||||
const emit = defineEmits(['submitForm'])
|
||||
const title = ref('')
|
||||
const list = ref({})
|
||||
const ruleForm = ref()
|
||||
const formVisible = ref(false)
|
||||
const classificationData = [
|
||||
{
|
||||
label: '电能质量报表类型',
|
||||
id: '1'
|
||||
},
|
||||
{
|
||||
label: '用能报表类型',
|
||||
id: '2'
|
||||
}
|
||||
]
|
||||
const reportFormList = [
|
||||
{
|
||||
value: '1',
|
||||
label: '分析报表'
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '统计报表'
|
||||
},
|
||||
{
|
||||
value: '3',
|
||||
label: '自定义报表'
|
||||
}
|
||||
]
|
||||
const rules = {
|
||||
name: [{ required: true, message: '请输入模板名称', trigger: 'blur' }],
|
||||
deptId: [{ required: true, message: '请选择部门', trigger: 'change' }],
|
||||
reportType: [{ required: true, message: '请选择模板类型', trigger: 'change' }],
|
||||
reportForm: [{ required: true, message: '请选择报表类型', trigger: 'change' }]
|
||||
}
|
||||
const formdata = ref({
|
||||
name: '',
|
||||
deptId: [],
|
||||
reportType: '',
|
||||
reportForm: ''
|
||||
})
|
||||
// 确定
|
||||
const preservation = () => {
|
||||
ruleForm.value.validate((valid: boolean) => {
|
||||
if (valid) {
|
||||
emit('submitForm', formdata.value, title.value)
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
const shutDown = () => {
|
||||
formVisible.value = false
|
||||
}
|
||||
|
||||
// 关闭
|
||||
const closeDialog = () => {
|
||||
formVisible.value = false
|
||||
}
|
||||
const open = (text: string, row?: any) => {
|
||||
title.value = text
|
||||
if (row.id) {
|
||||
getCustomReportTemplateById({ id: row.id }).then(res => {
|
||||
formdata.value = res.data
|
||||
formdata.value.deptId = res.data.valueTitle.split(',')
|
||||
})
|
||||
}
|
||||
|
||||
formVisible.value = true
|
||||
}
|
||||
defineExpose({ open,shutDown })
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
<template>
|
||||
<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-item label="模板名称:" prop="name">
|
||||
<el-input maxlength="32" show-word-limit placeholder="模板名称" v-model.trim="formdata.name"
|
||||
style="width: 100%"></el-input>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item label="部门:" prop="deptId">
|
||||
<Area v-model.trim="formdata.deptId" style="width: 100%" collapse-tags
|
||||
:props="{ multiple: true, label: 'name', value: 'id', emitPath: false }" />
|
||||
</el-form-item> -->
|
||||
|
||||
<el-form-item label="模板类型:" prop="reportType">
|
||||
<el-select style="width: 100%" v-model.trim="formdata.reportType" placeholder="请选择模板类型">
|
||||
<el-option v-for="item in classificationData" :key="item.id" :label="item.label"
|
||||
:value="item.id"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="报表类型:" prop="reportForm">
|
||||
<el-select style="width: 100%" v-model.trim="formdata.reportForm" placeholder="请选择报表类型">
|
||||
<el-option v-for="item in reportFormList" :key="item.value" :label="item.label"
|
||||
:value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<el-button @click="closeDialog">取 消</el-button>
|
||||
<el-button type="primary" @click="preservation">确 定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import Area from '@/components/form/area/index.vue'
|
||||
import { getCustomReportTemplateById } from '@/api/harmonic-boot/luckyexcel'
|
||||
import { ref, reactive } from 'vue'
|
||||
const emit = defineEmits(['submitForm'])
|
||||
const title = ref('')
|
||||
const list = ref({})
|
||||
const ruleForm = ref()
|
||||
const formVisible = ref(false)
|
||||
const classificationData = [
|
||||
{
|
||||
label: '电能质量报表类型',
|
||||
id: '1'
|
||||
},
|
||||
{
|
||||
label: '用能报表类型',
|
||||
id: '2'
|
||||
}
|
||||
]
|
||||
const reportFormList = [
|
||||
{
|
||||
value: '1',
|
||||
label: '分析报表'
|
||||
},
|
||||
{
|
||||
value: '2',
|
||||
label: '统计报表'
|
||||
},
|
||||
{
|
||||
value: '3',
|
||||
label: '自定义报表'
|
||||
}
|
||||
]
|
||||
const rules = {
|
||||
name: [{ required: true, message: '请输入模板名称', trigger: 'blur' }],
|
||||
deptId: [{ required: true, message: '请选择部门', trigger: 'change' }],
|
||||
reportType: [{ required: true, message: '请选择模板类型', trigger: 'change' }],
|
||||
reportForm: [{ required: true, message: '请选择报表类型', trigger: 'change' }]
|
||||
}
|
||||
const formdata = ref({
|
||||
name: '',
|
||||
deptId: [],
|
||||
reportType: '',
|
||||
reportForm: ''
|
||||
})
|
||||
// 确定
|
||||
const preservation = () => {
|
||||
ruleForm.value.validate((valid: boolean) => {
|
||||
if (valid) {
|
||||
emit('submitForm', formdata.value, title.value)
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
const shutDown = () => {
|
||||
formVisible.value = false
|
||||
}
|
||||
|
||||
// 关闭
|
||||
const closeDialog = () => {
|
||||
formVisible.value = false
|
||||
}
|
||||
const open = (text: string, row?: any) => {
|
||||
title.value = text
|
||||
if (row.id) {
|
||||
getCustomReportTemplateById({ id: row.id }).then(res => {
|
||||
formdata.value = res.data
|
||||
formdata.value.deptId = res.data.valueTitle.split(',')
|
||||
})
|
||||
}
|
||||
|
||||
formVisible.value = true
|
||||
}
|
||||
defineExpose({ open,shutDown })
|
||||
</script>
|
||||
<style lang="scss" scoped></style>
|
||||
|
||||
@@ -1,135 +1,135 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<div v-show="show && lookShow">
|
||||
<TableHeader ref="TableHeaderRef">
|
||||
<template #operation>
|
||||
<el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<Table ref="tableRef" />
|
||||
</div>
|
||||
<luckysheet ref="luckysheetRef" v-if="!show" @shutDown="shutDown" />
|
||||
<!-- 查看 -->
|
||||
<look ref="lookRef" v-if="!lookShow" @shutDown="shutDown" />
|
||||
<!-- 绑定 -->
|
||||
<department ref="departmentRef" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, provide, nextTick } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { delTemplate } from '@/api/harmonic-boot/luckyexcel'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import luckysheet from './luckysheet.vue'
|
||||
import look from './look.vue'
|
||||
import department from './department.vue'
|
||||
defineOptions({
|
||||
name: 'govern/reportForms/index'
|
||||
})
|
||||
const luckysheetRef = ref()
|
||||
const lookRef = ref()
|
||||
const departmentRef = ref()
|
||||
const show = ref(true)
|
||||
const lookShow = ref(true)
|
||||
const tableStore: any = new TableStore({
|
||||
url: '/harmonic-boot/customReport/getTemplateList',
|
||||
method: 'POST',
|
||||
isWebPaging: true,
|
||||
column: [
|
||||
{ field: 'name', title: '模板名称' },
|
||||
{ field: 'reportForm', title: '模板类型',formatter: (row) => {
|
||||
return row.cellValue == 1 ? '电能质量报表类型' : row.cellValue == 2 ? '用能报表类型' : ''
|
||||
} },
|
||||
{ field: 'updateBy', title: '更新用户' },
|
||||
{ field: 'createTime', title: '创建时间' , sortable: true},
|
||||
{ field: 'updateTime', title: '更新时间', sortable: true },
|
||||
{
|
||||
title: '操作',
|
||||
width: '220',
|
||||
render: 'buttons',
|
||||
buttons: [
|
||||
{
|
||||
name: 'edit',
|
||||
title: '查看 ',
|
||||
type: 'primary',
|
||||
icon: 'el-icon-Plus',
|
||||
render: 'basicButton',
|
||||
click: row => {
|
||||
lookShow.value = false
|
||||
setTimeout(() => {
|
||||
lookRef.value.open(row)
|
||||
}, 10)
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'edit',
|
||||
title: '编辑',
|
||||
type: 'primary',
|
||||
icon: 'el-icon-Plus',
|
||||
render: 'basicButton',
|
||||
click: row => {
|
||||
show.value = false
|
||||
setTimeout(() => {
|
||||
luckysheetRef.value.open('编辑报表模板', row)
|
||||
}, 10)
|
||||
}
|
||||
},
|
||||
// {
|
||||
// name: 'edit',
|
||||
// title: '绑定',
|
||||
// type: 'primary',
|
||||
// icon: 'el-icon-Plus',
|
||||
// render: 'basicButton',
|
||||
// click: row => {
|
||||
// departmentRef.value.open(row)
|
||||
// }
|
||||
// },
|
||||
{
|
||||
name: 'del',
|
||||
text: '删除',
|
||||
type: 'danger',
|
||||
icon: 'el-icon-Delete',
|
||||
render: 'confirmButton',
|
||||
popconfirm: {
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
confirmButtonType: 'danger',
|
||||
title: '确定删除?'
|
||||
},
|
||||
click: row => {
|
||||
delTemplate({ tempId: row.id, deptId: row.deptId }).then(res => {
|
||||
ElMessage.success('删除成功')
|
||||
tableStore.index()
|
||||
})
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
|
||||
loadCallback: () => {}
|
||||
})
|
||||
tableStore.table.params = {}
|
||||
tableStore.table.params.pageSize = 20
|
||||
tableStore.table.params.pageNum = 1
|
||||
|
||||
provide('tableStore', tableStore)
|
||||
// 关闭
|
||||
const shutDown = () => {
|
||||
show.value = true
|
||||
lookShow.value = true
|
||||
tableStore.index()
|
||||
}
|
||||
const add = () => {
|
||||
show.value = false
|
||||
setTimeout(() => {
|
||||
luckysheetRef.value.open('新增报表模板')
|
||||
}, 10)
|
||||
}
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
</script>
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<div v-show="show && lookShow">
|
||||
<TableHeader ref="TableHeaderRef">
|
||||
<template #operation>
|
||||
<el-button icon="el-icon-Plus" type="primary" @click="add">新增</el-button>
|
||||
</template>
|
||||
</TableHeader>
|
||||
<Table ref="tableRef" />
|
||||
</div>
|
||||
<luckysheet ref="luckysheetRef" v-if="!show" @shutDown="shutDown" />
|
||||
<!-- 查看 -->
|
||||
<look ref="lookRef" v-if="!lookShow" @shutDown="shutDown" />
|
||||
<!-- 绑定 -->
|
||||
<department ref="departmentRef" />
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, provide, nextTick } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import { delTemplate } from '@/api/harmonic-boot/luckyexcel'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import luckysheet from './luckysheet.vue'
|
||||
import look from './look.vue'
|
||||
import department from './department.vue'
|
||||
defineOptions({
|
||||
name: 'govern/reportForms/index'
|
||||
})
|
||||
const luckysheetRef = ref()
|
||||
const lookRef = ref()
|
||||
const departmentRef = ref()
|
||||
const show = ref(true)
|
||||
const lookShow = ref(true)
|
||||
const tableStore: any = new TableStore({
|
||||
url: '/harmonic-boot/customReport/getTemplateList',
|
||||
method: 'POST',
|
||||
isWebPaging: true,
|
||||
column: [
|
||||
{ field: 'name', title: '模板名称' },
|
||||
{ field: 'reportForm', title: '模板类型',formatter: (row) => {
|
||||
return row.cellValue == 1 ? '电能质量报表类型' : row.cellValue == 2 ? '用能报表类型' : ''
|
||||
} },
|
||||
{ field: 'updateBy', title: '更新用户' },
|
||||
{ field: 'createTime', title: '创建时间' , sortable: true},
|
||||
{ field: 'updateTime', title: '更新时间', sortable: true },
|
||||
{
|
||||
title: '操作',
|
||||
width: '220',
|
||||
render: 'buttons',
|
||||
buttons: [
|
||||
{
|
||||
name: 'edit',
|
||||
title: '查看 ',
|
||||
type: 'primary',
|
||||
icon: 'el-icon-Plus',
|
||||
render: 'basicButton',
|
||||
click: row => {
|
||||
lookShow.value = false
|
||||
setTimeout(() => {
|
||||
lookRef.value.open(row)
|
||||
}, 10)
|
||||
}
|
||||
},
|
||||
{
|
||||
name: 'edit',
|
||||
title: '编辑',
|
||||
type: 'primary',
|
||||
icon: 'el-icon-Plus',
|
||||
render: 'basicButton',
|
||||
click: row => {
|
||||
show.value = false
|
||||
setTimeout(() => {
|
||||
luckysheetRef.value.open('编辑报表模板', row)
|
||||
}, 10)
|
||||
}
|
||||
},
|
||||
// {
|
||||
// name: 'edit',
|
||||
// title: '绑定',
|
||||
// type: 'primary',
|
||||
// icon: 'el-icon-Plus',
|
||||
// render: 'basicButton',
|
||||
// click: row => {
|
||||
// departmentRef.value.open(row)
|
||||
// }
|
||||
// },
|
||||
{
|
||||
name: 'del',
|
||||
text: '删除',
|
||||
type: 'danger',
|
||||
icon: 'el-icon-Delete',
|
||||
render: 'confirmButton',
|
||||
popconfirm: {
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
confirmButtonType: 'danger',
|
||||
title: '确定删除?'
|
||||
},
|
||||
click: row => {
|
||||
delTemplate({ tempId: row.id, deptId: row.deptId }).then(res => {
|
||||
ElMessage.success('删除成功')
|
||||
tableStore.index()
|
||||
})
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
|
||||
loadCallback: () => {}
|
||||
})
|
||||
tableStore.table.params = {}
|
||||
tableStore.table.params.pageSize = 20
|
||||
tableStore.table.params.pageNum = 1
|
||||
|
||||
provide('tableStore', tableStore)
|
||||
// 关闭
|
||||
const shutDown = () => {
|
||||
show.value = true
|
||||
lookShow.value = true
|
||||
tableStore.index()
|
||||
}
|
||||
const add = () => {
|
||||
show.value = false
|
||||
setTimeout(() => {
|
||||
luckysheetRef.value.open('新增报表模板')
|
||||
}, 10)
|
||||
}
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -1,8 +1,14 @@
|
||||
<template>
|
||||
<div class="default-main">
|
||||
<div class="mb10" style="display: flex; justify-content: flex-end">
|
||||
<el-upload ref="upload" action="" :auto-upload="false" :show-file-list="false" :limit="1"
|
||||
:on-change="beforeUpload">
|
||||
<el-upload
|
||||
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-upload>
|
||||
<el-button @click="downloadExcel" class="" type="primary" icon="el-icon-Download">导出excel</el-button>
|
||||
@@ -54,13 +60,13 @@ const info = () => {
|
||||
luckysheet.create(options.value)
|
||||
}
|
||||
//绑定value
|
||||
const setValue = (e: any) => {
|
||||
const setValue = (e: any, frontAndBack: number) => {
|
||||
let data = luckysheet.getRange()
|
||||
luckysheet.setCellValue(
|
||||
data[0].row[0],
|
||||
data[0].column[0],
|
||||
{
|
||||
v: e[e.length - 1],
|
||||
v: frontAndBack == 0 ? e[e.length - 1] : `~` + e[e.length - 1],
|
||||
tr: e
|
||||
}
|
||||
// checkedNodes[0].data.label
|
||||
@@ -119,24 +125,28 @@ const submitForm = (formdata: any, text: string) => {
|
||||
params.append('reportForm', formdata.reportForm)
|
||||
ElMessage.info('正在保存请稍等!')
|
||||
if (text == '新增报表模板') {
|
||||
addTemplate(params).then(res => {
|
||||
ElMessage.success('新增成功!')
|
||||
formFer.value.shutDown()
|
||||
emit('shutDown')
|
||||
}).catch(err => {
|
||||
ElMessage.error('保存失败!')
|
||||
formFer.value.shutDown()
|
||||
})
|
||||
addTemplate(params)
|
||||
.then(res => {
|
||||
ElMessage.success('新增成功!')
|
||||
formFer.value.shutDown()
|
||||
emit('shutDown')
|
||||
})
|
||||
.catch(err => {
|
||||
ElMessage.error('保存失败!')
|
||||
formFer.value.shutDown()
|
||||
})
|
||||
} else if (text == '编辑报表模板') {
|
||||
params.append('id', list.value.id)
|
||||
dateTemplateup(params).then(res => {
|
||||
ElMessage.success('编辑成功!')
|
||||
formFer.value.shutDown()
|
||||
emit('shutDown')
|
||||
}).catch(err => {
|
||||
ElMessage.error('保存失败!')
|
||||
formFer.value.shutDown()
|
||||
})
|
||||
dateTemplateup(params)
|
||||
.then(res => {
|
||||
ElMessage.success('编辑成功!')
|
||||
formFer.value.shutDown()
|
||||
emit('shutDown')
|
||||
})
|
||||
.catch(err => {
|
||||
ElMessage.error('保存失败!')
|
||||
formFer.value.shutDown()
|
||||
})
|
||||
}
|
||||
}
|
||||
const open = async (text: string, row?: any) => {
|
||||
@@ -150,7 +160,7 @@ const open = async (text: string, row?: any) => {
|
||||
info()
|
||||
}
|
||||
defineExpose({ open })
|
||||
onMounted(() => { })
|
||||
onMounted(() => {})
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
:deep(.el-tab-pane) {
|
||||
|
||||
@@ -19,7 +19,7 @@
|
||||
<el-form-item class="top" label="组件路径" prop="path">
|
||||
<el-input v-model="form.path" placeholder="请输入组件路径"></el-input>
|
||||
</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-button label="年" value="1" />
|
||||
<el-radio-button label="季" value="2" />
|
||||
@@ -27,7 +27,7 @@
|
||||
<el-radio-button label="周" value="4" />
|
||||
<el-radio-button label="日" value="5" />
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-form-item> -->
|
||||
<el-form-item class="top" label="组件排序" prop="sort">
|
||||
<el-input v-model="form.sort" placeholder="请输入组件排序"></el-input>
|
||||
</el-form-item>
|
||||
@@ -54,15 +54,13 @@ import { ref, inject, onMounted, type Component, defineAsyncComponent, h, markRa
|
||||
import { reactive } from 'vue'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import TableStore from '@/utils/tableStore' // 若不是列表页面弹框可删除
|
||||
import { getFatherComponent, componentAdd, componentEdit } from '@/api/user-boot/dept'
|
||||
import IconSelector from '@/components/baInput/components/iconSelector.vue'
|
||||
import html2canvas from 'html2canvas'
|
||||
|
||||
const emit = defineEmits(['cancel','submit'])
|
||||
const dictData = useDictData()
|
||||
const dialogVisible = ref(false)
|
||||
const title = ref('')
|
||||
const tableStore = inject('tableStore') as TableStore
|
||||
const formRef = ref()
|
||||
// 注意不要和表单ref的命名冲突
|
||||
const form = ref<anyObj>({
|
||||
@@ -121,6 +119,7 @@ const submit = () => {
|
||||
image: url
|
||||
}).then(res => {
|
||||
ElMessage.success('新增成功!')
|
||||
emit('submit')
|
||||
cancel()
|
||||
})
|
||||
} else {
|
||||
@@ -131,6 +130,7 @@ const submit = () => {
|
||||
image: url
|
||||
}).then(res => {
|
||||
ElMessage.success('修改成功!')
|
||||
emit('submit')
|
||||
cancel()
|
||||
})
|
||||
}
|
||||
@@ -176,7 +176,7 @@ const registerComponent = (path: string): Component | string | null => {
|
||||
}
|
||||
}
|
||||
const cancel = () => {
|
||||
tableStore.index()
|
||||
emit('cancel')
|
||||
dialogVisible.value = false
|
||||
}
|
||||
defineExpose({ open })
|
||||
|
||||
139
src/views/setting/dictionary/component/addTree.vue
Normal file
139
src/views/setting/dictionary/component/addTree.vue
Normal 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>
|
||||
@@ -2,22 +2,29 @@
|
||||
<div class="default-main">
|
||||
<TableHeader :showSearch="false">
|
||||
<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>
|
||||
</TableHeader>
|
||||
<Table ref="tableRef" :tree-config="{ transform: true, parentField: 'uPid', rowField: 'uId' }"
|
||||
:scroll-y="{ enabled: true }" />
|
||||
<Add ref="addRef" v-if="addFlag" @onSubmit="tableStore.index()" />
|
||||
<Table
|
||||
ref="tableRef"
|
||||
: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>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted, provide,nextTick } from 'vue'
|
||||
import { ref, onMounted, provide, nextTick } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import Table from '@/components/table/index.vue'
|
||||
import { useDictData } from '@/stores/dictData'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import TableHeader from '@/components/table/header/index.vue'
|
||||
import Add from './add.vue'
|
||||
import Tree from './addTree.vue'
|
||||
import { deleteSubassembly } from '@/api/user-boot/dept'
|
||||
defineOptions({
|
||||
name: 'component'
|
||||
@@ -25,6 +32,7 @@ defineOptions({
|
||||
const addRef = ref()
|
||||
const addFlag = ref(false)
|
||||
const tableRef = ref()
|
||||
const treeRef = ref()
|
||||
const treeData: any = ref([])
|
||||
const tableStore = new TableStore({
|
||||
url: '/user-boot/component/componentTree',
|
||||
@@ -39,7 +47,7 @@ const tableStore = new TableStore({
|
||||
width: '80',
|
||||
render: 'icon'
|
||||
},
|
||||
{ field: 'code', title: '组件标识', minWidth: '100', },
|
||||
{ field: 'code', title: '组件标识', minWidth: '100' },
|
||||
{ field: 'path', title: '组件路径' },
|
||||
{ field: 'image', title: '组件展示', render: 'image' },
|
||||
{
|
||||
@@ -53,13 +61,18 @@ const tableStore = new TableStore({
|
||||
type: 'primary',
|
||||
icon: 'el-icon-Plus',
|
||||
render: 'basicButton',
|
||||
disabled: row => {
|
||||
return row.path == '' || row.path == null
|
||||
},
|
||||
|
||||
click: row => {
|
||||
addFlag.value = true
|
||||
setTimeout(() => {
|
||||
addRef.value.open('修改组件', row)
|
||||
if (row.path == '' || row.path == null) {
|
||||
// 修改树
|
||||
treeRef.value.open('修改树', row)
|
||||
} else {
|
||||
// 组件修改
|
||||
|
||||
addRef.value.open('修改组件', row)
|
||||
}
|
||||
}, 100)
|
||||
}
|
||||
},
|
||||
@@ -69,9 +82,7 @@ const tableStore = new TableStore({
|
||||
type: 'danger',
|
||||
icon: 'el-icon-Delete',
|
||||
render: 'confirmButton',
|
||||
disabled: row => {
|
||||
return row.path == '' || row.path == null
|
||||
},
|
||||
|
||||
popconfirm: {
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
@@ -79,10 +90,13 @@ const tableStore = new TableStore({
|
||||
title: '确定删除?'
|
||||
},
|
||||
click: row => {
|
||||
deleteSubassembly({ id: row.id }).then(() => {
|
||||
ElMessage.success('删除成功!')
|
||||
tableStore.index()
|
||||
})
|
||||
if (row.path == '' || row.path == null) {
|
||||
} else {
|
||||
deleteSubassembly({ id: row.id }).then(() => {
|
||||
ElMessage.success('删除成功!')
|
||||
tableStore.index()
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
@@ -127,6 +141,16 @@ const add = () => {
|
||||
addRef.value.open('新增组件')
|
||||
}, 100)
|
||||
}
|
||||
// 新增数
|
||||
const addTree = () => {
|
||||
addFlag.value = true
|
||||
setTimeout(() => {
|
||||
treeRef.value.open('新增树')
|
||||
}, 100)
|
||||
}
|
||||
const cancel = () => {
|
||||
addFlag.value = false
|
||||
}
|
||||
provide('tableStore', tableStore)
|
||||
onMounted(() => {
|
||||
tableStore.index()
|
||||
|
||||
@@ -1,84 +1,84 @@
|
||||
<template>
|
||||
<el-dialog class="cn-operate-dialog" v-model.trim="dialogVisible" :title="title">
|
||||
<el-scrollbar>
|
||||
<el-form :inline="false" :model="form" label-width="120px" :rules="rules">
|
||||
<el-form-item label="字典名称:" prop="name">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.name" placeholder="请输入字典名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="序号:" prop="sort" class="top">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.sort" placeholder="请输入序号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="编码:" prop="code" class="top">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.code" placeholder="请输入字典编码"></el-input>
|
||||
</el-form-item>
|
||||
<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"
|
||||
placeholder="请输入字典描述"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submit">确认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, inject } from 'vue'
|
||||
import { reactive } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { useAdminInfo } from '@/stores/adminInfo'
|
||||
import { dicAdd, dicUpdate } from '@/api/system-boot/dic'
|
||||
|
||||
const adminInfo = useAdminInfo()
|
||||
const tableStore = inject('tableStore') as TableStore
|
||||
// do not use same name with ref
|
||||
const form = reactive({
|
||||
name: '',
|
||||
code: '',
|
||||
remark: '',
|
||||
sort: 100,
|
||||
type: 0,
|
||||
pid: 0,
|
||||
id: ''
|
||||
})
|
||||
const rules = {
|
||||
name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
|
||||
sort: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||
code: [{ required: true, message: '编码不能为空', trigger: 'blur' }]
|
||||
}
|
||||
const dialogVisible = ref(false)
|
||||
const title = ref('新增菜单')
|
||||
const open = (text: string, data?: anyObj) => {
|
||||
title.value = text
|
||||
dialogVisible.value = true
|
||||
if (data) {
|
||||
for (let key in form) {
|
||||
form[key] = data[key]
|
||||
}
|
||||
} else {
|
||||
for (let key in form) {
|
||||
form[key] = ''
|
||||
}
|
||||
form.sort = 100
|
||||
form.pid = 0
|
||||
form.type = 0
|
||||
}
|
||||
}
|
||||
const submit = async () => {
|
||||
if (form.id) {
|
||||
await dicUpdate(form)
|
||||
} else {
|
||||
await dicAdd(form)
|
||||
}
|
||||
ElMessage.success('保存成功')
|
||||
tableStore.index()
|
||||
dialogVisible.value = false
|
||||
}
|
||||
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
<template>
|
||||
<el-dialog class="cn-operate-dialog" width="500px" v-model.trim="dialogVisible" :title="title">
|
||||
<el-scrollbar>
|
||||
<el-form :inline="false" :model="form" label-width="120px" :rules="rules">
|
||||
<el-form-item label="字典名称:" prop="name">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.name" placeholder="请输入字典名称"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="序号:" prop="sort" class="top">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.sort" placeholder="请输入序号"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="编码:" prop="code" class="top">
|
||||
<el-input maxlength="32" show-word-limit v-model.trim="form.code" placeholder="请输入字典编码"></el-input>
|
||||
</el-form-item>
|
||||
<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"
|
||||
placeholder="请输入字典描述"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</el-scrollbar>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button @click="dialogVisible = false">取消</el-button>
|
||||
<el-button type="primary" @click="submit">确认</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, inject } from 'vue'
|
||||
import { reactive } from 'vue'
|
||||
import TableStore from '@/utils/tableStore'
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { useAdminInfo } from '@/stores/adminInfo'
|
||||
import { dicAdd, dicUpdate } from '@/api/system-boot/dic'
|
||||
|
||||
const adminInfo = useAdminInfo()
|
||||
const tableStore = inject('tableStore') as TableStore
|
||||
// do not use same name with ref
|
||||
const form = reactive({
|
||||
name: '',
|
||||
code: '',
|
||||
remark: '',
|
||||
sort: 100,
|
||||
type: 0,
|
||||
pid: 0,
|
||||
id: ''
|
||||
})
|
||||
const rules = {
|
||||
name: [{ required: true, message: '名称不能为空', trigger: 'blur' }],
|
||||
sort: [{ required: true, message: '排序不能为空', trigger: 'blur' }],
|
||||
code: [{ required: true, message: '编码不能为空', trigger: 'blur' }]
|
||||
}
|
||||
const dialogVisible = ref(false)
|
||||
const title = ref('新增菜单')
|
||||
const open = (text: string, data?: anyObj) => {
|
||||
title.value = text
|
||||
dialogVisible.value = true
|
||||
if (data) {
|
||||
for (let key in form) {
|
||||
form[key] = data[key]
|
||||
}
|
||||
} else {
|
||||
for (let key in form) {
|
||||
form[key] = ''
|
||||
}
|
||||
form.sort = 100
|
||||
form.pid = 0
|
||||
form.type = 0
|
||||
}
|
||||
}
|
||||
const submit = async () => {
|
||||
if (form.id) {
|
||||
await dicUpdate(form)
|
||||
} else {
|
||||
await dicAdd(form)
|
||||
}
|
||||
ElMessage.success('保存成功')
|
||||
tableStore.index()
|
||||
dialogVisible.value = false
|
||||
}
|
||||
|
||||
defineExpose({ open })
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user