同步电网一张图代码

This commit is contained in:
GGJ
2024-05-23 17:30:16 +08:00
parent 42109a1478
commit 1097c971cc
6 changed files with 155 additions and 123 deletions

View File

@@ -1,92 +1,91 @@
<template>
<el-dialog draggable class="cn-operate-dialog" v-model="dialogVisible" :title="title" :before-close="Cancel">
<el-scrollbar>
<el-form :inline="false" :model="configStore" label-width="160px">
<el-divider border-style="dashed">全局</el-divider>
<div class="layout-config-global form-two">
<el-form-item label="组件主名称">
<el-input v-model="configStore.name" placeholder="请输入主题名称" />
</el-form-item>
<el-form-item label="后台页面切换动画">
<el-select v-model="configStore.mainAnimation">
<el-option label="slide-right" value="slide-right"></el-option>
<el-option label="slide-left" value="slide-left"></el-option>
<el-option label="el-fade-in-linear" value="el-fade-in-linear"></el-option>
<el-option label="el-fade-in" value="el-fade-in"></el-option>
<el-option label="el-zoom-in-center" value="el-zoom-in-center"></el-option>
<el-option label="el-zoom-in-top" value="el-zoom-in-top"></el-option>
<el-option label="el-zoom-in-bottom" value="el-zoom-in-bottom"></el-option>
</el-select>
</el-form-item>
<el-form-item label="组件主题色">
<el-color-picker v-model="configStore.elementUiPrimary[0]" />
</el-form-item>
<el-form-item label="表格标题栏背景颜色">
<el-color-picker v-model="configStore.tableHeaderBackground[0]" />
</el-form-item>
<el-form-item label="表格标题栏文字颜色">
<el-color-picker v-model="configStore.tableHeaderColor[0]" />
</el-form-item>
<el-form-item label="表格激活栏颜色">
<el-color-picker v-model="configStore.tableCurrent[0]" />
</el-form-item>
<el-form-item label="组件主描述">
<el-input
v-model="configStore.remark"
:autosize="{ minRows: 2, maxRows: 4 }"
type="textarea"
placeholder="请输入描述"
/>
</el-form-item>
</div>
<el-divider border-style="dashed">侧边栏</el-divider>
<div class="layout-config-aside form-two">
<el-form-item label="侧边菜单栏背景色">
<el-color-picker v-model="configStore.menuBackground[0]" />
</el-form-item>
<el-form-item label="侧边菜单文字颜色">
<el-color-picker v-model="configStore.menuColor[0]" />
</el-form-item>
<el-form-item label="侧边菜单激活项背景色">
<el-color-picker v-model="configStore.menuActiveBackground[0]" />
</el-form-item>
<el-form-item label="侧边菜单激活项文字色">
<el-color-picker v-model="configStore.menuActiveColor[0]" />
</el-form-item>
<el-form-item label="侧边菜单顶栏背景色">
<el-color-picker v-model="configStore.menuTopBarBackground[0]" />
</el-form-item>
</div>
<el-dialog draggable v-model="dialogVisible" :title="title" :before-close="Cancel">
<el-form :inline="false" :model="configStore" label-width="auto">
<el-divider border-style="dashed">全局</el-divider>
<div class="layout-config-global form-two">
<el-form-item label="组件主名称">
<el-input v-model="configStore.name" placeholder="请输入主题名称" />
</el-form-item>
<el-form-item label="后台页面切换动画">
<el-select v-model="configStore.mainAnimation">
<el-option label="slide-right" value="slide-right"></el-option>
<el-option label="slide-left" value="slide-left"></el-option>
<el-option label="el-fade-in-linear" value="el-fade-in-linear"></el-option>
<el-option label="el-fade-in" value="el-fade-in"></el-option>
<el-option label="el-zoom-in-center" value="el-zoom-in-center"></el-option>
<el-option label="el-zoom-in-top" value="el-zoom-in-top"></el-option>
<el-option label="el-zoom-in-bottom" value="el-zoom-in-bottom"></el-option>
</el-select>
</el-form-item>
<el-form-item label="组件主题色">
<el-color-picker v-model="configStore.elementUiPrimary[0]" />
</el-form-item>
<el-form-item label="表格标题栏背景颜色">
<el-color-picker v-model="configStore.tableHeaderBackground[0]" />
</el-form-item>
<el-form-item label="表格标题栏文字颜色">
<el-color-picker v-model="configStore.tableHeaderColor[0]" />
</el-form-item>
<el-form-item label="表格激活栏颜色">
<el-color-picker v-model="configStore.tableCurrent[0]" />
</el-form-item>
<el-form-item label="组件主描述">
<el-input
v-model="configStore.remark"
:autosize="{ minRows: 2, maxRows: 4 }"
type="textarea"
placeholder="请输入描述"
/>
</el-form-item>
</div>
<el-divider border-style="dashed">侧边栏</el-divider>
<div class="layout-config-aside form-two">
<el-form-item label="侧边菜单栏背景色">
<el-color-picker v-model="configStore.menuBackground[0]" />
</el-form-item>
<el-form-item label="侧边菜单文字颜色">
<el-color-picker v-model="configStore.menuColor[0]" />
</el-form-item>
<el-form-item label="侧边菜单激活项背景色">
<el-color-picker v-model="configStore.menuActiveBackground[0]" />
</el-form-item>
<el-form-item label="侧边菜单激活项文字色">
<el-color-picker v-model="configStore.menuActiveColor[0]" />
</el-form-item>
<el-form-item label="侧边菜单顶栏背景色">
<el-color-picker v-model="configStore.menuTopBarBackground[0]" />
</el-form-item>
</div>
<el-divider border-style="dashed">顶栏</el-divider>
<div class="layout-config-aside form-two">
<el-form-item label="顶栏背景色">
<el-color-picker v-model="configStore.headerBarBackground[0]" />
</el-form-item>
<el-form-item label="顶栏文字色">
<el-color-picker v-model="configStore.headerBarTabColor[0]" />
</el-form-item>
<el-form-item label="顶栏logo">
<el-image
style="height: 50px"
:src="logoFile.url"
:preview-src-list="[logoFile.url]"
v-if="logoFile.url"
class="mr10"
></el-image>
<el-upload
action=""
:show-file-list="false"
:auto-upload="false"
accept=".png,.jpg"
:on-change="chooseImage"
>
<el-button type="primary">上传图片</el-button>
</el-upload>
</el-form-item>
</div>
</el-form>
<el-divider border-style="dashed">顶栏</el-divider>
<div class="layout-config-aside form-two">
<el-form-item label="顶栏背景色">
<el-color-picker v-model="configStore.headerBarBackground[0]" />
</el-form-item>
<el-form-item label="顶栏文字色">
<el-color-picker v-model="configStore.headerBarTabColor[0]" />
</el-form-item>
<el-form-item label="顶栏logo">
<el-image
style="height: 50px"
:src="logoFile.url"
:preview-src-list="[logoFile.url]"
v-if="logoFile.url"
class="mr10"
></el-image>
<el-upload
action=""
:show-file-list="false"
:auto-upload="false"
accept=".png,.jpg"
:on-change="chooseImage"
>
<el-button type="primary">上传图片</el-button>
</el-upload>
</el-form-item>
</div>
</el-form>
</el-scrollbar>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="onSubmit">确定</el-button>