ehs_tanghHe
/
tanghe-report
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update

Browse Source
qianlishi 3 years ago
parent 4a6cd7a282
commit 04472426f2
21 changed files with 856 additions and 705 deletions
Show Stats Download Patch File Download Diff File

71
report-ui/src/views/accessRole/components/RoleAuthority.vue
Unescape Escape View File

@ -1,6 +1,21 @@
<template> <template>
<el-dialog class="tree_dialog" title="为角色分配权限" width="60%" :close-on-click-modal="false" center :visible.sync="visib" :before-close="closeDialog"> <el-dialog
<el-tree ref="roleTree" :data="treeData" show-checkbox node-key="id" default-expand-all :default-checked-keys="checkedKeys" /> class="tree_dialog"
title="为角色分配权限"
width="60%"
:close-on-click-modal="false"
center
:visible.sync="visib"
:before-close="closeDialog"
>
<el-tree
ref="roleTree"
:data="treeData"
show-checkbox
node-key="id"
default-expand-all
:default-checked-keys="checkedKeys"
/>
<div slot="footer" style="text-align: center"> <div slot="footer" style="text-align: center">
<el-button type="primary" plain @click="saveTreeData">保存</el-button> <el-button type="primary" plain @click="saveTreeData">保存</el-button>
<el-button type="danger" plain @click="closeDialog">取消</el-button> <el-button type="danger" plain @click="closeDialog">取消</el-button>
@ -8,63 +23,63 @@
</el-dialog> </el-dialog>
</template> </template>
<script> <script>
import { accessRoleAuthorityTree, saveAuthorityTree } from '@/api/accessRole' import { accessRoleAuthorityTree, saveAuthorityTree } from "@/api/accessRole";
export default { export default {
props: { props: {
visib: { visib: {
required: true, required: true,
type: Boolean, type: Boolean,
default: false, default: false
}, },
roleCode: { roleCode: {
required: true, required: true,
type: String, type: String,
default: () => { default: () => {
return '' return "";
}, }
}, }
}, },
data() { data() {
return { return {
checkedKeys: [], // 当前选中的keys checkedKeys: [], // 当前选中的keys
treeData: [], // 所有的树结点 treeData: [] // 所有的树结点
} };
}, },
watch: { watch: {
visib(val) { visib(val) {
if (val) { if (val) {
// 弹窗弹出时需要执行的逻辑 // 弹窗弹出时需要执行的逻辑
console.log(1) console.log(1);
this.getTreeData() this.getTreeData();
} }
}, }
}, },
created() {}, created() {},
methods: { methods: {
// 获取所有的树形结构数据 // 获取所有的树形结构数据
async getTreeData() { async getTreeData() {
const { code, data } = await accessRoleAuthorityTree(this.roleCode) const { code, data } = await accessRoleAuthorityTree(this.roleCode);
if (code != '200') return if (code != "200") return;
this.treeData = data.treeData this.treeData = data.treeData;
this.checkedKeys = data.checkedKeys this.checkedKeys = data.checkedKeys;
}, },
async saveTreeData() { async saveTreeData() {
var params = { let params = {
roleCode: this.roleCode, roleCode: this.roleCode,
authorityList: this.$refs.roleTree.getCheckedKeys(true), authorityList: this.$refs.roleTree.getCheckedKeys(true)
} };
const { code } = await saveAuthorityTree(params) const { code } = await saveAuthorityTree(params);
if (code != '200') return if (code != "200") return;
this.closeDialog() this.closeDialog();
}, },
// 弹窗关闭之前需要执行的逻辑 // 弹窗关闭之前需要执行的逻辑
closeDialog() { closeDialog() {
this.treeData = [] this.treeData = [];
this.checkedKeys = [] this.checkedKeys = [];
this.$emit('handleClose') this.$emit("handleClose");
}, }
}, }
} };
</script> </script>

79
report-ui/src/views/accessUser/components/UserRole.vue
Unescape Escape View File

@ -1,6 +1,29 @@
<!--
* @Descripttion:
* @version:
* @Author: qianlishi
* @Date: 2021-12-11 14:48:27
* @LastEditors: qianlishi
* @LastEditTime: 2021-12-13 10:22:51
-->
<template> <template>
<el-dialog class="tree_dialog" title="为用户分配角色" width="60%" :close-on-click-modal="false" center :visible.sync="visib" :before-close="closeDialog"> <el-dialog
<el-tree ref="roleTree" :data="treeData" show-checkbox node-key="id" default-expand-all :default-checked-keys="checkedKeys" /> class="tree_dialog"
title="为用户分配角色"
width="60%"
:close-on-click-modal="false"
center
:visible.sync="visib"
:before-close="closeDialog"
>
<el-tree
ref="roleTree"
:data="treeData"
show-checkbox
node-key="id"
default-expand-all
:default-checked-keys="checkedKeys"
/>
<div slot="footer" style="text-align: center"> <div slot="footer" style="text-align: center">
<el-button type="primary" plain @click="saveTreeData">保存</el-button> <el-button type="primary" plain @click="saveTreeData">保存</el-button>
<el-button type="danger" plain @click="closeDialog">取消</el-button> <el-button type="danger" plain @click="closeDialog">取消</el-button>
@ -8,63 +31,63 @@
</el-dialog> </el-dialog>
</template> </template>
<script> <script>
import { getRoleTree, saveRoleTree } from '@/api/accessUser' import { getRoleTree, saveRoleTree } from "@/api/accessUser";
export default { export default {
props: { props: {
visib: { visib: {
required: true, required: true,
type: Boolean, type: Boolean,
default: false, default: false
}, },
loginName: { loginName: {
required: true, required: true,
type: String, type: String,
default: () => { default: () => {
return '' return "";
}, }
}, }
}, },
data() { data() {
return { return {
checkedKeys: [], // 当前选中的keys checkedKeys: [], // 当前选中的keys
treeData: [], // 所有的树结点 treeData: [] // 所有的树结点
} };
}, },
watch: { watch: {
visib(val) { visib(val) {
if (val) { if (val) {
// 弹窗弹出时需要执行的逻辑 // 弹窗弹出时需要执行的逻辑
console.log(1) console.log(1);
this.getTreeData() this.getTreeData();
} }
}, }
}, },
created() {}, created() {},
methods: { methods: {
// 获取所有的树形结构数据 // 获取所有的树形结构数据
async getTreeData() { async getTreeData() {
const { code, data } = await getRoleTree(this.loginName) const { code, data } = await getRoleTree(this.loginName);
if (code != '200') return if (code != "200") return;
this.treeData = data.treeData this.treeData = data.treeData;
this.checkedKeys = data.checkedKeys this.checkedKeys = data.checkedKeys;
}, },
async saveTreeData() { async saveTreeData() {
var params = { let params = {
loginName: this.loginName, loginName: this.loginName,
roleCodeList: this.$refs.roleTree.getCheckedKeys(true), roleCodeList: this.$refs.roleTree.getCheckedKeys(true)
} };
const { code } = await saveRoleTree(params) const { code } = await saveRoleTree(params);
if (code != '200') return if (code != "200") return;
this.closeDialog() this.closeDialog();
}, },
// 弹窗关闭之前需要执行的逻辑 // 弹窗关闭之前需要执行的逻辑
closeDialog() { closeDialog() {
this.treeData = [] this.treeData = [];
this.checkedKeys = [] this.checkedKeys = [];
this.$emit('handleClose') this.$emit("handleClose");
}, }
}, }
} };
</script> </script>

223
report-ui/src/views/dict/index.vue
Unescape Escape View File

@ -1,13 +1,28 @@
<template> <template>
<anji-crud ref="listPage" :option="crudOption"> <anji-crud ref="listPage" :option="crudOption">
<template v-slot:buttonLeftOnTable> <template v-slot:buttonLeftOnTable>
<el-button type="primary" icon="el-icon-edit" @click="dictRefresh" v-permission="'dictManage:fresh'">刷新字典项 <el-button
type="primary"
icon="el-icon-edit"
@click="dictRefresh"
v-permission="'dictManage:fresh'"
>刷新字典项
</el-button> </el-button>
</template> </template>
<template slot="rowButton" slot-scope="props"> <template slot="rowButton" slot-scope="props">
<el-button type="text" @click="editItem(props)" v-permission="'dictItemManage:query'">编辑字典项</el-button> <el-button
<el-button type="text" @click="itemRefresh(props)" v-permission="'dictManage:fresh'">刷新字典项</el-button> type="text"
@click="editItem(props)"
v-permission="'dictItemManage:query'"
>编辑字典项</el-button
>
<el-button
type="text"
@click="itemRefresh(props)"
v-permission="'dictManage:fresh'"
>刷新字典项</el-button
>
</template> </template>
<!--自定义的卡片插槽，将在编辑详情页面，出现在底部新卡片--> <!--自定义的卡片插槽，将在编辑详情页面，出现在底部新卡片-->
@ -29,184 +44,192 @@
</anji-crud> </anji-crud>
</template> </template>
<script> <script>
import {dictDetail, getDictList, dictAdd, dictEdit, dictsDelect, freshDict} from '@/api/dict' import {
dictDetail,
getDictList,
dictAdd,
dictEdit,
dictsDelect,
freshDict
} from "@/api/dict";
export default { export default {
name: 'Dict', name: "Dict",
components: { components: {
anjiCrud: require('@/components/AnjiPlus/anji-crud/anji-crud').default, anjiCrud: require("@/components/AnjiPlus/anji-crud/anji-crud").default
}, },
data() { data() {
const that = this const that = this;
return { return {
crudOption: { crudOption: {
// 使用菜单做为页面标题 // 使用菜单做为页面标题
title: '数据字典', title: "数据字典",
// 详情页中输入框左边文字宽度 // 详情页中输入框左边文字宽度
labelWidth: '120px', labelWidth: "120px",
// 查询表单条件 // 查询表单条件
queryFormFields: [ queryFormFields: [
{ {
inputType: 'input', inputType: "input",
label: '字典名称', label: "字典名称",
field: 'dictName', field: "dictName"
}, },
{ {
inputType: 'input', inputType: "input",
label: '字典编码', label: "字典编码",
field: 'dictCode', field: "dictCode"
}, }
], ],
queryFormChange(queryForm, fileName, fileval) { queryFormChange(queryForm, fileName, fileval) {
if (queryForm['project']) { if (queryForm["project"]) {
that.$store.commit('user/SET_PROJECT', queryForm['project']) that.$store.commit("user/SET_PROJECT", queryForm["project"]);
} }
}, },
// 操作按钮 // 操作按钮
buttons: { buttons: {
query: { query: {
api: getDictList, api: getDictList,
permission: 'dictManage:query', permission: "dictManage:query"
}, },
queryByPrimarykey: { queryByPrimarykey: {
api: dictDetail, api: dictDetail,
permission: 'dictManage:query', permission: "dictManage:query"
}, },
add: { add: {
api: dictAdd, api: dictAdd,
permission: 'dictManage:insert', permission: "dictManage:insert"
}, },
delete: { delete: {
api: dictsDelect, api: dictsDelect,
permission: 'dictManage:delete', permission: "dictManage:delete"
}, },
edit: { edit: {
api: dictEdit, api: dictEdit,
permission: 'dictManage:update', permission: "dictManage:update"
}, },
// 自定义按钮 // 自定义按钮
customButton: { customButton: {
operationWidth: 240, // row自定义按钮表格宽度 operationWidth: 240 // row自定义按钮表格宽度
}, }
}, },
// 表格列 // 表格列
columns: [ columns: [
{ {
label: '', label: "",
field: 'id', field: "id",
primaryKey: true, // 根据主键查询详情或者根据主键删除时, 主键的 primaryKey: true, // 根据主键查询详情或者根据主键删除时, 主键的
tableHide: true, // 表格中不显示 tableHide: true, // 表格中不显示
editHide: true, // 编辑弹框中不显示 editHide: true // 编辑弹框中不显示
}, },
{ {
label: '字典名称', // 字典名称 label: "字典名称", // 字典名称
placeholder: '', placeholder: "",
field: 'dictName', field: "dictName",
editField: 'dictName', editField: "dictName",
inputType: 'input', inputType: "input",
rules: [ rules: [
{required: true, message: '字典名称不能为空', trigger: 'blur'}, { required: true, message: "字典名称不能为空", trigger: "blur" },
{min: 1, max: 64, message: '不超过64个字符', trigger: 'blur'}, { min: 1, max: 64, message: "不超过64个字符", trigger: "blur" }
], ],
disabled: false, disabled: false
}, },
{ {
label: '字典编码', // 字典编码 label: "字典编码", // 字典编码
placeholder: '', placeholder: "",
field: 'dictCode', field: "dictCode",
editField: 'dictCode', editField: "dictCode",
inputType: 'input', inputType: "input",
rules: [ rules: [
{required: true, message: '字典编码不能为空', trigger: 'blur'}, { required: true, message: "字典编码不能为空", trigger: "blur" },
{min: 1, max: 64, message: '不超过64个字符', trigger: 'blur'}, { min: 1, max: 64, message: "不超过64个字符", trigger: "blur" }
], ],
disabled: 'disableOnEdit', disabled: "disableOnEdit"
}, },
{ {
label: '描述', // 描述 label: "描述", // 描述
placeholder: '', placeholder: "",
field: 'remark', field: "remark",
editField: 'remark', editField: "remark",
inputType: 'input', inputType: "input",
rules: [{min: 1, max: 64, message: '不超过64个字符', trigger: 'blur'}], rules: [
disabled: false, { min: 1, max: 64, message: "不超过64个字符", trigger: "blur" }
],
disabled: false
}, },
{ {
label: '创建时间', label: "创建时间",
placeholder: '', placeholder: "",
field: 'createTime', field: "createTime",
editField: 'createTime', editField: "createTime",
inputType: 'input', inputType: "input",
disabled: false, disabled: false,
editHide: true, // 编辑弹框中不显示 editHide: true // 编辑弹框中不显示
}, },
{ {
label: '创建人', label: "创建人",
placeholder: '', placeholder: "",
field: 'createBy', field: "createBy",
editField: 'createBy', editField: "createBy",
inputType: 'input', inputType: "input",
disabled: false, disabled: false,
editHide: true, // 编辑弹框中不显示 editHide: true // 编辑弹框中不显示
}, },
{ {
label: '更新时间', label: "更新时间",
placeholder: '', placeholder: "",
field: 'updateTime', field: "updateTime",
editField: 'updateTime', editField: "updateTime",
inputType: 'input', inputType: "input",
disabled: false, disabled: false,
editHide: true, // 编辑弹框中不显示 editHide: true // 编辑弹框中不显示
}, },
{ {
label: '更新人', label: "更新人",
placeholder: '', placeholder: "",
field: 'updateBy', field: "updateBy",
editField: 'updateBy', editField: "updateBy",
inputType: 'input', inputType: "input",
disabled: false, disabled: false,
editHide: true, // 编辑弹框中不显示 editHide: true // 编辑弹框中不显示
}, }
], ]
}, }
} };
}, },
created() { created() {},
},
methods: { methods: {
// 刷新当前面字典 // 刷新当前面字典
async dictRefresh() { async dictRefresh() {
var checkRecords = this.$refs.listPage.checkRecords let checkRecords = this.$refs.listPage.checkRecords;
var dictCodes = [] let dictCodes = [];
if (checkRecords.length > 0) { if (checkRecords.length > 0) {
dictCodes = checkRecords.map((item) => item.dictCode) dictCodes = checkRecords.map(item => item.dictCode);
} }
const {code} = await freshDict(dictCodes) const { code } = await freshDict(dictCodes);
if (code != '200') return if (code != "200") return;
this.$message.success('刷新成功') this.$message.success("刷新成功");
}, },
// 刷新某个字典 // 刷新某个字典
async itemRefresh(val) { async itemRefresh(val) {
const selectedList = val.msg const selectedList = val.msg;
let dictCodes = [] let dictCodes = [];
if (selectedList.length > 0) { if (selectedList.length > 0) {
dictCodes = selectedList.map((item) => item.dictCode) dictCodes = selectedList.map(item => item.dictCode);
} }
const {code} = await freshDict(dictCodes) const { code } = await freshDict(dictCodes);
if (code != '200') return if (code != "200") return;
this.$message.success('刷新成功') this.$message.success("刷新成功");
}, },
// 编辑字典项 // 编辑字典项
editItem(val) { editItem(val) {
this.$router.push({ this.$router.push({
path: '/system/dictItem', path: "/system/dictItem",
query: { query: {
dictCode: val.msg.dictCode, dictCode: val.msg.dictCode,
project: this.$store.state.user.project, project: this.$store.state.user.project
}, }
}) });
}, }
}, }
} };
</script> </script>

2
report-ui/src/views/file-management/index.vue
Unescape Escape View File

@ -239,7 +239,7 @@ export default {
}); });
}, },
copyToClip(content, message) { copyToClip(content, message) {
var aux = document.createElement("input"); let aux = document.createElement("input");
aux.setAttribute("value", content); aux.setAttribute("value", content);
document.body.appendChild(aux); document.body.appendChild(aux);
aux.select(); aux.select();

201
report-ui/src/views/layout/components/Navbar.vue
Unescape Escape View File

@ -1,27 +1,24 @@
<template> <template>
<div> <div>
<el-menu class="navbar" <el-menu class="navbar" mode="horizontal">
mode="horizontal"> <hamburger
<hamburger :toggle-click="toggleSideBar" :toggle-click="toggleSideBar"
:is-active="sidebar.opened" :is-active="sidebar.opened"
class="hamburger-container" /> class="hamburger-container"
/>
<breadcrumb /> <breadcrumb />
<el-dropdown class="avatar-container" <el-dropdown class="avatar-container" trigger="click">
trigger="click">
<div class="avatar-wrapper"> <div class="avatar-wrapper">
<i class="icon iconfont iconyonghu user" /> <i class="icon iconfont iconyonghu user" />
<span class="user-name">{{ operatorText }}</span> <span class="user-name">{{ operatorText }}</span>
<i class="el-icon-caret-bottom" /> <i class="el-icon-caret-bottom" />
</div> </div>
<el-dropdown-menu slot="dropdown" <el-dropdown-menu slot="dropdown" class="user-dropdown">
class="user-dropdown">
<el-dropdown-item divided> <el-dropdown-item divided>
<span style="display:block;" <span style="display:block;" @click="updatePassword">修改密码</span>
@click="updatePassword">修改密码</span>
</el-dropdown-item> </el-dropdown-item>
<el-dropdown-item divided> <el-dropdown-item divided>
<span style="display:block;" <span style="display:block;" @click="logout">注销登录</span>
@click="logout">注销登录</span>
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
@ -31,152 +28,174 @@
title="修改密码" title="修改密码"
:visible.sync="wordVisible" :visible.sync="wordVisible"
width="40%" width="40%"
:close-on-click-modal='false' :close-on-click-modal="false"
top="20vh" top="20vh"
class="password-box" class="password-box"
> >
<el-form ref="form" :model="form" label-width="100px" :rules="rules" :close-on-click-modal="false"> <el-form
ref="form"
:model="form"
label-width="100px"
:rules="rules"
:close-on-click-modal="false"
>
<el-form-item label="原密码" prop="oldPassword"> <el-form-item label="原密码" prop="oldPassword">
<el-input v-model.trim="form.oldPassword" type="password" autocomplete="off"></el-input> <el-input
v-model.trim="form.oldPassword"
type="password"
autocomplete="off"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="新密码" prop="password"> <el-form-item label="新密码" prop="password">
<el-input v-model.trim="form.password" type="password" autocomplete="off"></el-input> <el-input
v-model.trim="form.password"
type="password"
autocomplete="off"
></el-input>
<!-- <span class="password-tips"><i class="el-icon-warning-outline"> 密码至少8位,切包含大写、小写字母、数字、特殊字符中的3种</i></span> --> <!-- <span class="password-tips"><i class="el-icon-warning-outline"> 密码至少8位,切包含大写、小写字母、数字、特殊字符中的3种</i></span> -->
</el-form-item> </el-form-item>
<el-form-item label="确认新密码" prop="confirmPassword"> <el-form-item label="确认新密码" prop="confirmPassword">
<el-input v-model.trim="form.confirmPassword" type="password" autocomplete="off"></el-input> <el-input
v-model.trim="form.confirmPassword"
type="password"
autocomplete="off"
></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
<span slot="footer" class="dialog-footer"> <span slot="footer" class="dialog-footer">
<el-button @click="wordVisible = false">取 消</el-button> <el-button @click="wordVisible = false">取 消</el-button>
<el-button type="primary" @click="confrimUpdate">确 定</el-button> <el-button type="primary" @click="confrimUpdate">确 定</el-button>
</span> </span>
</el-dialog> </el-dialog>
</div> </div>
</template> </template>
<script> <script>
import { mapGetters } from 'vuex' import { mapGetters } from "vuex";
import Breadcrumb from '@/components/Breadcrumb' import Breadcrumb from "@/components/Breadcrumb";
import Hamburger from '@/components/Hamburger' import Hamburger from "@/components/Hamburger";
import { getStorageItem } from '@/utils/storage' import { getStorageItem } from "@/utils/storage";
import { reqUpdatePassword } from '@/api/login' import { reqUpdatePassword } from "@/api/login";
import { transPsw } from '@/utils/encrypted' import { transPsw } from "@/utils/encrypted";
export default { export default {
data () { data() {
// 确认密码 // 确认密码
var validatePass3 = (rule, value, callback) => { let validatePass3 = (rule, value, callback) => {
if (value === '') { if (value === "") {
callback(new Error('请再次输入密码')) callback(new Error("请再次输入密码"));
} else if (value !== this.form.password) { } else if (value !== this.form.password) {
callback(new Error('两次输入密码不一致!')) callback(new Error("两次输入密码不一致!"));
} else if (value.length < 6 || value.length > 20) { } else if (value.length < 6 || value.length > 20) {
callback(new Error('密码长度需要再6-20之间!')); callback(new Error("密码长度需要再6-20之间!"));
} else { } else {
callback(); callback();
} }
} };
const validatePass = (rule, value, callback) => { const validatePass = (rule, value, callback) => {
if (!/^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_]+$)(?![a-z0-9]+$)(?![a-z\W_]+$)(?![0-9\W_]+$)[a-zA-Z0-9\W_]{6,}$/.test(value)) { if (
callback(new Error('请按要求输入密码')) !/^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_]+$)(?![a-z0-9]+$)(?![a-z\W_]+$)(?![0-9\W_]+$)[a-zA-Z0-9\W_]{6,}$/.test(
} else { value
callback() )
} ) {
callback(new Error("请按要求输入密码"));
} else {
callback();
}
}; };
const validateOldPass = (rule, value, callback) => { const validateOldPass = (rule, value, callback) => {
if (value.length < 6 || value.length > 30) { if (value.length < 6 || value.length > 30) {
callback(new Error('请输入原密码')) callback(new Error("请输入原密码"));
} else { } else {
callback() callback();
} }
} };
return { return {
wordVisible: false, //修改密码弹框 wordVisible: false, //修改密码弹框
form: { form: {
oldPassword: '', oldPassword: "",
password: '', password: "",
confirmPassword: '', confirmPassword: ""
}, },
rules: { rules: {
oldPassword: [ oldPassword: [
{ required: true, validator: validateOldPass, trigger: 'blur' }, { required: true, validator: validateOldPass, trigger: "blur" }
], ],
password: [ password: [
{ required: true, message: '请选择新密码', trigger: 'blur' }, { required: true, message: "请选择新密码", trigger: "blur" }
], ],
confirmPassword: [ confirmPassword: [
{ required: true, validator: validatePass3, trigger: 'blur' }, { required: true, validator: validatePass3, trigger: "blur" }
], ]
}, }
} };
}, },
components: { components: {
Breadcrumb, Breadcrumb,
Hamburger, Hamburger
}, },
computed: { computed: {
...mapGetters(['sidebar']), ...mapGetters(["sidebar"])
}, },
created () { }, created() {},
methods: { methods: {
toggleSideBar () { toggleSideBar() {
this.$store.dispatch('ToggleSideBar') this.$store.dispatch("ToggleSideBar");
}, },
logout () { logout() {
this.$confirm('确定要退出吗', '温馨提示', { this.$confirm("确定要退出吗", "温馨提示", {
confirmButtonText: '确定', confirmButtonText: "确定",
cancelButtonText: '取消', cancelButtonText: "取消",
type: 'warning', type: "warning"
}).then(() => { }).then(() => {
sessionStorage.clear() sessionStorage.clear();
localStorage.clear() localStorage.clear();
this.$router.push('/login') this.$router.push("/login");
}) });
}, },
// 修改密码 // 修改密码
updatePassword () { updatePassword() {
this.wordVisible = true this.wordVisible = true;
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.form && this.$refs.form.resetFields() this.$refs.form && this.$refs.form.resetFields();
}) });
}, },
// 发送请求 确认修改 // 发送请求 确认修改
confrimUpdate () { confrimUpdate() {
this.$refs.form.validate(async (valid) => { this.$refs.form.validate(async valid => {
if (valid) { if (valid) {
const {oldPassword, password, confirmPassword} = this.form const { oldPassword, password, confirmPassword } = this.form;
let data = { let data = {
oldPassword: transPsw(oldPassword), oldPassword: transPsw(oldPassword),
password: transPsw(password), password: transPsw(password),
confirmPassword: transPsw(confirmPassword), confirmPassword: transPsw(confirmPassword)
} };
const { code } = await reqUpdatePassword(data); const { code } = await reqUpdatePassword(data);
if (code != '200') return if (code != "200") return;
this.wordVisible = false this.wordVisible = false;
this.$message.success('修改密码成功,请重新登录') this.$message.success("修改密码成功,请重新登录");
sessionStorage.clear() sessionStorage.clear();
localStorage.clear() localStorage.clear();
this.$router.push('/login') this.$router.push("/login");
} else { } else {
return false return false;
} }
}) });
}, },
helpCenter () { helpCenter() {
let helpCategory = getStorageItem('helpCategory') let helpCategory = getStorageItem("helpCategory");
this.$router.push({ this.$router.push({
path: '/helpCenList/list', path: "/helpCenList/list",
query: { query: {
id: 0, id: 0,
val: helpCategory[0].value, val: helpCategory[0].value,
title: helpCategory[0].label, title: helpCategory[0].label
}, }
}) });
}, }
}, }
} };
</script> </script>
<style rel="stylesheet/scss" lang="scss" scoped> <style rel="stylesheet/scss" lang="scss" scoped>

8
report-ui/src/views/report/bigscreen/designer/designerComponents/customUpload.vue
Unescape Escape View File

@ -42,8 +42,8 @@ export default {
}, },
methods: { methods: {
getImages(el) { getImages(el) {
var file = el.target.files[0]; let file = el.target.files[0];
var type = file.type.split("/")[0]; let type = file.type.split("/")[0];
if (type === "image") { if (type === "image") {
this.upload(file); this.upload(file);
} else { } else {
@ -51,9 +51,9 @@ export default {
} }
}, },
upload(imgUrl) { upload(imgUrl) {
var that = this; let that = this;
console.log(that.headers); console.log(that.headers);
var formdata = new FormData(); let formdata = new FormData();
formdata.append("file", imgUrl); formdata.append("file", imgUrl);
axios axios
.post(this.requestUrl, formdata, { .post(this.requestUrl, formdata, {

4
report-ui/src/views/report/bigscreen/designer/designerComponents/dynamicForm.vue
Unescape Escape View File

@ -346,8 +346,8 @@ export default {
} }
this.$emit("onChanged", this.formData); this.$emit("onChanged", this.formData);
// key为当前用户操作的表单组件 // key为当前用户操作的表单组件
for (var i = 0; i < this.options.length; i++) { for (let i = 0; i < this.options.length; i++) {
var item = this.options[i]; let item = this.options[i];
if (item.relactiveDom == key) { if (item.relactiveDom == key) {
this.inputShow[item.name] = val == item.relactiveDomValue; this.inputShow[item.name] = val == item.relactiveDomValue;
this.inputShow = Object.assign({}, this.inputShow); this.inputShow = Object.assign({}, this.inputShow);

38
report-ui/src/views/report/bigscreen/designer/index.vue
Unescape Escape View File

@ -374,8 +374,8 @@ export default {
}; };
}, },
computed: { computed: {
step () { step() {
return Number(100 / (this.bigscreenScaleInWorkbench * 100)) return Number(100 / (this.bigscreenScaleInWorkbench * 100));
}, },
headers() { headers() {
return { return {
@ -384,14 +384,14 @@ export default {
}, },
// 左侧折叠切换时，动态计算中间区的宽度 // 左侧折叠切换时，动态计算中间区的宽度
middleWidth() { middleWidth() {
var widthLeftAndRight = 0; let widthLeftAndRight = 0;
if (this.toolIsShow) { if (this.toolIsShow) {
widthLeftAndRight += this.widthLeftForTools; // 左侧工具栏宽度 widthLeftAndRight += this.widthLeftForTools; // 左侧工具栏宽度
} }
widthLeftAndRight += this.widthLeftForToolsHideButton; // 左侧工具栏折叠按钮宽度 widthLeftAndRight += this.widthLeftForToolsHideButton; // 左侧工具栏折叠按钮宽度
widthLeftAndRight += this.widthLeftForOptions; // 右侧配置栏宽度 widthLeftAndRight += this.widthLeftForOptions; // 右侧配置栏宽度
var middleWidth = this.bodyWidth - widthLeftAndRight; let middleWidth = this.bodyWidth - widthLeftAndRight;
return middleWidth; return middleWidth;
}, },
middleHeight() { middleHeight() {
@ -399,9 +399,9 @@ export default {
}, },
// 设计台按大屏的缩放比例 // 设计台按大屏的缩放比例
bigscreenScaleInWorkbench() { bigscreenScaleInWorkbench() {
var widthScale = let widthScale =
(this.middleWidth - this.widthPaddingTools) / this.bigscreenWidth; (this.middleWidth - this.widthPaddingTools) / this.bigscreenWidth;
var heightScale = let heightScale =
(this.middleHeight - this.widthPaddingTools) / this.bigscreenHeight; (this.middleHeight - this.widthPaddingTools) / this.bigscreenHeight;
return Math.min(widthScale, heightScale); return Math.min(widthScale, heightScale);
}, },
@ -484,7 +484,7 @@ export default {
const widgets = data.dashboard ? data.dashboard.widgets : []; const widgets = data.dashboard ? data.dashboard.widgets : [];
const widgetsData = []; const widgetsData = [];
for (let i = 0; i < widgets.length; i++) { for (let i = 0; i < widgets.length; i++) {
var obj = {}; let obj = {};
obj.type = widgets[i].type; obj.type = widgets[i].type;
obj.value = { obj.value = {
setup: widgets[i].value.setup, setup: widgets[i].value.setup,
@ -561,7 +561,7 @@ export default {
}, },
// 预览 // 预览
viewScreen() { viewScreen() {
var routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: "/bigscreen/viewer", path: "/bigscreen/viewer",
query: { reportCode: this.$route.query.reportCode } query: { reportCode: this.$route.query.reportCode }
}); });
@ -579,7 +579,7 @@ export default {
const that = this; const that = this;
const type = res.type; const type = res.type;
if (type == "application/json") { if (type == "application/json") {
var reader = new FileReader(); let reader = new FileReader();
reader.readAsText(res, "utf-8"); reader.readAsText(res, "utf-8");
reader.onload = function() { reader.onload = function() {
const data = JSON.parse(reader.result); const data = JSON.parse(reader.result);
@ -633,23 +633,23 @@ export default {
// 拖动一个组件放到工作区中去，在拖动结束时，放到工作区对应的坐标点上去 // 拖动一个组件放到工作区中去，在拖动结束时，放到工作区对应的坐标点上去
widgetOnDragged(evt, widgetCode) { widgetOnDragged(evt, widgetCode) {
var widgetType = widgetCode; let widgetType = widgetCode;
// 获取结束坐标和列名 // 获取结束坐标和列名
var eventX = evt.originalEvent.clientX; // 结束在屏幕的x坐标 let eventX = evt.originalEvent.clientX; // 结束在屏幕的x坐标
var eventY = evt.originalEvent.clientY; // 结束在屏幕的y坐标 let eventY = evt.originalEvent.clientY; // 结束在屏幕的y坐标
var workbenchPosition = this.getDomTopLeftById("workbench"); let workbenchPosition = this.getDomTopLeftById("workbench");
var widgetTopInWorkbench = eventY - workbenchPosition.top; let widgetTopInWorkbench = eventY - workbenchPosition.top;
var widgetLeftInWorkbench = eventX - workbenchPosition.left; let widgetLeftInWorkbench = eventX - workbenchPosition.left;
// 计算在缩放模式下的x y // 计算在缩放模式下的x y
var x = widgetLeftInWorkbench / this.bigscreenScaleInWorkbench; let x = widgetLeftInWorkbench / this.bigscreenScaleInWorkbench;
var y = widgetTopInWorkbench / this.bigscreenScaleInWorkbench; let y = widgetTopInWorkbench / this.bigscreenScaleInWorkbench;
// 复制一个组件 // 复制一个组件
var tool = getToolByCode(widgetType); let tool = getToolByCode(widgetType);
var widgetJson = { let widgetJson = {
type: widgetType, type: widgetType,
value: { value: {
setup: {}, setup: {},

4
report-ui/src/views/report/bigscreen/designer/tools/index.js
Unescape Escape View File

@ -4,7 +4,7 @@
* @Author: qianlishi * @Author: qianlishi
* @Date: 2021-08-29 06:43:07 * @Date: 2021-08-29 06:43:07
* @LastEditors: qianlishi * @LastEditors: qianlishi
* @LastEditTime: 2021-08-29 08:00:59 * @LastEditTime: 2021-12-13 10:22:37
*/ */
import { widgetTool } from "./main" import { widgetTool } from "./main"
const screenConfig = { const screenConfig = {
@ -76,7 +76,7 @@ const getToolByCode = function (code) {
return screenConfig return screenConfig
} }
// 获取组件 // 获取组件
var item = widgetTools.find(function (item, index, arrs) { let item = widgetTools.find(function (item, index, arrs) {
return item.code === code return item.code === code
}) })
return item return item

370
report-ui/src/views/report/bigscreen/designer/widget/map/widgetAirBubbleMap.vue
Unescape Escape View File

@ -1,6 +1,6 @@
<template> <template>
<div :style="styleObj"> <div :style="styleObj">
<v-chart :options="options" autoresize/> <v-chart :options="options" autoresize />
</div> </div>
</template> </template>
<script> <script>
@ -8,42 +8,41 @@ import echarts from "echarts";
import "../../../../../../../node_modules/echarts/map/js/china.js"; import "../../../../../../../node_modules/echarts/map/js/china.js";
//https://www.makeapie.com/editor.html?c=x2yaz6dfRw //https://www.makeapie.com/editor.html?c=x2yaz6dfRw
//https://www.makeapie.com/editor.html?c=xMpGBbTEKU //https://www.makeapie.com/editor.html?c=xMpGBbTEKU
var geoCoordMap = { let geoCoordMap = {
'台湾': [121.5135, 25.0308], 台湾: [121.5135, 25.0308],
'黑龙江': [127.9688, 45.368], 黑龙江: [127.9688, 45.368],
'内蒙古': [110.3467, 41.4899], 内蒙古: [110.3467, 41.4899],
"吉林": [125.8154, 44.2584], 吉林: [125.8154, 44.2584],
'北京': [116.4551, 40.2539], 北京: [116.4551, 40.2539],
"辽宁": [123.1238, 42.1216], 辽宁: [123.1238, 42.1216],
"河北": [114.4995, 38.1006], 河北: [114.4995, 38.1006],
"天津": [117.4219, 39.4189], 天津: [117.4219, 39.4189],
"山西": [112.3352, 37.9413], 山西: [112.3352, 37.9413],
"陕西": [109.1162, 34.2004], 陕西: [109.1162, 34.2004],
"甘肃": [103.5901, 36.3043], 甘肃: [103.5901, 36.3043],
"宁夏": [106.3586, 38.1775], 宁夏: [106.3586, 38.1775],
"青海": [101.4038, 36.8207], 青海: [101.4038, 36.8207],
"新疆": [87.9236, 43.5883], 新疆: [87.9236, 43.5883],
"西藏": [91.11, 29.97], 西藏: [91.11, 29.97],
"四川": [103.9526, 30.7617], 四川: [103.9526, 30.7617],
"重庆": [108.384366, 30.439702], 重庆: [108.384366, 30.439702],
"山东": [117.1582, 36.8701], 山东: [117.1582, 36.8701],
"河南": [113.4668, 34.6234], 河南: [113.4668, 34.6234],
"江苏": [118.8062, 31.9208], 江苏: [118.8062, 31.9208],
"安徽": [117.29, 32.0581], 安徽: [117.29, 32.0581],
"湖北": [114.3896, 30.6628], 湖北: [114.3896, 30.6628],
"浙江": [119.5313, 29.8773], 浙江: [119.5313, 29.8773],
"福建": [119.4543, 25.9222], 福建: [119.4543, 25.9222],
"江西": [116.0046, 28.6633], 江西: [116.0046, 28.6633],
"湖南": [113.0823, 28.2568], 湖南: [113.0823, 28.2568],
"贵州": [106.6992, 26.7682], 贵州: [106.6992, 26.7682],
"云南": [102.9199, 25.4663], 云南: [102.9199, 25.4663],
"广东": [113.12244, 23.009505], 广东: [113.12244, 23.009505],
"广西": [108.479, 23.1152], 广西: [108.479, 23.1152],
"海南": [110.3893, 19.8516], 海南: [110.3893, 19.8516],
'上海': [121.4648, 31.2891], 上海: [121.4648, 31.2891]
}; };
var data = [ let data = [
{ {
name: "南海诸岛", name: "南海诸岛",
value: 1 value: 1
@ -183,12 +182,12 @@ var data = [
{ {
name: "澳门", name: "澳门",
value: 9 value: 9
}, }
]; ];
var convertData = function (data) { let convertData = function(data) {
var res = []; let res = [];
for (var i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
var geoCoord = geoCoordMap[data[i].name]; let geoCoord = geoCoordMap[data[i].name];
if (geoCoord) { if (geoCoord) {
res.push({ res.push({
name: data[i].name, name: data[i].name,
@ -198,9 +197,9 @@ var convertData = function (data) {
} }
return res; return res;
}; };
var max = 6000, let max = 6000,
min = 10; min = 10;
var maxSize4Pin = 100, let maxSize4Pin = 100,
minSize4Pin = 20; minSize4Pin = 20;
export default { export default {
@ -215,16 +214,28 @@ export default {
//backgroundColor: '#0F1C3C', //backgroundColor: '#0F1C3C',
tooltip: { tooltip: {
show: true, show: true,
formatter: function (params) { formatter: function(params) {
if (params.value.length > 1) { if (params.value.length > 1) {
return '&nbsp;&nbsp;' + params.name + '&nbsp;&nbsp;&nbsp;' + params.value[2] + '&nbsp;&nbsp;'; return (
"&nbsp;&nbsp;" +
params.name +
"&nbsp;&nbsp;&nbsp;" +
params.value[2] +
"&nbsp;&nbsp;"
);
} else { } else {
return '&nbsp;&nbsp;' + params.name + '&nbsp;&nbsp;&nbsp;' + params.value + '&nbsp;&nbsp;'; return (
"&nbsp;&nbsp;" +
params.name +
"&nbsp;&nbsp;&nbsp;" +
params.value +
"&nbsp;&nbsp;"
);
} }
}, }
}, },
geo: { geo: {
map: 'china', map: "china",
show: true, show: true,
roam: false, roam: false,
label: { label: {
@ -235,15 +246,25 @@ export default {
layoutSize: "80%", layoutSize: "80%",
itemStyle: { itemStyle: {
normal: { normal: {
borderColor: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{ borderColor: new echarts.graphic.LinearGradient(
offset: 0, 0,
color: '#00F6FF' 0,
}, { 0,
offset: 1, 1,
color: '#53D9FF' [
}], false), {
offset: 0,
color: "#00F6FF"
},
{
offset: 1,
color: "#53D9FF"
}
],
false
),
borderWidth: 3, borderWidth: 3,
shadowColor: 'rgba(10,76,139,1)', shadowColor: "rgba(10,76,139,1)",
shadowOffsetY: 0, shadowOffsetY: 0,
shadowBlur: 60 shadowBlur: 60
} }
@ -251,19 +272,20 @@ export default {
}, },
series: [ series: [
{ {
type: 'map', type: "map",
map: 'china', map: "china",
aspectScale: 0.75, aspectScale: 0.75,
label: { label: {
normal: {//调整数值 normal: {
position: 'right', //调整数值
position: "right",
show: true, show: true,
color: '#53D9FF', color: "#53D9FF",
fontSize: 20 fontSize: 20
}, },
emphasis: { emphasis: {
show: true, show: true
}, }
}, },
itemStyle: { itemStyle: {
normal: { normal: {
@ -273,16 +295,19 @@ export default {
y: 0, y: 0,
x2: 0, x2: 0,
y2: 1, y2: 1,
colorStops: [{ colorStops: [
offset: 0, {
color: '#073684' // 0% 处的颜色 offset: 0,
}, { color: "#073684" // 0% 处的颜色
offset: 1, },
color: '#061E3D' // 100% 处的颜色 {
}], offset: 1,
color: "#061E3D" // 100% 处的颜色
}
]
}, },
borderColor: '#215495', borderColor: "#215495",
borderWidth: 1, borderWidth: 1
}, },
//鼠标放置颜色加深 //鼠标放置颜色加深
emphasis: { emphasis: {
@ -291,81 +316,93 @@ export default {
y: 0, y: 0,
x2: 0, x2: 0,
y2: 1, y2: 1,
colorStops: [{ colorStops: [
offset: 0, {
color: '#073684' // 0% 处的颜色 offset: 0,
}, { color: "#073684" // 0% 处的颜色
offset: 1, },
color: '#2B91B7' // 100% 处的颜色 {
}], offset: 1,
}, color: "#2B91B7" // 100% 处的颜色
}
]
}
} }
}, },
data: data, data: data
}, },
{ {
type: 'effectScatter', type: "effectScatter",
coordinateSystem: 'geo', coordinateSystem: "geo",
rippleEffect: { rippleEffect: {
brushType: 'stroke' brushType: "stroke"
}, },
showEffectOn: 'render', showEffectOn: "render",
itemStyle: { itemStyle: {
normal: { normal: {
//气泡颜色 //气泡颜色
color: { color: {
type: 'radial', type: "radial",
x: 0.5, x: 0.5,
y: 0.5, y: 0.5,
r: 0.5, r: 0.5,
colorStops: [{ colorStops: [
offset: 0, {
color: 'rgba(5,80,151,0.2)' offset: 0,
}, { color: "rgba(5,80,151,0.2)"
offset: 0.8, },
color: 'rgba(5,80,151,0.8)' {
}, { offset: 0.8,
offset: 1, color: "rgba(5,80,151,0.8)"
color: 'rgba(0,108,255,0.7)' },
}], {
offset: 1,
color: "rgba(0,108,255,0.7)"
}
],
global: false global: false
}, }
} }
}, },
label: { label: {
normal: { normal: {
show: true, show: true,
color: '#fff', color: "#fff",
fontWeight: 'bold', fontWeight: "bold",
position: 'inside', position: "inside",
formatter: function (para) { formatter: function(para) {
return '{cnNum|' + para.data.value[2] + '}' return "{cnNum|" + para.data.value[2] + "}";
}, },
rich: { rich: {
cnNum: { cnNum: {
fontSize: 13, fontSize: 13,
color: '#D4EEFF', color: "#D4EEFF"
} }
} }
}, }
}, },
symbol: 'circle', symbol: "circle",
symbolSize: function (val) { symbolSize: function(val) {
if (val[2] == 0) { if (val[2] == 0) {
return 0; return 0;
} }
; return (
return ((maxSize4Pin - minSize4Pin) / (max - min)) * val[2] + (maxSize4Pin - ((maxSize4Pin - minSize4Pin) / (max - min)) * max) * 1.2; ((maxSize4Pin - minSize4Pin) / (max - min)) * val[2] +
(maxSize4Pin -
((maxSize4Pin - minSize4Pin) / (max - min)) * max) *
1.2
);
}, },
data: convertData(data), data: convertData(data),
zlevel: 1, zlevel: 1
}] }
]
}, },
optionsStyle: {}, // 样式 optionsStyle: {}, // 样式
optionsData: {}, // 数据 optionsData: {}, // 数据
optionsCollapse: {}, // 图标属性 optionsCollapse: {}, // 图标属性
optionsSetup: {} optionsSetup: {}
} };
}, },
computed: { computed: {
styleObj() { styleObj() {
@ -430,37 +467,40 @@ export default {
}, },
setOptionTextValue() { setOptionTextValue() {
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const label = this.options.series[0]['label']; const label = this.options.series[0]["label"];
const normal = { const normal = {
position: 'right', position: "right",
show: true, show: true,
color: optionsSetup.fontTextColor, color: optionsSetup.fontTextColor,
fontSize: optionsSetup.fontTextSize, fontSize: optionsSetup.fontTextSize,
fontWeight: optionsSetup.fontTextWeight, fontWeight: optionsSetup.fontTextWeight
}; };
label['normal'] = normal; label["normal"] = normal;
}, },
setOptionMapBlocak() { setOptionMapBlocak() {
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const itemStyle = this.options.series[0]['itemStyle']; const itemStyle = this.options.series[0]["itemStyle"];
const normal = { const normal = {
//地图块颜色 //地图块颜色
areaColor: { areaColor: {
x: 0, x: 0,
y: 0, y: 0,
x2: 0, x2: 0,
y2: 1, y2: 1,
colorStops: [{ colorStops: [
{
offset: 0, offset: 0,
color: optionsSetup.font0PreColor // 0% 处的颜色 color: optionsSetup.font0PreColor // 0% 处的颜色
}, { },
{
offset: 1, offset: 1,
color: optionsSetup.font100PreColor // 100% 处的颜色 color: optionsSetup.font100PreColor // 100% 处的颜色
}], }
}, ]
borderColor: '#215495', },
borderWidth: 1, borderColor: "#215495",
}; borderWidth: 1
};
//鼠标放置颜色加深 //鼠标放置颜色加深
const emphasis = { const emphasis = {
areaColor: { areaColor: {
@ -468,55 +508,55 @@ export default {
y: 0, y: 0,
x2: 0, x2: 0,
y2: 1, y2: 1,
colorStops: [{ colorStops: [
offset: 0, {
color: '#073684' // 0% 处的颜色 offset: 0,
}, { color: "#073684" // 0% 处的颜色
offset: 1, },
color: optionsSetup.fontHighlightColor // 100% 处的颜色 {
}], offset: 1,
}, color: optionsSetup.fontHighlightColor // 100% 处的颜色
}
]
}
}; };
itemStyle['normal'] = normal; itemStyle["normal"] = normal;
itemStyle['emphasis'] = emphasis; itemStyle["emphasis"] = emphasis;
}, },
setOptionAirSize() { setOptionAirSize() {
maxSize4Pin = this.optionsSetup.fontmaxSize4Pin maxSize4Pin = this.optionsSetup.fontmaxSize4Pin;
minSize4Pin = this.optionsSetup.fontminSize4Pin minSize4Pin = this.optionsSetup.fontminSize4Pin;
}, },
//数据解析 //数据解析
setOptionsData() { setOptionsData() {
const optionsData = this.optionsData; // 数据类型 静态 or 动态 const optionsData = this.optionsData; // 数据类型 静态 or 动态
optionsData.dataType == "staticData" optionsData.dataType == "staticData"
? this.staticDataFn(optionsData.staticData) ? this.staticDataFn(optionsData.staticData)
: this.dynamicDataFn( : this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
optionsData.dynamicData,
optionsData.refreshTime
);
}, },
staticDataFn(val) { staticDataFn(val) {
this.options.series[0]['data'] = val; this.options.series[0]["data"] = val;
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const label = this.options.series[1]['label']; const label = this.options.series[1]["label"];
const normal = { const normal = {
show: true, show: true,
color: '#fff', color: "#fff",
fontWeight: 'bold', fontWeight: "bold",
position: 'inside', position: "inside",
formatter: function (para) { formatter: function(para) {
return '{cnNum|' + para.data.value[2] + '}' return "{cnNum|" + para.data.value[2] + "}";
}, },
rich: { rich: {
cnNum: { cnNum: {
fontSize: optionsSetup.fontDataSize, fontSize: optionsSetup.fontDataSize,
color: optionsSetup.fontDataColor, color: optionsSetup.fontDataColor,
fontWeight: optionsSetup.fontDataWeight, fontWeight: optionsSetup.fontDataWeight
} }
} }
}; };
const data = convertData(val); const data = convertData(val);
this.options.series[1]['data']=data this.options.series[1]["data"] = data;
label['normal'] = normal label["normal"] = normal;
}, },
dynamicDataFn(val, refreshTime) { dynamicDataFn(val, refreshTime) {
if (!val) return; if (!val) return;
@ -536,28 +576,28 @@ export default {
}); });
}, },
renderingFn(val) { renderingFn(val) {
this.options.series[0]['data'] = val; this.options.series[0]["data"] = val;
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const label = this.options.series[1]['label']; const label = this.options.series[1]["label"];
const normal = { const normal = {
show: true, show: true,
color: '#fff', color: "#fff",
fontWeight: 'bold', fontWeight: "bold",
position: 'inside', position: "inside",
formatter: function (para) { formatter: function(para) {
return '{cnNum|' + para.data.value[2] + '}' return "{cnNum|" + para.data.value[2] + "}";
}, },
rich: { rich: {
cnNum: { cnNum: {
fontSize: optionsSetup.fontDataSize, fontSize: optionsSetup.fontDataSize,
color: optionsSetup.fontDataColor, color: optionsSetup.fontDataColor,
fontWeight: optionsSetup.fontDataWeight, fontWeight: optionsSetup.fontDataWeight
} }
} }
}; };
const data = convertData(val); const data = convertData(val);
this.options.series[1]['data']=data this.options.series[1]["data"] = data;
label['normal'] = normal label["normal"] = normal;
} }
} }
}; };

298
report-ui/src/views/report/bigscreen/designer/widget/percent/widgetPiePercentageChart.vue
Unescape Escape View File

@ -1,13 +1,13 @@
<template> <template>
<div :style="styleObj"> <div :style="styleObj">
<v-chart :options="options" autoresize/> <v-chart :options="options" autoresize />
</div> </div>
</template> </template>
<script> <script>
var per = 60; let per = 60;
export default { export default {
name: "widgetPiePercentageChart",//百分比图参考：https://www.makeapie.com/editor.html?c=xFkzKG-bpl name: "widgetPiePercentageChart", //百分比图参考：https://www.makeapie.com/editor.html?c=xFkzKG-bpl
components: {}, components: {},
props: { props: {
value: Object, value: Object,
@ -18,199 +18,204 @@ export default {
angle: 0, angle: 0,
options: { options: {
title: { title: {
text: '{nums|' + per + '}{percent|%}', text: "{nums|" + per + "}{percent|%}",
x: 'center', x: "center",
y: 'center', y: "center",
textStyle: { textStyle: {
rich: { rich: {
nums: { nums: {
fontSize: 60, fontSize: 60,
color: '#29EEF3', color: "#29EEF3"
}, },
percent: { percent: {
fontSize: 30, fontSize: 30,
color: '#29EEF3', color: "#29EEF3"
}, }
}, }
}, }
}, },
legend: { legend: {
type: 'plain', type: "plain",
orient: 'vertical', orient: "vertical",
right: 0, right: 0,
top: '10%', top: "10%",
align: 'auto', align: "auto",
data: [{ data: [
name: '1', {
icon: "circle" name: "1",
}, { icon: "circle"
name: '2', },
icon: "circle" {
}, { name: "2",
name: '3', icon: "circle"
icon: "circle" },
}, { {
name: '4', name: "3",
icon: "circle" icon: "circle"
}], },
{
name: "4",
icon: "circle"
}
],
textStyle: { textStyle: {
color: 'white', color: "white",
fontSize: 16, fontSize: 16,
padding: [10, 1, 10, 0], padding: [10, 1, 10, 0]
}, },
selectedMode: false, selectedMode: false
}, },
series: [ series: [
{ {
//name: '环1', //name: '环1',
type: 'custom', type: "custom",
coordinateSystem: 'none', coordinateSystem: "none",
renderItem: (params, api) => { renderItem: (params, api) => {
return { return {
type: 'arc', type: "arc",
shape: { shape: {
cx: api.getWidth() / 2, cx: api.getWidth() / 2,
cy: api.getHeight() / 2, cy: api.getHeight() / 2,
r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.6, r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.6,
startAngle: ((0 + this.angle) * Math.PI) / 180, startAngle: ((0 + this.angle) * Math.PI) / 180,
endAngle: ((90 + this.angle) * Math.PI) / 180, endAngle: ((90 + this.angle) * Math.PI) / 180
}, },
style: { style: {
stroke: '#0CD3DB', stroke: "#0CD3DB",
fill: 'transparent', fill: "transparent",
lineWidth: 1.5, lineWidth: 1.5
}, },
silent: true, silent: true
}; };
}, },
data: [0], data: [0]
}, },
{ {
//name: '环2', //name: '环2',
type: 'custom', type: "custom",
coordinateSystem: 'none', coordinateSystem: "none",
renderItem: (params, api) => { renderItem: (params, api) => {
return { return {
type: 'arc', type: "arc",
shape: { shape: {
cx: api.getWidth() / 2, cx: api.getWidth() / 2,
cy: api.getHeight() / 2, cy: api.getHeight() / 2,
r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.6, r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.6,
startAngle: ((180 + this.angle) * Math.PI) / 180, startAngle: ((180 + this.angle) * Math.PI) / 180,
endAngle: ((270 + this.angle) * Math.PI) / 180, endAngle: ((270 + this.angle) * Math.PI) / 180
}, },
style: { style: {
stroke: '#0CD3DB', stroke: "#0CD3DB",
fill: 'transparent', fill: "transparent",
lineWidth: 1.5, lineWidth: 1.5
}, },
silent: true, silent: true
}; };
}, },
data: [0], data: [0]
}, },
{ {
//name: '环3', //name: '环3',
type: 'custom', type: "custom",
coordinateSystem: 'none', coordinateSystem: "none",
renderItem: (params, api) => { renderItem: (params, api) => {
return { return {
type: 'arc', type: "arc",
shape: { shape: {
cx: api.getWidth() / 2, cx: api.getWidth() / 2,
cy: api.getHeight() / 2, cy: api.getHeight() / 2,
r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65, r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65,
startAngle: ((270 + -this.angle) * Math.PI) / 180, startAngle: ((270 + -this.angle) * Math.PI) / 180,
endAngle: ((40 + -this.angle) * Math.PI) / 180, endAngle: ((40 + -this.angle) * Math.PI) / 180
}, },
style: { style: {
stroke: '#0CD3DB', stroke: "#0CD3DB",
fill: 'transparent', fill: "transparent",
lineWidth: 1.5, lineWidth: 1.5
}, },
silent: true, silent: true
}; };
}, },
data: [0], data: [0]
}, },
{ {
//name: '环4', //name: '环4',
type: 'custom', type: "custom",
coordinateSystem: 'none', coordinateSystem: "none",
renderItem: (params, api) => { renderItem: (params, api) => {
return { return {
type: 'arc', type: "arc",
shape: { shape: {
cx: api.getWidth() / 2, cx: api.getWidth() / 2,
cy: api.getHeight() / 2, cy: api.getHeight() / 2,
r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65, r: (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65,
startAngle: ((90 + -this.angle) * Math.PI) / 180, startAngle: ((90 + -this.angle) * Math.PI) / 180,
endAngle: ((220 + -this.angle) * Math.PI) / 180, endAngle: ((220 + -this.angle) * Math.PI) / 180
}, },
style: { style: {
stroke: '#0CD3DB', stroke: "#0CD3DB",
fill: 'transparent', fill: "transparent",
lineWidth: 1.5, lineWidth: 1.5
}, },
silent: true, silent: true
}; };
}, },
data: [0], data: [0]
}, },
{ {
//name: '绿点1', //name: '绿点1',
type: 'custom', type: "custom",
coordinateSystem: 'none', coordinateSystem: "none",
renderItem: (params, api) => { renderItem: (params, api) => {
let x0 = api.getWidth() / 2; let x0 = api.getWidth() / 2;
let y0 = api.getHeight() / 2; let y0 = api.getHeight() / 2;
let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65; let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65;
let point = this.getCirlPoint(x0, y0, r, 90 + -this.angle); let point = this.getCirlPoint(x0, y0, r, 90 + -this.angle);
return { return {
type: 'circle', type: "circle",
shape: { shape: {
cx: point.x, cx: point.x,
cy: point.y, cy: point.y,
r: 4, r: 4
}, },
style: { style: {
stroke: '#0CD3DB', //粉 stroke: "#0CD3DB", //粉
fill: '#0CD3DB', fill: "#0CD3DB"
}, },
silent: true, silent: true
}; };
}, },
data: [0], data: [0]
}, },
{ {
//name: '绿点2', //name: '绿点2',
type: 'custom', type: "custom",
coordinateSystem: 'none', coordinateSystem: "none",
renderItem: (params, api) => { renderItem: (params, api) => {
let x0 = api.getWidth() / 2; let x0 = api.getWidth() / 2;
let y0 = api.getHeight() / 2; let y0 = api.getHeight() / 2;
let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65; let r = (Math.min(api.getWidth(), api.getHeight()) / 2) * 0.65;
let point = this.getCirlPoint(x0, y0, r, 270 + -this.angle); let point = this.getCirlPoint(x0, y0, r, 270 + -this.angle);
return { return {
type: 'circle', type: "circle",
shape: { shape: {
cx: point.x, cx: point.x,
cy: point.y, cy: point.y,
r: 4, r: 4
}, },
style: { style: {
stroke: '#0CD3DB', //绿 stroke: "#0CD3DB", //绿
fill: '#0CD3DB', fill: "#0CD3DB"
}, },
silent: true, silent: true
}; };
}, },
data: [0], data: [0]
}, },
{ {
//name: '圆环', //name: '圆环',
type: 'pie', type: "pie",
radius: ['58%', '45%'], radius: ["58%", "45%"],
silent: true, silent: true,
clockwise: true, clockwise: true,
startAngle: 90, startAngle: 90,
@ -218,13 +223,13 @@ export default {
zlevel: 0, zlevel: 0,
label: { label: {
normal: { normal: {
position: 'center', position: "center"
}, }
}, },
data: [ data: [
{ {
value: per, value: per,
name: '', name: "",
itemStyle: { itemStyle: {
normal: { normal: {
color: { color: {
@ -232,73 +237,75 @@ export default {
colorStops: [ colorStops: [
{ {
offset: 0, offset: 0,
color: '#4FADFD', // 0% 处的颜色 color: "#4FADFD" // 0% 处的颜色
}, },
{ {
offset: 1, offset: 1,
color: '#28E8FA', // 100% 处的颜色 color: "#28E8FA" // 100% 处的颜色
}, }
], ]
}, }
}, }
}, }
}, },
{ {
value: 100 - per, value: 100 - per,
name: '', name: "",
label: { label: {
normal: { normal: {
show: false, show: false
}, }
}, },
//剩余圆环颜色 //剩余圆环颜色
itemStyle: { itemStyle: {
normal: { normal: {
color: '#173164', color: "#173164"
}, }
}, }
}, }
], ]
}, },
{ {
name: 'percent', name: "percent",
type: 'gauge', type: "gauge",
radius: '58%', radius: "58%",
center: ['50%', '50%'], center: ["50%", "50%"],
startAngle: 0, startAngle: 0,
endAngle: 359.9, endAngle: 359.9,
splitNumber: 8, splitNumber: 8,
hoverAnimation: true, hoverAnimation: true,
axisTick: { axisTick: {
show: false, show: false
}, },
splitLine: { splitLine: {
length: 15, length: 15,
lineStyle: { lineStyle: {
width: 5, width: 5,
color: '#061740', color: "#061740"
}, }
}, },
axisLabel: { axisLabel: {
show: false, show: false
}, },
pointer: { pointer: {
show: false, show: false
}, },
axisLine: { axisLine: {
lineStyle: { lineStyle: {
opacity: 0, opacity: 0
}, }
}, },
detail: { detail: {
show: false, show: false
}, },
data: [{ data: [
value: 0, {
name: "" value: 0,
}], name: ""
}, }
], ]
}
]
}, },
optionsStyle: {}, // 样式 optionsStyle: {}, // 样式
optionsData: {}, // 数据 optionsData: {}, // 数据
@ -350,7 +357,7 @@ export default {
let y1 = y0 + r * Math.sin((x * Math.PI) / 180); let y1 = y0 + r * Math.sin((x * Math.PI) / 180);
return { return {
x: x1, x: x1,
y: y1, y: y1
}; };
}, },
editorOptions() { editorOptions() {
@ -377,7 +384,7 @@ export default {
fontWeight: optionsSetup.textPerFontWeight fontWeight: optionsSetup.textPerFontWeight
} }
}; };
title.textStyle['rich'] = rich; title.textStyle["rich"] = rich;
this.options.title = title; this.options.title = title;
}, },
setOptions() { setOptions() {
@ -396,59 +403,56 @@ export default {
//圆环0-100%颜色 //圆环0-100%颜色
setOptionsColor() { setOptionsColor() {
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const itemStyle = this.options.series[6]['data'][0]['itemStyle'] const itemStyle = this.options.series[6]["data"][0]["itemStyle"];
const normal = { const normal = {
color: { color: {
// 完成的圆环的颜色 // 完成的圆环的颜色
colorStops: [ colorStops: [
{ {
offset: 0, offset: 0,
color: optionsSetup.color0Start, // 0% 处的颜色 color: optionsSetup.color0Start // 0% 处的颜色
}, },
{ {
offset: 1, offset: 1,
color: optionsSetup.color100End, // 100% 处的颜色 color: optionsSetup.color100End // 100% 处的颜色
}, }
], ]
}, }
}; };
itemStyle['normal'] = normal itemStyle["normal"] = normal;
}, },
setOptionSurplusColor() { setOptionSurplusColor() {
const itemStyle = this.options.series[6]['data'][1]['itemStyle'] const itemStyle = this.options.series[6]["data"][1]["itemStyle"];
const normal = { const normal = {
color: this.optionsSetup.colorsurplus, color: this.optionsSetup.colorsurplus
}; };
itemStyle['normal'] = normal itemStyle["normal"] = normal;
}, },
setOptionLine() { setOptionLine() {
const optionsSetup = this.optionsSetup; const optionsSetup = this.optionsSetup;
const line = this.options.series[7]['splitLine']; const line = this.options.series[7]["splitLine"];
const num = this.options.series[7]; const num = this.options.series[7];
num.splitNumber = optionsSetup.lineNumber; num.splitNumber = optionsSetup.lineNumber;
line.length = optionsSetup.lineLength; line.length = optionsSetup.lineLength;
const lineStyle = { const lineStyle = {
width: optionsSetup.lineWidth, width: optionsSetup.lineWidth,
color: optionsSetup.lineColor, color: optionsSetup.lineColor
}; };
line['lineStyle'] = lineStyle line["lineStyle"] = lineStyle;
}, },
// 数据解析 // 数据解析
setOptionsData() { setOptionsData() {
const optionsData = this.optionsData; // 数据类型 静态 or 动态 const optionsData = this.optionsData; // 数据类型 静态 or 动态
optionsData.dataType == "staticData" optionsData.dataType == "staticData"
? this.staticDataFn(optionsData.staticData) ? this.staticDataFn(optionsData.staticData)
: this.dynamicDataFn( : this.dynamicDataFn(optionsData.dynamicData, optionsData.refreshTime);
optionsData.dynamicData,
optionsData.refreshTime
);
}, },
staticDataFn(val) { staticDataFn(val) {
const title = this.options.title; const title = this.options.title;
const num = val[0]['num']; const num = val[0]["num"];
title.text = '{nums|' + num + '}{percent|%}'; title.text = "{nums|" + num + "}{percent|%}";
this.options.series[6]['data'][0]['value'] = num; this.options.series[6]["data"][0]["value"] = num;
this.options.series[6]['data'][1]['value'] = 100 - num; this.options.series[6]["data"][1]["value"] = 100 - num;
}, },
dynamicDataFn(val, refreshTime) { dynamicDataFn(val, refreshTime) {
if (!val) return; if (!val) return;
@ -464,9 +468,9 @@ export default {
getEchartData(val) { getEchartData(val) {
const data = this.queryEchartsData(val); const data = this.queryEchartsData(val);
data.then(res => { data.then(res => {
this.options.title.text = '{nums|' + res[0].value + '}{percent|%}'; this.options.title.text = "{nums|" + res[0].value + "}{percent|%}";
this.options.series[6]['data'][0]['value'] = res[0].value; this.options.series[6]["data"][0]["value"] = res[0].value;
this.options.series[6]['data'][1]['value'] = 100 - res[0].value; this.options.series[6]["data"][1]["value"] = 100 - res[0].value;
}); });
} }
} }

22
report-ui/src/views/report/bigscreen/designer/widget/widgetMap.vue
Unescape Escape View File

@ -5,7 +5,7 @@
</template> </template>
<script> <script>
import "../../../../../../node_modules/echarts/map/js/china.js"; import "../../../../../../node_modules/echarts/map/js/china.js";
var GZData = [ let GZData = [
[ [
{ {
name: "广州" name: "广州"
@ -97,7 +97,7 @@ var GZData = [
} }
] ]
]; ];
var geoCoordMap = { let geoCoordMap = {
上海: [121.4648, 31.2891], 上海: [121.4648, 31.2891],
东莞: [113.8953, 22.901], 东莞: [113.8953, 22.901],
东营: [118.7073, 37.5513], 东营: [118.7073, 37.5513],
@ -213,10 +213,10 @@ var geoCoordMap = {
青岛: [120.4651, 36.3373], 青岛: [120.4651, 36.3373],
韶关: [113.7964, 24.7028] 韶关: [113.7964, 24.7028]
}; };
var type = "流出"; let type = "流出";
var color = ["#a6c84c", "#ffa022", "#46bee9"]; let color = ["#a6c84c", "#ffa022", "#46bee9"];
var tempData = ["广州", GZData]; let tempData = ["广州", GZData];
var planePath = let planePath =
"path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z"; "path://M1705.06,1318.313v-89.254l-319.9-221.799l0.073-208.063c0.521-84.662-26.629-121.796-63.961-121.491c-37.332-0.305-64.482,36.829-63.961,121.491l0.073,208.063l-319.9,221.799v89.254l330.343-157.288l12.238,241.308l-134.449,92.931l0.531,42.034l175.125-42.917l175.125,42.917l0.531-42.034l-134.449-92.931l12.238-241.308L1705.06,1318.313z";
export default { export default {
name: "widgetMap", name: "widgetMap",
@ -432,11 +432,11 @@ export default {
this.options = options; this.options = options;
}, },
convertData(data) { convertData(data) {
var res = []; let res = [];
for (var i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
var dataItem = data[i]; let dataItem = data[i];
var fromCoord = geoCoordMap[dataItem[0].name]; let fromCoord = geoCoordMap[dataItem[0].name];
var toCoord = geoCoordMap[dataItem[1].name]; let toCoord = geoCoordMap[dataItem[1].name];
if ("流入" == type) { if ("流入" == type) {
fromCoord = geoCoordMap[dataItem[1].name]; fromCoord = geoCoordMap[dataItem[1].name];
toCoord = geoCoordMap[dataItem[0].name]; toCoord = geoCoordMap[dataItem[0].name];

51
report-ui/src/views/report/bigscreen/designer/widget/widgetTable.vue
Unescape Escape View File

@ -5,7 +5,7 @@
<div class="title"> <div class="title">
<div <div
v-for="(item, index) in header" v-for="(item, index) in header"
:style="[headerTableStlye,tableFiledWidth(index),tableRowHeight()]" :style="[headerTableStlye, tableFiledWidth(index), tableRowHeight()]"
:key="index" :key="index"
> >
{{ item.name }} {{ item.name }}
@ -14,11 +14,20 @@
<!--数据--> <!--数据-->
<div class="bd"> <div class="bd">
<ul class="infoList"> <ul class="infoList">
<li v-for="(item, index) in list" :key="index" :style="tableRowHeight()" > <li
v-for="(item, index) in list"
:key="index"
:style="tableRowHeight()"
>
<div <div
v-for="(itemChild, idx) in header" v-for="(itemChild, idx) in header"
:key="idx" :key="idx"
:style="[bodyTableStyle, bodyTable(index),tableFiledWidth(idx),tableRowHeight()]" :style="[
bodyTableStyle,
bodyTable(index),
tableFiledWidth(idx),
tableRowHeight()
]"
> >
{{ item[itemChild.key] }} {{ item[itemChild.key] }}
</div> </div>
@ -49,7 +58,7 @@ export default {
//effect: "top", //effect: "top",
autoPlay: true, autoPlay: true,
vis: 5, vis: 5,
rowHeight:'50px' rowHeight: "50px"
}, },
header: [], header: [],
list: [], list: [],
@ -121,7 +130,7 @@ export default {
this.handlerData(); this.handlerData();
this.visConfig(); this.visConfig();
}, },
visConfig(){ visConfig() {
this.options.vis = this.optionsSetUp.vis; this.options.vis = this.optionsSetUp.vis;
}, },
handlerRollFn() { handlerRollFn() {
@ -175,31 +184,31 @@ export default {
}, },
// 计算 奇偶背景色 // 计算 奇偶背景色
bodyTable(index) { bodyTable(index) {
var styleJson = {}; let styleJson = {};
if (index % 2) { if (index % 2) {
styleJson["background-color"] = this.optionsSetUp.eventColor styleJson["background-color"] = this.optionsSetUp.eventColor;
} else { } else {
styleJson["background-color"] = this.optionsSetUp.oldColor styleJson["background-color"] = this.optionsSetUp.oldColor;
} }
return styleJson; return styleJson;
}, },
tableRowHeight(){ tableRowHeight() {
var styleJson = {}; let styleJson = {};
if(this.optionsSetUp.rowHeight){ if (this.optionsSetUp.rowHeight) {
styleJson['height'] = this.optionsSetUp.rowHeight+'px'; styleJson["height"] = this.optionsSetUp.rowHeight + "px";
styleJson['line-height'] = this.optionsSetUp.rowHeight+'px'; styleJson["line-height"] = this.optionsSetUp.rowHeight + "px";
}else{ } else {
styleJson['height'] =this.options.rowHeight styleJson["height"] = this.options.rowHeight;
styleJson['line-height'] = this.optionsSetUp.rowHeight+'px'; styleJson["line-height"] = this.optionsSetUp.rowHeight + "px";
} }
return styleJson; return styleJson;
}, },
tableFiledWidth(index){ tableFiledWidth(index) {
var styleJson = {}; let styleJson = {};
if(this.optionsSetUp.dynamicAddTable[index].width ){ if (this.optionsSetUp.dynamicAddTable[index].width) {
styleJson["width"] = this.optionsSetUp.dynamicAddTable[index].width styleJson["width"] = this.optionsSetUp.dynamicAddTable[index].width;
} }
return styleJson return styleJson;
} }
} }
}; };

2
report-ui/src/views/report/bigscreen/designer/widget/widgetTime.vue
Unescape Escape View File

@ -73,7 +73,7 @@ export default {
"q+": Math.floor((date.getMonth() + 3) / 3), // 季度 "q+": Math.floor((date.getMonth() + 3) / 3), // 季度
S: date.getMilliseconds() // 毫秒 S: date.getMilliseconds() // 毫秒
}; };
for (var k in o) { for (let k in o) {
if (new RegExp("(" + k + ")").test(fmt)) { if (new RegExp("(" + k + ")").test(fmt)) {
fmt = fmt.replace( fmt = fmt.replace(
RegExp.$1, RegExp.$1,

8
report-ui/src/views/report/bigscreen/index.vue
Unescape Escape View File

@ -120,7 +120,7 @@ export default {
params: { params: {
reportCode: "", reportCode: "",
reportName: "", reportName: "",
reportType: 'report_screen', reportType: "report_screen",
pageNumber: 1, pageNumber: 1,
pageSize: 8, pageSize: 8,
order: "DESC", order: "DESC",
@ -178,16 +178,16 @@ export default {
this.visibleForShareDialog = true; this.visibleForShareDialog = true;
}, },
openDesign(val) { openDesign(val) {
var routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: "/bigscreen/designer", path: "/bigscreen/designer",
query: { query: {
reportCode: val.reportCode, reportCode: val.reportCode
} }
}); });
window.open(routeUrl.href, "_blank"); window.open(routeUrl.href, "_blank");
}, },
viewDesign(val) { viewDesign(val) {
var routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: "/bigscreen/viewer", path: "/bigscreen/viewer",
query: { reportCode: val.reportCode } query: { reportCode: val.reportCode }
}); });

4
report-ui/src/views/report/datasource/components/EditDataSource.vue
Unescape Escape View File

@ -177,8 +177,8 @@ export default {
this.dictionaryOptions.map(item => { this.dictionaryOptions.map(item => {
if (item.id == newSourceType.sourceType) { if (item.id == newSourceType.sourceType) {
newDataLink = JSON.parse(item.extend); newDataLink = JSON.parse(item.extend);
var sourceConfigJson = JSON.parse(newSourceType.sourceConfig); let sourceConfigJson = JSON.parse(newSourceType.sourceConfig);
for (var i = 0; i < newDataLink.length; i++) { for (let i = 0; i < newDataLink.length; i++) {
newDataLink[i].value = sourceConfigJson[newDataLink[i].label]; newDataLink[i].value = sourceConfigJson[newDataLink[i].label];
} }
} }

14
report-ui/src/views/report/excelreport/designer/index.vue
Unescape Escape View File

@ -258,7 +258,7 @@ export default {
this.createSheet(); this.createSheet();
if (data != null) { if (data != null) {
if (data.setCodes != null && data.setCodes !== "") { if (data.setCodes != null && data.setCodes !== "") {
var dataSetList = data.setCodes.split("|"); let dataSetList = data.setCodes.split("|");
dataSetList.forEach(code => { dataSetList.forEach(code => {
this.dataSetData.forEach(setData => { this.dataSetData.forEach(setData => {
if (code === setData.setCode) { if (code === setData.setCode) {
@ -347,7 +347,7 @@ export default {
}, },
onStart(setCode, evt) { onStart(setCode, evt) {
this.setCode = setCode; this.setCode = setCode;
var fieldLabel = evt.item.innerText; // 列名称 let fieldLabel = evt.item.innerText; // 列名称
this.draggableFieldLabel = "#{" + this.setCode + "." + fieldLabel + "}"; this.draggableFieldLabel = "#{" + this.setCode + "." + fieldLabel + "}";
console.log("evt", evt); console.log("evt", evt);
console.log("draggableFieldLabel", this.draggableFieldLabel); console.log("draggableFieldLabel", this.draggableFieldLabel);
@ -371,15 +371,15 @@ export default {
} }
this.reportExcelDto.jsonStr = JSON.stringify(luckysheet.getAllSheets()); this.reportExcelDto.jsonStr = JSON.stringify(luckysheet.getAllSheets());
var setCodeList = []; let setCodeList = [];
var setParams = {}; let setParams = {};
this.dataSet.forEach(code => { this.dataSet.forEach(code => {
setCodeList.push(code.setCode); setCodeList.push(code.setCode);
if ( if (
code.dataSetParamDtoList != null && code.dataSetParamDtoList != null &&
code.dataSetParamDtoList.length > 0 code.dataSetParamDtoList.length > 0
) { ) {
var dataSetParam = {}; let dataSetParam = {};
code.dataSetParamDtoList.forEach(value => { code.dataSetParamDtoList.forEach(value => {
dataSetParam[value.paramName] = value.sampleItem; dataSetParam[value.paramName] = value.sampleItem;
}); });
@ -409,7 +409,7 @@ export default {
} }
}, },
async preview() { async preview() {
var routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: "/excelreport/viewer", path: "/excelreport/viewer",
query: { reportCode: this.reportCode } query: { reportCode: this.reportCode }
}); });
@ -436,7 +436,7 @@ export default {
async detail(id) { async detail(id) {
const { code, data } = await detail(id); const { code, data } = await detail(id);
if (code != 200) return; if (code != 200) return;
var flag = true; let flag = true;
this.dataSet.forEach(value => { this.dataSet.forEach(value => {
if (value.setCode === data.setCode) { if (value.setCode === data.setCode) {
flag = false; flag = false;

12
report-ui/src/views/report/excelreport/index.vue
Unescape Escape View File

@ -34,10 +34,10 @@
</el-col> </el-col>
<el-col :xs="24" :sm="20" :md="4" :lg="4" :xl="4"> <el-col :xs="24" :sm="20" :md="4" :lg="4" :xl="4">
<el-button type="primary" size="mini" @click="search('form')" <el-button type="primary" size="mini" @click="search('form')"
>查询</el-button >查询</el-button
> >
<el-button type="danger" size="mini" @click="reset('form')" <el-button type="danger" size="mini" @click="reset('form')"
>重置</el-button >重置</el-button
> >
</el-col> </el-col>
</el-row> </el-row>
@ -121,7 +121,7 @@ export default {
params: { params: {
reportCode: "", reportCode: "",
reportName: "", reportName: "",
reportType: 'report_excel', reportType: "report_excel",
pageNumber: 1, pageNumber: 1,
pageSize: 8, pageSize: 8,
order: "DESC", order: "DESC",
@ -183,16 +183,16 @@ export default {
this.visibleForShareDialog = true; this.visibleForShareDialog = true;
}, },
openDesign(val) { openDesign(val) {
var routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: "/excelreport/designer", path: "/excelreport/designer",
query: { query: {
reportCode: val.reportCode, reportCode: val.reportCode
} }
}); });
window.open(routeUrl.href, "_blank"); window.open(routeUrl.href, "_blank");
}, },
viewDesign(val) { viewDesign(val) {
var routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: "/excelreport/viewer", path: "/excelreport/viewer",
query: { reportCode: val.reportCode } query: { reportCode: val.reportCode }
}); });

4
report-ui/src/views/report/report/components/share.vue
Unescape Escape View File

@ -193,7 +193,7 @@ export default {
}); });
}, },
copyToClip(content, message) { copyToClip(content, message) {
var aux = document.createElement("input"); let aux = document.createElement("input");
aux.setAttribute("value", content); aux.setAttribute("value", content);
document.body.appendChild(aux); document.body.appendChild(aux);
aux.select(); aux.select();
@ -202,7 +202,7 @@ export default {
}, },
async saveReportShare() { async saveReportShare() {
var params = {}; let params = {};
//const { code } = await saveAuthorityTree(params) //const { code } = await saveAuthorityTree(params)
//if (code != '200') return //if (code != '200') return
this.closeDialog(); this.closeDialog();

45
report-ui/src/views/report/report/index.vue
Unescape Escape View File

@ -23,7 +23,7 @@
type="text" type="text"
@click="shareReport(props.msg)" @click="shareReport(props.msg)"
v-permission="'bigScreenManage:share'" v-permission="'bigScreenManage:share'"
>分享</el-button >分享</el-button
> >
</template> </template>
@ -46,7 +46,7 @@ import {
reportDetail reportDetail
} from "@/api/reportmanage"; } from "@/api/reportmanage";
import Share from "@/views/report/report/components/share"; import Share from "@/views/report/report/components/share";
import {validateEngOrNum} from "@/utils/validate"; import { validateEngOrNum } from "@/utils/validate";
export default { export default {
name: "Report", name: "Report",
components: { components: {
@ -67,12 +67,12 @@ export default {
// 查询表单条件 // 查询表单条件
queryFormFields: [ queryFormFields: [
{ {
inputType: 'anji-select', //form表单类型 input|input-number|anji-select(传递url或者dictCode)|anji-tree(左侧树)|date|datetime|datetimerange inputType: "anji-select", //form表单类型 input|input-number|anji-select(传递url或者dictCode)|anji-tree(左侧树)|date|datetime|datetimerange
anjiSelectOption: { anjiSelectOption: {
dictCode: "REPORT_TYPE" dictCode: "REPORT_TYPE"
}, },
label: '报表类型', label: "报表类型",
field: 'reportType' field: "reportType"
}, },
{ {
inputType: "input", inputType: "input",
@ -83,15 +83,15 @@ export default {
inputType: "input", inputType: "input",
label: "报表编码", label: "报表编码",
field: "reportCode" field: "reportCode"
}, }
], ],
// 操作按钮 // 操作按钮
buttons: { buttons: {
query: { query: {
api: reportList, api: reportList,
permission: "reportManage:query", permission: "reportManage:query",
sort: 'update_time', sort: "update_time",
order: 'DESC' order: "DESC"
}, },
queryByPrimarykey: { queryByPrimarykey: {
api: reportDetail, api: reportDetail,
@ -129,22 +129,22 @@ export default {
editField: "reportName", editField: "reportName",
inputType: "input", inputType: "input",
rules: [ rules: [
{ required: true, message: '请输入报表名称', trigger: 'blur' }, { required: true, message: "请输入报表名称", trigger: "blur" },
{ min: 1, max: 100, message: "不超过100个字符", trigger: "blur" } { min: 1, max: 100, message: "不超过100个字符", trigger: "blur" }
], ],
disabled: false disabled: false
}, },
{ {
label: "报表编码", //报表编码 label: "报表编码", //报表编码
placeholder: '唯一标识', placeholder: "唯一标识",
field: "reportCode", field: "reportCode",
editField: "reportCode", editField: "reportCode",
inputType: "input", inputType: "input",
rules: [ rules: [
{ required: true, message: '请输入报表编码', trigger: 'blur' }, { required: true, message: "请输入报表编码", trigger: "blur" },
{ min: 1, max: 100, message: "不超过100个字符", trigger: "blur" }, { min: 1, max: 100, message: "不超过100个字符", trigger: "blur" },
{ validator: validateEngOrNum, trigger: 'blur' }, { validator: validateEngOrNum, trigger: "blur" }
], ],
disabled: "disableOnEdit" disabled: "disableOnEdit"
}, },
@ -175,10 +175,10 @@ export default {
dictCode: "REPORT_TYPE" dictCode: "REPORT_TYPE"
}, },
rules: [ rules: [
{ required: true, message: '请输入报表类型', trigger: 'blur' }, { required: true, message: "请输入报表类型", trigger: "blur" },
{ min: 1, max: 20, message: "不超过20个字符", trigger: "blur" } { min: 1, max: 20, message: "不超过20个字符", trigger: "blur" }
], ],
disabled: "disableOnEdit", disabled: "disableOnEdit"
}, },
{ {
label: "描述", //报表描述 label: "描述", //报表描述
@ -252,13 +252,12 @@ export default {
// 预览 // 预览
preview(val) { preview(val) {
let routePath = ""; let routePath = "";
if (val.reportType === 'report_excel') { if (val.reportType === "report_excel") {
routePath = "/excelreport/viewer"; routePath = "/excelreport/viewer";
} else { } else {
routePath = "/bigscreen/viewer"; routePath = "/bigscreen/viewer";
} }
var routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: routePath, path: routePath,
query: { reportCode: val.reportCode } query: { reportCode: val.reportCode }
}); });
@ -267,24 +266,22 @@ export default {
// 设计 // 设计
design(val) { design(val) {
let routePath = ""; let routePath = "";
if (val.reportType === 'report_excel') { if (val.reportType === "report_excel") {
routePath = "/excelreport/designer"; routePath = "/excelreport/designer";
} else { } else {
routePath = "/bigscreen/designer"; routePath = "/bigscreen/designer";
} }
var routeUrl = this.$router.resolve({ let routeUrl = this.$router.resolve({
path: routePath, path: routePath,
query: { query: {
reportCode: val.reportCode, reportCode: val.reportCode
} }
}); });
window.open(routeUrl.href, "_blank"); window.open(routeUrl.href, "_blank");
}, },
//分享 //分享
shareReport(val){ shareReport(val) {
if (val.reportType == 'report_excel') { if (val.reportType == "report_excel") {
//excel暂不支持 //excel暂不支持
this.$message.warning("暂不支持excel报表分享"); this.$message.warning("暂不支持excel报表分享");
return; return;

101
report-ui/src/views/report/resultset/components/EditDataSet.vue
Unescape Escape View File

@ -15,7 +15,14 @@
label-width="130px" label-width="130px"
> >
<el-row :gutter="10"> <el-row :gutter="10">
<el-col v-if="this.setType=='sql'" :xs="24" :sm="20" :md="8" :lg="8" :xl="8"> <el-col
v-if="this.setType == 'sql'"
:xs="24"
:sm="20"
:md="8"
:lg="8"
:xl="8"
>
<el-form-item label="数据源" prop="sourceCode"> <el-form-item label="数据源" prop="sourceCode">
<el-select <el-select
v-model.trim="formData.sourceCode" v-model.trim="formData.sourceCode"
@ -52,10 +59,8 @@
<el-input v-model.trim="formData.setDesc" size="mini" /> <el-input v-model.trim="formData.setDesc" size="mini" />
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row v-if="this.setType=='sql'" :gutter="10"> <el-row v-if="this.setType == 'sql'" :gutter="10">
<el-col <el-col
:xs="24" :xs="24"
:sm="20" :sm="20"
@ -64,7 +69,7 @@
:xl="22" :xl="22"
class="code-mirror-form" class="code-mirror-form"
> >
<el-form-item label="查询SQL"> <el-form-item label="查询SQL">
<div class="codemirror"> <div class="codemirror">
<monaco-editor <monaco-editor
v-model.trim="formData.dynSentence" v-model.trim="formData.dynSentence"
@ -75,10 +80,18 @@
</el-form-item> </el-form-item>
</el-col> </el-col>
</el-row> </el-row>
<el-row v-if="this.setType=='http'"> <el-row v-if="this.setType == 'http'">
<el-form-item label="请求路径"> <el-form-item label="请求路径">
<el-input placeholder="请输入请求路径..." v-model="httpForm.apiUrl" class="input-with-select"> <el-input
<el-select v-model="httpForm.method" slot="prepend" placeholder="请选择"> placeholder="请输入请求路径..."
v-model="httpForm.apiUrl"
class="input-with-select"
>
<el-select
v-model="httpForm.method"
slot="prepend"
placeholder="请选择"
>
<el-option label="GET" value="GET"></el-option> <el-option label="GET" value="GET"></el-option>
<el-option label="POST" value="POST"></el-option> <el-option label="POST" value="POST"></el-option>
<el-option label="PUT" value="PUT"></el-option> <el-option label="PUT" value="PUT"></el-option>
@ -86,13 +99,20 @@
</el-select> </el-select>
</el-input> </el-input>
</el-form-item> </el-form-item>
<el-form-item label="请求头"> <el-form-item label="请求头">
<el-input v-model.trim="httpForm.header" size="mini" placeholder="请输入请求头..."/> <el-input
v-model.trim="httpForm.header"
size="mini"
placeholder="请输入请求头..."
/>
</el-form-item> </el-form-item>
<el-form-item label="请求体"> <el-form-item label="请求体">
<el-input v-model.trim="httpForm.body" size="mini" placeholder="请输入请求体..."/> <el-input
v-model.trim="httpForm.body"
size="mini"
placeholder="请输入请求体..."
/>
</el-form-item> </el-form-item>
</el-row> </el-row>
<el-row :gutter="10"> <el-row :gutter="10">
<el-col :xs="24" :sm="20" :md="22" :lg="22" :xl="22"> <el-col :xs="24" :sm="20" :md="22" :lg="22" :xl="22">
@ -184,11 +204,11 @@
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<!-- <el-checkbox--> <!-- <el-checkbox-->
<!-- v-model="isShowPagination"--> <!-- v-model="isShowPagination"-->
<!-- @change="changePagination"--> <!-- @change="changePagination"-->
<!-- >加入分页参数--> <!-- >加入分页参数-->
<!-- </el-checkbox>--> <!-- </el-checkbox>-->
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="数据转换" name="second"> <el-tab-pane label="数据转换" name="second">
<template> <template>
@ -408,7 +428,7 @@ import "codemirror/lib/codemirror.css"; // 核心样式
import "codemirror/theme/cobalt.css"; // 引入主题后还需要在 options 中指定主题才会生效 import "codemirror/theme/cobalt.css"; // 引入主题后还需要在 options 中指定主题才会生效
import vueJsonEditor from "vue-json-editor"; import vueJsonEditor from "vue-json-editor";
import MonacoEditor from "./MonacoEditor.vue"; import MonacoEditor from "./MonacoEditor.vue";
import {validateEngOrNum} from "@/utils/validate"; import { validateEngOrNum } from "@/utils/validate";
export default { export default {
name: "Support", name: "Support",
components: { Dictionary, codemirror, vueJsonEditor, MonacoEditor }, components: { Dictionary, codemirror, vueJsonEditor, MonacoEditor },
@ -496,7 +516,7 @@ export default {
], ],
setCode: [ setCode: [
{ required: true, message: "数据集编码必填", trigger: "blur" }, { required: true, message: "数据集编码必填", trigger: "blur" },
{ validator: validateEngOrNum, trigger: 'blur' }, { validator: validateEngOrNum, trigger: "blur" }
], ],
sourceCode: [ sourceCode: [
{ required: true, message: "数据源必选", trigger: "change" } { required: true, message: "数据源必选", trigger: "change" }
@ -530,12 +550,13 @@ export default {
setName: "", setName: "",
setCode: "" setCode: ""
}, },
setType: '', //数据集类型，主要用于区分http addSql addHttp edit setType: "", //数据集类型，主要用于区分http addSql addHttp edit
httpForm: { //http数据源相关数据 httpForm: {
apiUrl: '', //http数据源相关数据
method: 'GET', apiUrl: "",
method: "GET",
header: '{"Content-Type":"application/json;charset=UTF-8"}', header: '{"Content-Type":"application/json;charset=UTF-8"}',
body: '', body: ""
}, },
//待删除 //待删除
dictionaryOptions: [], // 数据源类型 dictionaryOptions: [], // 数据源类型
@ -570,9 +591,9 @@ export default {
methods: { methods: {
// 编辑数据集,获取单条数据详情 // 编辑数据集,获取单条数据详情
async addOrEditDataSet(row, type) { async addOrEditDataSet(row, type) {
this.setType = type this.setType = type;
if (type == 'http' && row.dynSentence) { if (type == "http" && row.dynSentence) {
this.httpForm = JSON.parse(row.dynSentence) this.httpForm = JSON.parse(row.dynSentence);
} }
//获取数据源下拉 //获取数据源下拉
const { code, data } = await queryAllDataSourceSet(); const { code, data } = await queryAllDataSourceSet();
@ -592,7 +613,7 @@ export default {
data.data.dataSetParamDtoList.length > 0 data.data.dataSetParamDtoList.length > 0
) { ) {
this.tableData = data.data.dataSetParamDtoList; this.tableData = data.data.dataSetParamDtoList;
var count = 0; let count = 0;
this.tableData.find((value, i) => { this.tableData.find((value, i) => {
if ( if (
value.paramName === "pageNumber" || value.paramName === "pageNumber" ||
@ -668,10 +689,10 @@ export default {
// 测试预览 // 测试预览
async handleClickTabs(tab, event) { async handleClickTabs(tab, event) {
if (this.setType == 'http') { if (this.setType == "http") {
//针对http数据源 //针对http数据源
console.log("http数据集" + this.httpForm); console.log("http数据集" + this.httpForm);
this.formData.dynSentence = JSON.stringify(this.httpForm) this.formData.dynSentence = JSON.stringify(this.httpForm);
} }
if (tab.paneName == "third") { if (tab.paneName == "third") {
const params = { const params = {
@ -792,7 +813,7 @@ export default {
// 删除filter // 删除filter
reduceFilter(item) { reduceFilter(item) {
if (this.itemFilterList.length > 0) { if (this.itemFilterList.length > 0) {
var index = this.itemFilterList.indexOf(item); let index = this.itemFilterList.indexOf(item);
if (index > -1) { if (index > -1) {
this.itemFilterList.splice(index, 1); this.itemFilterList.splice(index, 1);
} }
@ -840,11 +861,11 @@ export default {
// 自定义高级规则 // 自定义高级规则
async testResultset() { async testResultset() {
this.isRowData.validationRules = this.validationRules; this.isRowData.validationRules = this.validationRules;
console.log(this.isRowData,"12345678") console.log(this.isRowData, "12345678");
const { code, message, data } = await verificationSet(this.isRowData); const { code, message, data } = await verificationSet(this.isRowData);
if (code == "200") { if (code == "200") {
if (data) { if (data) {
this.$message.success("返回结果："+ data); this.$message.success("返回结果：" + data);
} else { } else {
this.$message.warning("当前示例值校验不通过"); this.$message.warning("当前示例值校验不通过");
} }
@ -869,12 +890,12 @@ export default {
}); });
}, },
async submit(formName) { async submit(formName) {
if (this.setType == 'http') { if (this.setType == "http") {
//针对http数据源 //针对http数据源
console.log("http数据集" + this.httpForm); console.log("http数据集" + this.httpForm);
this.formData.dynSentence = JSON.stringify(this.httpForm) this.formData.dynSentence = JSON.stringify(this.httpForm);
} }
this.formData.setType = this.setType this.formData.setType = this.setType;
this.$refs[formName].validate(async (valid, obj) => { this.$refs[formName].validate(async (valid, obj) => {
if (valid) { if (valid) {
if (this.testMassageCode == 200) { if (this.testMassageCode == 200) {
@ -884,12 +905,12 @@ export default {
if (this.dialogFormVisibleTitle === "新增数据集") { if (this.dialogFormVisibleTitle === "新增数据集") {
const { code } = await addDataSet(this.formData); const { code } = await addDataSet(this.formData);
if (code != "200") return; if (code != "200") return;
this.$emit('refreshList') this.$emit("refreshList");
this.closeDialog(); this.closeDialog();
} else { } else {
const { code } = await editDataSet(this.formData); const { code } = await editDataSet(this.formData);
if (code != "200") return; if (code != "200") return;
this.$emit('refreshList') this.$emit("refreshList");
this.closeDialog(); this.closeDialog();
} }
} else { } else {

Write Preview
Loading…
Cancel
Save