feat(页面配置、开发相关):
This commit is contained in:
parent
2a4525c2d7
commit
3f50e4bf2b
|
@ -51,6 +51,8 @@ logs
|
||||||
doc
|
doc
|
||||||
bin
|
bin
|
||||||
.github
|
.github
|
||||||
|
protocolFile
|
||||||
|
nginx
|
||||||
|
|
||||||
ry.bat
|
ry.bat
|
||||||
/LICENSE
|
/LICENSE
|
|
@ -0,0 +1,53 @@
|
||||||
|
import request from '@/utils/request'
|
||||||
|
|
||||||
|
// 查询计划发布中的类型列表
|
||||||
|
export function listType(query) {
|
||||||
|
return request({
|
||||||
|
url: '/plan/type/list',
|
||||||
|
method: 'get',
|
||||||
|
params: query
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询计划发布中的类型详细
|
||||||
|
export function getType(id) {
|
||||||
|
return request({
|
||||||
|
url: '/plan/type/' + id,
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 新增计划发布中的类型
|
||||||
|
export function addType(data) {
|
||||||
|
return request({
|
||||||
|
url: '/plan/type',
|
||||||
|
method: 'post',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 修改计划发布中的类型
|
||||||
|
export function updateType(data) {
|
||||||
|
return request({
|
||||||
|
url: '/plan/type',
|
||||||
|
method: 'put',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 删除计划发布中的类型
|
||||||
|
export function delType(id) {
|
||||||
|
return request({
|
||||||
|
url: '/plan/type/' + id,
|
||||||
|
method: 'delete'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查询部门下拉树结构
|
||||||
|
export function planTypeTreeSelect() {
|
||||||
|
return request({
|
||||||
|
url: '/plan/type/planTree',
|
||||||
|
method: 'get'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
|
@ -0,0 +1,106 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<!-- 调整缩放比例的控件 -->
|
||||||
|
<el-form label-position="left" label-width="70px">
|
||||||
|
<el-form-item label="缩放比例">
|
||||||
|
<el-row :gutter="20" align="middle">
|
||||||
|
<el-col :span="10">
|
||||||
|
<el-slider
|
||||||
|
v-model="scale"
|
||||||
|
:min="0.5"
|
||||||
|
:max="3"
|
||||||
|
:step="0.5"
|
||||||
|
show-input
|
||||||
|
input-size="mini"
|
||||||
|
/>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="文字预览">
|
||||||
|
<div :style="containerStyle">
|
||||||
|
<span :style="textStyle">
|
||||||
|
{{ content }}
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
scale: 1, // 默认的缩放比例
|
||||||
|
};
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
fontStyle: {
|
||||||
|
type: String,
|
||||||
|
default: 'normal',
|
||||||
|
},
|
||||||
|
fontColor: {
|
||||||
|
type: String,
|
||||||
|
default: '#ff0000', // 字体默认颜色改为红色
|
||||||
|
},
|
||||||
|
fontSize: {
|
||||||
|
type: Number,
|
||||||
|
default: 16,
|
||||||
|
},
|
||||||
|
letterSpacing: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
fontX: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
fontY: {
|
||||||
|
type: Number,
|
||||||
|
default: 0,
|
||||||
|
},
|
||||||
|
backgroundWidth: {
|
||||||
|
type: Number,
|
||||||
|
default: 320,
|
||||||
|
},
|
||||||
|
backgroundHeight: {
|
||||||
|
type: Number,
|
||||||
|
default: 160,
|
||||||
|
},
|
||||||
|
lineHeight: {
|
||||||
|
type: Number,
|
||||||
|
default: 1, // 默认行间距为1
|
||||||
|
},
|
||||||
|
content: {
|
||||||
|
type: String,
|
||||||
|
default: '这里是示例内容,哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
containerStyle() {
|
||||||
|
return {
|
||||||
|
width: `${this.backgroundWidth * this.scale}px`,
|
||||||
|
height: `${this.backgroundHeight * this.scale}px`,
|
||||||
|
position: 'relative',
|
||||||
|
background: '#000000',
|
||||||
|
overflow: 'hidden',
|
||||||
|
display: 'flex',
|
||||||
|
alignItems: 'center',
|
||||||
|
justifyContent: 'center',
|
||||||
|
};
|
||||||
|
},
|
||||||
|
textStyle() {
|
||||||
|
return {
|
||||||
|
position: 'absolute',
|
||||||
|
top: `${-this.fontY * this.scale}px`,
|
||||||
|
left: `${this.fontX * this.scale}px`,
|
||||||
|
fontStyle: this.fontStyle,
|
||||||
|
color: this.fontColor,
|
||||||
|
fontSize: `${this.fontSize * this.scale}px`,
|
||||||
|
letterSpacing: `${this.letterSpacing * this.scale}px`,
|
||||||
|
lineHeight: `${this.lineHeight}`,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
|
@ -22,9 +22,9 @@
|
||||||
/>
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="类型" prop="type">
|
<el-form-item label="信息类型" prop="type">
|
||||||
<el-select
|
<el-select
|
||||||
v-model="queryParams.type"
|
v-model="queryParams.infoType"
|
||||||
clearable
|
clearable
|
||||||
placeholder="全部"
|
placeholder="全部"
|
||||||
>
|
>
|
||||||
|
@ -75,16 +75,16 @@
|
||||||
v-hasPermi="['board:content:remove']"
|
v-hasPermi="['board:content:remove']"
|
||||||
>删除</el-button>
|
>删除</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
<!-- <el-col :span="1.5">-->
|
||||||
<el-button
|
<!-- <el-button-->
|
||||||
type="warning"
|
<!-- type="warning"-->
|
||||||
plain
|
<!-- plain-->
|
||||||
icon="el-icon-download"
|
<!-- icon="el-icon-download"-->
|
||||||
size="mini"
|
<!-- size="mini"-->
|
||||||
@click="handleExport"
|
<!-- @click="handleExport"-->
|
||||||
v-hasPermi="['board:content:export']"
|
<!-- v-hasPermi="['board:content:export']"-->
|
||||||
>导出</el-button>
|
<!-- >导出</el-button>-->
|
||||||
</el-col>
|
<!-- </el-col>-->
|
||||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
|
@ -138,7 +138,7 @@
|
||||||
/>
|
/>
|
||||||
|
|
||||||
<!-- 添加或修改预置信息及模版对话框 -->
|
<!-- 添加或修改预置信息及模版对话框 -->
|
||||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
<el-dialog :title="title" :visible.sync="open" width="1000px" append-to-body>
|
||||||
<el-form ref="form" :model="form" :rules="rules" label-width="auto">
|
<el-form ref="form" :model="form" :rules="rules" label-width="auto">
|
||||||
<el-form-item label="预置信息名称" prop="name">
|
<el-form-item label="预置信息名称" prop="name">
|
||||||
<el-input v-model="form.name" placeholder="请输入预置信息名称" />
|
<el-input v-model="form.name" placeholder="请输入预置信息名称" />
|
||||||
|
@ -199,7 +199,7 @@
|
||||||
</el-select>
|
</el-select>
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="字体大小" prop="fontSize">
|
<el-form-item label="字体大小" prop="fontSize">
|
||||||
<el-input-number :min="0" v-model="form.fontSize" placeholder="请输入字体大小" />
|
<el-input-number :min="20" :max="50" v-model="form.fontSize" placeholder="请输入字体大小" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="字体间距" prop="letterSpacing">
|
<el-form-item label="字体间距" prop="letterSpacing">
|
||||||
<el-input-number :min="0" v-model="form.letterSpacing" placeholder="请输入字体间距" />
|
<el-input-number :min="0" v-model="form.letterSpacing" placeholder="请输入字体间距" />
|
||||||
|
@ -213,11 +213,18 @@
|
||||||
<el-form-item label="播放时间" prop="playTime">
|
<el-form-item label="播放时间" prop="playTime">
|
||||||
<el-input-number :min="0" v-model="form.playTime" placeholder="请输入播放时间" />
|
<el-input-number :min="0" v-model="form.playTime" placeholder="请输入播放时间" />
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="预览路径" prop="previewPath">
|
<text-preview
|
||||||
<el-input v-model="form.previewPath" placeholder="请输入预览路径" />
|
fontStyle="SongTi"
|
||||||
</el-form-item>
|
:fontSize="form.fontSize"
|
||||||
|
:letterSpacing="form.letterSpacing"
|
||||||
|
:fontX="form.fontPositionX"
|
||||||
|
:fontY="form.fontPositionY"
|
||||||
|
:backgroundWidth="bgSize.width"
|
||||||
|
:backgroundHeight="bgSize.height"
|
||||||
|
:lineHeight="1"
|
||||||
|
:content="form.content" />
|
||||||
</el-form>
|
</el-form>
|
||||||
|
|
||||||
<div slot="footer" class="dialog-footer">
|
<div slot="footer" class="dialog-footer">
|
||||||
<el-button type="primary" @click="submitForm">确 定</el-button>
|
<el-button type="primary" @click="submitForm">确 定</el-button>
|
||||||
<el-button @click="cancel">取 消</el-button>
|
<el-button @click="cancel">取 消</el-button>
|
||||||
|
@ -228,9 +235,11 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { listContent, getContent, delContent, addContent, updateContent } from "@/api/board/content";
|
import { listContent, getContent, delContent, addContent, updateContent } from "@/api/board/content";
|
||||||
|
import TextPreview from "@/views/board/component/TextPreview.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "Content",
|
name: "Content",
|
||||||
|
components: {TextPreview},
|
||||||
dicts: ['board_size','font_color','font_style', 'alert_type'],
|
dicts: ['board_size','font_color','font_style', 'alert_type'],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
@ -334,6 +343,15 @@ export default {
|
||||||
created() {
|
created() {
|
||||||
this.getList();
|
this.getList();
|
||||||
},
|
},
|
||||||
|
computed:{
|
||||||
|
bgSize() {
|
||||||
|
if (!this.form.boardSize) {
|
||||||
|
return {width: 320, height:160}
|
||||||
|
}
|
||||||
|
let [height, width] = this.form.boardSize.split("*").map(Number);
|
||||||
|
return {width, height}
|
||||||
|
},
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
/** 查询预置信息及模版列表 */
|
/** 查询预置信息及模版列表 */
|
||||||
getList() {
|
getList() {
|
||||||
|
|
|
@ -98,17 +98,17 @@
|
||||||
>删除
|
>删除
|
||||||
</el-button>
|
</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
<!-- <el-col :span="1.5">-->
|
||||||
<el-button
|
<!-- <el-button-->
|
||||||
type="warning"
|
<!-- type="warning"-->
|
||||||
plain
|
<!-- plain-->
|
||||||
icon="el-icon-download"
|
<!-- icon="el-icon-download"-->
|
||||||
size="mini"
|
<!-- size="mini"-->
|
||||||
@click="handleExport"
|
<!-- @click="handleExport"-->
|
||||||
v-hasPermi="['board:info:export']"
|
<!-- v-hasPermi="['board:info:export']"-->
|
||||||
>导出
|
<!-- >导出-->
|
||||||
</el-button>
|
<!-- </el-button>-->
|
||||||
</el-col>
|
<!-- </el-col>-->
|
||||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
|
@ -228,11 +228,12 @@ import {listInfo, getInfo, delInfo, addInfo, updateInfo} from "@/api/board/info"
|
||||||
import {deptTreeSelect} from "@/api/system/user";
|
import {deptTreeSelect} from "@/api/system/user";
|
||||||
import Treeselect from "@riophae/vue-treeselect";
|
import Treeselect from "@riophae/vue-treeselect";
|
||||||
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
import "@riophae/vue-treeselect/dist/vue-treeselect.css";
|
||||||
|
import TextPreview from "@/views/board/component/TextPreview.vue";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "Info",
|
name: "Info",
|
||||||
dicts: ['board_size', 'board_protocol'],
|
dicts: ['board_size', 'board_protocol'],
|
||||||
components: {Treeselect},
|
components: {TextPreview, Treeselect},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
// 遮罩层
|
// 遮罩层
|
||||||
|
|
|
@ -1,56 +1,22 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="auto">
|
<el-row :gutter="20">
|
||||||
<el-form-item label="等级" prop="level">
|
<el-col :span="4" :xs="24">
|
||||||
<el-select
|
<div class="head-container">
|
||||||
v-model="queryParams.level"
|
|
||||||
clearable
|
|
||||||
placeholder="全部"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="dict in dict.type.alert_level"
|
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="类型" prop="type">
|
|
||||||
<el-select
|
|
||||||
v-model="queryParams.type"
|
|
||||||
clearable
|
|
||||||
placeholder="全部"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="dict in dict.type.alert_type"
|
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="最大值" prop="maxValue">
|
|
||||||
<el-input
|
<el-input
|
||||||
v-model="queryParams.maxValue"
|
v-model="searchValue"
|
||||||
placeholder="请输入最大值"
|
placeholder="请输入名称"
|
||||||
clearable
|
clearable
|
||||||
@keyup.enter.native="handleQuery"
|
size="small"
|
||||||
|
prefix-icon="el-icon-search"
|
||||||
|
style="margin-bottom: 20px"
|
||||||
/>
|
/>
|
||||||
</el-form-item>
|
</div>
|
||||||
<el-form-item label="最小值" prop="minValue">
|
<div class="head-container">
|
||||||
<el-input
|
<plan-type-tree @node-clicked="handleNodeClick" :search-value="searchValue" />
|
||||||
v-model="queryParams.minValue"
|
</div>
|
||||||
placeholder="请输入最小值"
|
</el-col>
|
||||||
clearable
|
<el-col :span="20" :xs="24">
|
||||||
@keyup.enter.native="handleQuery"
|
|
||||||
/>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
|
||||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
|
|
||||||
<el-row :gutter="10" class="mb8">
|
<el-row :gutter="10" class="mb8">
|
||||||
<el-col :span="1.5">
|
<el-col :span="1.5">
|
||||||
<el-button
|
<el-button
|
||||||
|
@ -84,32 +50,23 @@
|
||||||
v-hasPermi="['board:plan:remove']"
|
v-hasPermi="['board:plan:remove']"
|
||||||
>删除</el-button>
|
>删除</el-button>
|
||||||
</el-col>
|
</el-col>
|
||||||
<el-col :span="1.5">
|
<!-- <el-col :span="1.5">-->
|
||||||
<el-button
|
<!-- <el-button-->
|
||||||
type="warning"
|
<!-- type="warning"-->
|
||||||
plain
|
<!-- plain-->
|
||||||
icon="el-icon-download"
|
<!-- icon="el-icon-download"-->
|
||||||
size="mini"
|
<!-- size="mini"-->
|
||||||
@click="handleExport"
|
<!-- @click="handleExport"-->
|
||||||
v-hasPermi="['board:plan:export']"
|
<!-- v-hasPermi="['board:plan:export']"-->
|
||||||
>导出</el-button>
|
<!-- >导出</el-button>-->
|
||||||
</el-col>
|
<!-- </el-col>-->
|
||||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||||
</el-row>
|
</el-row>
|
||||||
|
|
||||||
<el-table v-loading="loading" :data="planList" @selection-change="handleSelectionChange">
|
<el-table v-loading="loading" :data="planList" @selection-change="handleSelectionChange">
|
||||||
<el-table-column type="selection" width="55" align="center" />
|
<el-table-column type="selection" width="55" align="center" />
|
||||||
<el-table-column label="唯一编号" align="center" prop="id" />
|
<el-table-column label="唯一编号" align="center" prop="id" />
|
||||||
<el-table-column label="类型" align="center" prop="type">
|
<el-table-column label="类型" align="center" prop="typeName" />
|
||||||
<template slot-scope="scope">
|
<el-table-column label="等级" align="center" prop="level" />
|
||||||
<dict-tag :options="dict.type.alert_type" :value="scope.row.type"/>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="等级" align="center" prop="level">
|
|
||||||
<template slot-scope="scope">
|
|
||||||
<dict-tag :options="dict.type.alert_level" :value="scope.row.level"/>
|
|
||||||
</template>
|
|
||||||
</el-table-column>
|
|
||||||
<el-table-column label="最大值" align="center" prop="maxValue" />
|
<el-table-column label="最大值" align="center" prop="maxValue" />
|
||||||
<el-table-column label="最小值" align="center" prop="minValue" />
|
<el-table-column label="最小值" align="center" prop="minValue" />
|
||||||
<el-table-column label="显示内容" align="center" prop="displayContent" />
|
<el-table-column label="显示内容" align="center" prop="displayContent" />
|
||||||
|
@ -139,36 +96,17 @@
|
||||||
:limit.sync="queryParams.pageSize"
|
:limit.sync="queryParams.pageSize"
|
||||||
@pagination="getList"
|
@pagination="getList"
|
||||||
/>
|
/>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
|
||||||
<!-- 添加或修改警报计划对话框 -->
|
<!-- 添加或修改警报计划对话框 -->
|
||||||
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
<el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
|
||||||
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
<el-form ref="form" :model="form" :rules="rules" label-width="80px">
|
||||||
<el-form-item label="等级" prop="level">
|
<el-form-item label="等级" prop="level">
|
||||||
<el-select
|
<el-input v-model="form.level" placeholder="请输入等级" />
|
||||||
v-model="form.level"
|
|
||||||
placeholder="全部"
|
|
||||||
:value="1"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="dict in dict.type.alert_level"
|
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="类型" prop="type">
|
<el-form-item label="类型" prop="typeName">
|
||||||
<el-select
|
<el-input v-model="clickNodeData.label" disabled />
|
||||||
v-model="form.type"
|
|
||||||
placeholder="全部"
|
|
||||||
>
|
|
||||||
<el-option
|
|
||||||
v-for="dict in dict.type.alert_type"
|
|
||||||
:key="dict.value"
|
|
||||||
:label="dict.label"
|
|
||||||
:value="dict.value"
|
|
||||||
/>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
</el-form-item>
|
||||||
<el-form-item label="最小值" prop="minValue">
|
<el-form-item label="最小值" prop="minValue">
|
||||||
<el-input-number :min="0" :precision="2" v-model="form.minValue" placeholder="请输入最小值" />
|
<el-input-number :min="0" :precision="2" v-model="form.minValue" placeholder="请输入最小值" />
|
||||||
|
@ -190,12 +128,16 @@
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { listPlan, getPlan, delPlan, addPlan, updatePlan } from "@/api/board/plan";
|
import { listPlan, getPlan, delPlan, addPlan, updatePlan } from "@/api/board/plan";
|
||||||
|
import PlanTypeTree from "@/views/board/plan/planTypeTree.vue";
|
||||||
|
import {planTypeTreeSelect} from "@/api/board/plantype";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "Plan",
|
name: "Plan",
|
||||||
|
components: {PlanTypeTree},
|
||||||
dicts: ['alert_level','alert_type'],
|
dicts: ['alert_level','alert_type'],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
searchValue: "",
|
||||||
// 遮罩层
|
// 遮罩层
|
||||||
loading: true,
|
loading: true,
|
||||||
// 选中数组
|
// 选中数组
|
||||||
|
@ -224,6 +166,10 @@ export default {
|
||||||
minValue: null,
|
minValue: null,
|
||||||
displayContent: null
|
displayContent: null
|
||||||
},
|
},
|
||||||
|
clickNodeData: {
|
||||||
|
id: 0,
|
||||||
|
label: "",
|
||||||
|
},
|
||||||
// 表单参数
|
// 表单参数
|
||||||
form: {},
|
form: {},
|
||||||
// 表单校验
|
// 表单校验
|
||||||
|
@ -247,7 +193,7 @@ export default {
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.getList();
|
this.getPlanTypeTree();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
/** 查询警报计划列表 */
|
/** 查询警报计划列表 */
|
||||||
|
@ -304,8 +250,6 @@ export default {
|
||||||
const id = row.id || this.ids
|
const id = row.id || this.ids
|
||||||
getPlan(id).then(response => {
|
getPlan(id).then(response => {
|
||||||
this.form = response.data;
|
this.form = response.data;
|
||||||
this.form.type += '';
|
|
||||||
this.form.level += '';
|
|
||||||
this.open = true;
|
this.open = true;
|
||||||
this.title = "修改警报计划";
|
this.title = "修改警报计划";
|
||||||
});
|
});
|
||||||
|
@ -321,6 +265,7 @@ export default {
|
||||||
this.getList();
|
this.getList();
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
|
this.form.type = this.clickNodeData.id;
|
||||||
addPlan(this.form).then(response => {
|
addPlan(this.form).then(response => {
|
||||||
this.$modal.msgSuccess("新增成功");
|
this.$modal.msgSuccess("新增成功");
|
||||||
this.open = false;
|
this.open = false;
|
||||||
|
@ -346,10 +291,18 @@ export default {
|
||||||
...this.queryParams
|
...this.queryParams
|
||||||
}, `plan_${new Date().getTime()}.xlsx`)
|
}, `plan_${new Date().getTime()}.xlsx`)
|
||||||
},
|
},
|
||||||
/** 字典翻译 */
|
handleNodeClick(data) {
|
||||||
dictAlertPlanTypeFormat(){
|
this.clickNodeData = data;
|
||||||
|
this.queryParams.type = data.id;
|
||||||
}
|
this.handleQuery();
|
||||||
}
|
},
|
||||||
|
getPlanTypeTree() {
|
||||||
|
planTypeTreeSelect().then(response => {
|
||||||
|
this.clickNodeData = response.data[0].children[0];
|
||||||
|
this.queryParams.type = response.data[0].children[0].id;
|
||||||
|
this.getList();
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
@ -0,0 +1,200 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<el-tree
|
||||||
|
:data="planTypeOptions"
|
||||||
|
node-key="id"
|
||||||
|
:props="defaultProps"
|
||||||
|
:filter-node-method="filterNode"
|
||||||
|
@node-click="handleNodeClick"
|
||||||
|
:expand-on-click-node="false"
|
||||||
|
ref="tree"
|
||||||
|
default-expand-all
|
||||||
|
highlight-current
|
||||||
|
>
|
||||||
|
<template #default="{ node, data }">
|
||||||
|
<div class="custom-tree-node">
|
||||||
|
<span>{{ data.label }}</span>
|
||||||
|
<span class="custom-tree-node-btns">
|
||||||
|
<el-button
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-plus"
|
||||||
|
@click="handleAdd(node, data)"
|
||||||
|
></el-button>
|
||||||
|
<el-button
|
||||||
|
type="text"
|
||||||
|
icon="el-icon-minus"
|
||||||
|
@click="handleDelete(node, data)"
|
||||||
|
></el-button>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</el-tree>
|
||||||
|
|
||||||
|
<!-- 新增节点对话框 -->
|
||||||
|
<el-dialog
|
||||||
|
title="新增节点"
|
||||||
|
:visible.sync="dialogVisible">
|
||||||
|
<el-form :model="form" label-width="auto">
|
||||||
|
<el-form-item label="类型名称">
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-input v-model="form.label"/>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="节点类型">
|
||||||
|
<el-row>
|
||||||
|
<el-col :span="8">
|
||||||
|
<el-select v-model="form.addType">
|
||||||
|
<el-option
|
||||||
|
v-for="item in [{label: '同级',value: true},{label: '子级',value: false},]"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"/>
|
||||||
|
</el-select>
|
||||||
|
</el-col>
|
||||||
|
</el-row>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="dialogVisible = false">取消</el-button>
|
||||||
|
<el-button type="primary" @click="confirmAdd">确定</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
|
||||||
|
<!-- 删除确认框 -->
|
||||||
|
<el-dialog
|
||||||
|
title="确认删除"
|
||||||
|
:visible.sync="deleteDialogVisible"
|
||||||
|
>
|
||||||
|
<span>确定删除节点 "{{ selectedNodeLabel }}" 吗?</span>
|
||||||
|
<div slot="footer" class="dialog-footer">
|
||||||
|
<el-button @click="deleteDialogVisible = false">取消</el-button>
|
||||||
|
<el-button type="danger" @click="confirmDelete">删除</el-button>
|
||||||
|
</div>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {addType, delType, planTypeTreeSelect} from "@/api/board/plantype";
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "PlanTypeTree",
|
||||||
|
watch: {
|
||||||
|
// 根据名称筛选部门树
|
||||||
|
searchValue(val) {
|
||||||
|
this.$refs.tree.filter(val);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
searchValue: {
|
||||||
|
type: String,
|
||||||
|
default: "",
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
planTypeOptions: undefined,
|
||||||
|
treeData: [],
|
||||||
|
dialogVisible: false,
|
||||||
|
deleteDialogVisible: false,
|
||||||
|
form: {
|
||||||
|
label: "",
|
||||||
|
addType: true,
|
||||||
|
selectedNodeId: 0,
|
||||||
|
selectedNodeLevel: 0,
|
||||||
|
selectedNodeParentId: 0,
|
||||||
|
},
|
||||||
|
parentNodeLabel: "",
|
||||||
|
selectedNode: null,
|
||||||
|
selectedNodeLabel: "",
|
||||||
|
defaultProps: {
|
||||||
|
children: "children",
|
||||||
|
label: "label",
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleAdd(node, data) {
|
||||||
|
this.selectedNode = node;
|
||||||
|
this.parentNodeLabel = data.label;
|
||||||
|
this.dialogVisible = true;
|
||||||
|
},
|
||||||
|
confirmAdd() {
|
||||||
|
let addObj = {
|
||||||
|
typeName: this.form.label,
|
||||||
|
parentId: this.form.selectedNodeId,
|
||||||
|
}
|
||||||
|
if (this.form.addType === true) {
|
||||||
|
addObj.parentId = this.form.selectedNodeLevel === 1 ? 0 : this.form.selectedNodeParentId;
|
||||||
|
}
|
||||||
|
addType(addObj).then(resp => {
|
||||||
|
this.$modal.msgSuccess("新增成功");
|
||||||
|
this.getPlanTypeTree();
|
||||||
|
})
|
||||||
|
this.dialogVisible = false;
|
||||||
|
|
||||||
|
},
|
||||||
|
handleDelete(node, data) {
|
||||||
|
this.selectedNode = node;
|
||||||
|
this.selectedNodeLabel = data.label;
|
||||||
|
this.deleteDialogVisible = true;
|
||||||
|
},
|
||||||
|
confirmDelete() {
|
||||||
|
delType(this.form.selectedNodeId).then(resp => {
|
||||||
|
this.$modal.msgSuccess("删除成功");
|
||||||
|
this.getPlanTypeTree();
|
||||||
|
})
|
||||||
|
this.deleteDialogVisible = false;
|
||||||
|
},
|
||||||
|
handleNodeClick(data, node) {
|
||||||
|
if (node.level < 2) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.$emit('node-clicked', data);
|
||||||
|
this.form.selectedNodeId = data.id;
|
||||||
|
this.form.selectedNodeLevel = node.level;
|
||||||
|
if (node.level === 1) {
|
||||||
|
this.form.selectedNodeParentId = 0;
|
||||||
|
} else {
|
||||||
|
this.form.selectedNodeParentId = node.parent.data.id;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/** 查询类型下拉树结构 */
|
||||||
|
getPlanTypeTree() {
|
||||||
|
planTypeTreeSelect().then(response => {
|
||||||
|
this.planTypeOptions = response.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 筛选节点
|
||||||
|
filterNode(value, data) {
|
||||||
|
if (!value) return true;
|
||||||
|
return data.label.indexOf(value) !== -1;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.getPlanTypeTree();
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.custom-tree-node {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-tree-node-btns {
|
||||||
|
display: none;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.custom-tree-node:hover .custom-tree-node-btns {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
</style>
|
|
@ -1,33 +1,34 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="app-container">
|
<div class="app-container">
|
||||||
<el-row :gutter="20">
|
<h1>瓷器活发布系统</h1>
|
||||||
<!--部门数据-->
|
<!-- <el-row :gutter="20">-->
|
||||||
<el-col :span="4" :xs="24">
|
<!-- <!–部门数据–>-->
|
||||||
<div class="head-container">
|
<!-- <el-col :span="4" :xs="24">-->
|
||||||
<el-input
|
<!-- <div class="head-container">-->
|
||||||
v-model="deptName"
|
<!-- <el-input-->
|
||||||
placeholder="请输入部门名称"
|
<!-- v-model="deptName"-->
|
||||||
clearable
|
<!-- placeholder="请输入部门名称"-->
|
||||||
size="small"
|
<!-- clearable-->
|
||||||
prefix-icon="el-icon-search"
|
<!-- size="small"-->
|
||||||
style="margin-bottom: 20px"
|
<!-- prefix-icon="el-icon-search"-->
|
||||||
/>
|
<!-- style="margin-bottom: 20px"-->
|
||||||
</div>
|
<!-- />-->
|
||||||
<div class="head-container">
|
<!-- </div>-->
|
||||||
<el-tree
|
<!-- <div class="head-container">-->
|
||||||
:data="deptOptions"
|
<!-- <el-tree-->
|
||||||
:props="defaultProps"
|
<!-- :data="deptOptions"-->
|
||||||
:expand-on-click-node="false"
|
<!-- :props="defaultProps"-->
|
||||||
:filter-node-method="filterNode"
|
<!-- :expand-on-click-node="false"-->
|
||||||
ref="tree"
|
<!-- :filter-node-method="filterNode"-->
|
||||||
node-key="id"
|
<!-- ref="tree"-->
|
||||||
default-expand-all
|
<!-- node-key="id"-->
|
||||||
highlight-current
|
<!-- default-expand-all-->
|
||||||
@node-click="handleNodeClick"
|
<!-- highlight-current-->
|
||||||
/>
|
<!-- @node-click="handleNodeClick"-->
|
||||||
</div>
|
<!-- />-->
|
||||||
</el-col>
|
<!-- </div>-->
|
||||||
</el-row>
|
<!-- </el-col>-->
|
||||||
|
<!-- </el-row>-->
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
|
@ -9,7 +9,7 @@ const CompressionPlugin = require('compression-webpack-plugin')
|
||||||
|
|
||||||
const name = process.env.VUE_APP_TITLE || '瓷器活发布系统' // 网页标题
|
const name = process.env.VUE_APP_TITLE || '瓷器活发布系统' // 网页标题
|
||||||
|
|
||||||
const port = process.env.port || process.env.npm_config_port || 80 // 端口
|
const port = process.env.port || process.env.npm_config_port || 8888 // 端口
|
||||||
|
|
||||||
// vue.config.js 配置说明
|
// vue.config.js 配置说明
|
||||||
//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
|
//官方vue.config.js 参考文档 https://cli.vuejs.org/zh/config/#css-loaderoptions
|
||||||
|
|
Loading…
Reference in New Issue