Skip to content

E
exhibition_backstage
提交 6d93b736 authored 作者: 龙菲's avatar 龙菲
浏览文件
操作

修改首页和布展单元

上级 cccdc65b
隐藏空白字符变更
内嵌 并排
正在显示 包含 632 行增加 和 59 行删除
package.json
浏览文件 @ 6d93b736
......@@ -16,6 +16,7 @@
"dependencies": {
"axios": "0.18.1",
"core-js": "3.6.5",
"echarts": "^5.3.3",
"element-ui": "2.13.2",
"js-cookie": "2.2.0",
"normalize.css": "7.0.0",
......
src/components/Breadcrumb/index.vue
浏览文件 @ 6d93b736
......@@ -37,6 +37,8 @@ export default {
}
this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
},
isDashboard(route) {
const name = route && route.name
......
src/components/Echarts/index.vue 0 → 100644
浏览文件 @ 6d93b736
<template>
<div :id="id" :class="className" :style="{ height: height, width: width }" />
</template>
<script>
// import tdTheme from './theme.json' // 引入默认主题
import resizeMixins from "@/utils/resizeMixin";
// import '../map/fujian.js'
export default {
name: 'echart',
mixins: [resizeMixins],
props: {
className: {
type: String,
default: 'chart'
},
id: {
type: String,
default: 'chart'
},
width: {
type: String,
default: '100%'
},
height: {
type: String,
default: '2.5rem'
},
options: {
type: Object,
default: ()=>({})
}
},
data () {
return {
chart: null
}
},
watch: {
options: {
handler (options) {
// 设置true清空echart缓存
this.chart.setOption(options, true)
},
deep: true
}
},
mounted () {
// this.$echarts.registerTheme('tdTheme', tdTheme); // 覆盖默认主题
this.initChart();
},
methods: {
initChart () {
// 初始化echart
this.chart = this.$echarts.init(this.$el)
this.$emit('myCharts', this.chart) // 把实例丢出来
this.chart.setOption(this.options, true)
}
}
}
</script>
<style>
</style>
\ No newline at end of file
src/components/Uploader/ManualUploader.vue
浏览文件 @ 6d93b736
......@@ -43,7 +43,7 @@ export default {
// 大小限制(MB)
fileSize: {
type: Number,
default: 5,
default: 50,
},
// 文件类型, 例如["doc", "xls", "ppt", "txt", "pdf"]
fileType: {
......
src/main.js
浏览文件 @ 6d93b736
......@@ -18,7 +18,11 @@ import {
getFullUrl
} from '@/utils/index'
import * as echarts from 'echarts';
Vue.prototype.$getFullUrl = getFullUrl
Vue.prototype.$echarts = echarts
Vue.use(ElementUI)
......
src/utils/resizeMixin.js 0 → 100644
浏览文件 @ 6d93b736
// 混入代码 resize-mixins.js
import { Debounce } from '@/utils';
const resizeChartMethod = '$__resizeChartMethod';
export default {
data() {
// 在组件内部将图表 init 的引用映射到 chart 属性上
return {
chart: null,
};
},
created() {
window.addEventListener('resize', this[resizeChartMethod], false);
},
activated() {
// 防止 keep-alive 之后图表变形
if (this.chart) {
this.chart.resize()
}
},
beforeDestroy() {
window.removeEventListener('reisze', this[resizeChartMethod]);
},
methods: {
// 防抖函数来控制 resize 的频率
[resizeChartMethod]: Debounce(function() {
if (this.chart) {
this.chart.resize();
}
}, 300),
},
};
src/views/display/components/ExhibitionUnit.vue
浏览文件 @ 6d93b736
......@@ -120,14 +120,14 @@
v-if="!treeData.length > 0"
type="primary"
icon="el-icon-circle-plus-outline"
@click="handleAddUnit"
@click="handleAddUnit('manual')"
size="small"
>手动添加展览单元</el-button
>
<el-button
v-if="!treeData.length > 0"
type="success"
@click="handleAddUnit"
@click="handleAddUnit('word')"
size="small"
>
<svg-icon icon-class="word"></svg-icon>
......@@ -136,7 +136,7 @@
<el-button
v-if="!treeData.length > 0"
type="success"
@click="handleAddUnit"
@click="handleAddUnit('excel')"
size="small"
>
<svg-icon icon-class="excel"></svg-icon>
......@@ -338,19 +338,26 @@ export default {
children.splice(index, 1);
},
handleAddUnit() {
let obj = {
euId: 1, //后期去掉
unit: "", //单元名称,如前言、第一单元，暂时忽略
title: "单元标题", //单元标题，类似主题名称
intro: "", //单元介绍
images: "", //图片id集合
videos: "", //视频id集合
crIds: [], //关联文物集合
// showMediaUploader: false,
};
this.$set(this.treeData, 0, obj);
this.currentData = this.treeData[0];
handleAddUnit(type) {
switch (type) {
case "manual":
let obj = {
euId: 1, //后期去掉
unit: "", //单元名称,如前言、第一单元，暂时忽略
title: "单元标题", //单元标题，类似主题名称
intro: "", //单元介绍
images: "", //图片id集合
videos: "", //视频id集合
crIds: [], //关联文物集合
// showMediaUploader: false,
};
this.$set(this.treeData, 0, obj);
this.currentData = this.treeData[0];
break;
default:
this.$message.info('该功能仍在开发中，敬请期待')
break;
}
},
//失去焦点事件
......@@ -483,7 +490,7 @@ export default {
.ql-snow .ql-tooltip[data-mode="video"]::before {
content: "请输入视频地址:";
}
.ql-snow .ql-picker{
.ql-snow .ql-picker {
height: 40px;
}
.ql-snow .ql-picker.ql-size .ql-picker-label::before,
......
src/views/display/components/InfoEditDialog.vue
浏览文件 @ 6d93b736
......@@ -82,7 +82,7 @@
</el-input>
</el-form-item>
<el-form-item label="展览介绍" :label-width="formLabelWidth">
<el-input
<!-- <el-input
type="textarea"
placeholder="请输入展览介绍"
v-model="dialogForm.intro"
......@@ -90,7 +90,13 @@
show-word-limit
rows="6"
>
</el-input>
</el-input> -->
<quill-editor
ref="myQuillEditor"
v-model="dialogForm.intro"
:options="editorOption"
class=".editor"
/>
</el-form-item>
<el-form-item label="展览封面" :label-width="formLabelWidth">
<ManualUploader
......@@ -229,11 +235,13 @@ import ExhibitionUnit from "./ExhibitionUnit.vue";
import { upload, uploadV1 } from "@/utils/file";
import { themeTypeOptions } from "../contants";
import { deleteFiles } from "@/api/file";
import { quillEditor } from "vue-quill-editor";
export default {
name: "InfoEditDialog",
components: {
ManualUploader,
ExhibitionUnit,
quillEditor
// PageSelect,
},
props: {
......@@ -339,13 +347,25 @@ export default {
immediate: true,
},
},
async created() {
await this.$store.dispatch("dict/getDictList", [
"display_type",
"display_character",
]);
},
data() {
// 工具栏配置
const toolbarOptions = [
["bold", "italic", "underline", "strike"], // 加粗 斜体 下划线 删除线 -----['bold', 'italic', 'underline', 'strike']
["blockquote", "code-block"], // 引用 代码块-----['blockquote', 'code-block']
[{ header: 1 }, { header: 2 }], // 1、2 级标题-----[{ header: 1 }, { header: 2 }]
[{ list: "ordered" }, { list: "bullet" }], // 有序、无序列表-----[{ list: 'ordered' }, { list: 'bullet' }]
[{ script: "sub" }, { script: "super" }], // 上标/下标-----[{ script: 'sub' }, { script: 'super' }]
[{ indent: "-1" }, { indent: "+1" }], // 缩进-----[{ indent: '-1' }, { indent: '+1' }]
[{ direction: "rtl" }], // 文本方向-----[{'direction': 'rtl'}]
[{ size: ["small", false, "large", "huge"] }], // 字体大小-----[{ size: ['small', false, 'large', 'huge'] }]
[{ header: [1, 2, 3, 4, 5, 6, false] }], // 标题-----[{ header: [1, 2, 3, 4, 5, 6, false] }]
[{ color: [] }, { background: [] }], // 字体颜色、字体背景颜色-----[{ color: [] }, { background: [] }]
[{ font: [] }], // 字体种类-----[{ font: [] }]
[{ align: [] }], // 对齐方式-----[{ align: [] }]
["clean"], // 清除文本格式-----['clean']
["image", "video"], // 链接、图片、视频-----['link', 'image', 'video']
];
return {
dialogForm: {
...this.form,
......@@ -366,8 +386,26 @@ export default {
videos: [],
audios: [],
pageSelectUrl: "/api/bizCulturalRelic/listByPage",
//富文本编辑器配置
editorOption: {
// 富文本编辑器配置
modules: {
//工具栏定义的
toolbar: toolbarOptions,
},
//主题
theme: "snow",
placeholder: "请输入单元介绍",
},
};
},
async created() {
await this.$store.dispatch("dict/getDictList", [
"display_type",
"display_character",
]);
},
methods: {
// 关联文献查询
searchLiterature(queryString) {
......@@ -653,14 +691,18 @@ export default {
params.status = this.dialogForm.status ? 1 : 0;
params.crIds = this.crIds.join(",");
params.displayCharacter = 1; //传布展
let res = await addDisplay(params);
if (res.code == 0) {
this.$message.success("提交成功！");
this.loading = false;
this.$emit("refresh");
this.reload();
}
addDisplay(params)
.then((res) => {
if (res.code == 0) {
this.$message.success("提交成功！");
this.loading = false;
this.$emit("refresh");
this.reload();
}
})
.catch((err) => {
this.loading = false;
});
} else {
const {
exhibitionId,
......@@ -707,14 +749,25 @@ export default {
};
// return;
let res = await editDisplay(params);
let deleteRes = await deleteFiles(deleteFileArr);
if (res.code == 0 && deleteRes.code == 0) {
this.$message.success("提交成功！");
this.loading = false;
this.$emit("refresh");
this.reload();
}
editDisplay(params)
.then(async (res) => {
let deleteRes;
console.log(res);
// return
if (deleteFileArr.length > 0) {
await deleteFiles(deleteFileArr);
}
if (res.code == 0) {
this.$message.success("提交成功！");
this.$emit("refresh");
this.reload();
this.loading = false;
}
})
.catch((err) => {
console.log("err222222", err);
this.loading = false;
});
}
// }
......
src/views/home/config.js 0 → 100644
浏览文件 @ 6d93b736
export const title = [{
prop: "name",
label: "名称",
columnAlign: 'center',
width:120
},
{
prop: "unit",
label: "馆藏单位/展览单位",
columnAlign: 'center',
},
{
prop: "regionName",
label: "所在地区",
columnAlign: 'center',
},
{
prop: "dj",
label: "点击量",
columnAlign: 'center',
},
{
prop: "dz",
label: "点赞量",
columnAlign: 'center',
},
{
prop: "sc",
label: "收藏量",
columnAlign: 'center',
},
]
src/views/home/index.vue
浏览文件 @ 6d93b736
<template>
<div class="dashboard-container">
<div class="dashboard-text">首页</div>
<div class="home">
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="用户行为数据统计" name="behavior">
<div style="height: 400px;">
<Echart :options="options" id="可选" height='100%' width="100%" v-if="options"></Echart>
</div>
<el-card class="box-card" style="margin-top: 20px;">
<div slot="header" class="clearfix">
<div style="float: left;font-weight: bold;">精品展数据统计</div>
<el-radio-group v-model="radio" style="float: right;">
<el-radio :label="1">精品展</el-radio>
<el-radio :label="2">展览</el-radio>
<el-radio :label="3">文物</el-radio>
</el-radio-group>
</div>
<TablePage :data="list.records" :tableTitle="tableTitle">
</TablePage>
</el-card>
</el-tab-pane>
<el-tab-pane label="展览数据统计" name="amount">
<h3>精品展地区分布图</h3>
<el-card>
精品展地区分布
</el-card>
<h3>展览数据</h3>
<el-row :gutter="16">
<el-col :span="12">
<el-card>
<div slot="header" style="display: flex;justify-content: space-between; align-items: center;">
<div>展览分布统计
</div>
<el-radio-group v-model="radio" style="float: right;">
<el-radio :label="1">按地区</el-radio>
<el-radio :label="2">按博物馆</el-radio>
</el-radio-group>
</div>
展览分布统计饼图
</el-card>
</el-col>
<el-col :span="12">
<el-card>
<div slot="header" style="display: flex;justify-content: space-between; align-items: center;">
<div>展览类别统计</div>
<el-radio-group v-model="radio" style="float: right;">
<el-radio :label="1">按类型</el-radio>
<!-- <el-radio :label="2">按</el-radio> -->
</el-radio-group>
</div>
展览类别统计饼图
</el-card>
</el-col>
</el-row>
<h3>文物数据</h3>
<el-row :gutter="16">
<el-col :span="12">
<el-card>
<div slot="header" style="display: flex;justify-content: space-between; align-items: center;">
<div>文物分布统计
</div>
<el-radio-group v-model="radio" style="float: right;">
<el-radio :label="1">按地区</el-radio>
<el-radio :label="2">按博物馆</el-radio>
</el-radio-group>
</div>
文物分布统计饼图
</el-card>
</el-col>
<el-col :span="12">
<el-card>
<div slot="header" style="display: flex;justify-content: space-between; align-items: center;">
<div>文物类别统计</div>
<el-radio-group v-model="radio" style="float: right;">
<el-radio :label="1">按类型</el-radio>
<el-radio :label="2">按年代</el-radio>
</el-radio-group>
</div>
文物类别统计饼图
</el-card>
</el-col>
</el-row>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
import TablePage from "@/components/Table/TablePage.vue";
import { title } from "./config";
import Echart from '@/components/Echarts' //引入echatrs组件
export default {
name: 'Home',
computed: {
...mapGetters([
'name'
])
]),
tableTitle() {
return title;
},
},
components: {
TablePage, Echart,
},
data() {
return {
activeName: 'behavior',
radio: 1,
list: {
records: [
{
name: '神秘贵州',
unit: '贵州省地质博物馆',
regionName: '贵阳市',
dj: 100,
dz: 8,
sc: 7
},
{
name: '夜郎的疑问',
unit: '黔西南州博物馆',
regionName: '黔西南州',
dj: 99,
dz: 6,
sc: 7
},
{
name: '四渡赤水',
unit: '遵义博物馆',
regionName: '遵义市',
dj: 96,
dz: 4,
sc: 9
}
]
},
options: null
}
},
mounted() {
this.getBehaviorData()
},
methods: {
getBehaviorData() {
var pie_color = ['#00A5B9', '#FFD71D', '#F76464', '#56A3FF', '#32D790', '#F4B561', '#7080DB', '#DF7A90',
'#3CC4EF', '#EF7F3C', '#EF3C81', '#0DBF8C', '#2F73C0', '#C55E18', '#C899FF', '#C6D727',
'#FF688F', '#87A0DC', '#00D9F7', '#A24EED'
];
var legendList = [];
var pieData = [{
name: 'A 农、林、牧、渔业',
value: 290
}, {
name: 'B 采矿业',
value: 40
}, {
name: 'C 制造业',
value: 320
}, {
name: 'D 电力、热力、燃气及水生产和供应业',
value: 540
}, {
name: 'E 建筑业',
value: 25
}, {
name: 'F 批发和零售业',
value: 90
}, {
name: 'G 交通运输、仓储和邮政业',
value: 450
}, {
name: 'H 住宿和餐饮业',
value: 120
}, {
name: 'I 信息传输、软件和信息技术服务业',
value: 288
}, {
name: 'J 金融业',
value: 344
}, {
name: 'K 房地产业',
value: 571
}, {
name: 'L 租赁和商务服务业',
value: 842
}, {
name: 'M 科学研究和技术服务业',
value: 120
}, {
name: 'N 水利、环境和公共设施管理业',
value: 430
}, {
name: 'O 居民服务、修理和其他服务业',
value: 403
}, {
name: 'Q 卫生和社会工作',
value: 600
}, {
name: 'R 文化、体育和娱乐业',
value: 787
}, {
name: 'S 公共管理、社会保障和社会组织',
value: 91
}, {
name: 'T 国际组织',
value: 34
}];
for (var i = 0; i < pieData.length; i++) {
legendList.push(pieData[i].name);
}
this.options = {
color: pie_color,
title: {
show: false,
text: '',
textStyle: {
color: '#333333',
fontSize: 16,
},
},
grid: {
show: false,
left: '2%',
right: '50%',
bottom: 0,
top: '2%',
containLabel: true
},
legend: {
bottom: '4%',
right: '10%',
orient: 'vertical',
width: 540,
height: 240,
padding: [14, 20],
backgroundColor: 'rgba(236,246,255,0.30)',
borderWidth: 1,
borderColor: '#E7F2FB',
borderRadius: 4,
icon: 'circle',
itemWidth: 8,
itemHeight: 8,
textStyle: {
color: '#333333',
fontSize: 12,
},
data: legendList,
},
xAxis: {
type: 'value',
gridIndex: 0,
name: '家',
nameTextStyle: {
color: '#9B9B9B',
fontSize: 14
},
axisLabel: {
color: '#727272',
fontSize: 14,
},
axisLine: {
show: true,
lineStyle: {
color: '#333333',
opacity: 0.35,
}
},
axisTick: {
show: true,
inside: true,
lineStyle: {
color: '#333333',
opacity: 0.35,
}
},
splitLine: {
show: false
}
},
yAxis: {
type: 'category',
gridIndex: 0,
data: legendList,
inverse: true,
axisLabel: {
color: '#727272',
fontSize: 14,
},
axisLine: {
show: true,
lineStyle: {
color: '#333333',
opacity: 0.35,
}
},
axisTick: {
show: false
},
splitLine: {
show: false
}
},
series: [{
name: '柱状图',
type: 'bar',
xAxisIndex: 0,
yAxisIndex: 0,
data: pieData,
label: {
show: true,
position: 'right',
color: '#4A4A4A',
fontSize: 14,
},
barWidth: 20,
itemStyle: {
color: {
type: 'linear',
x: 0,
y: 0,
x1: 0,
y1: 1,
colorStops: [{
offset: 0,
color: '#FF9A91'
}, {
offset: 1,
color: '#F8B44F'
}],
global: false
},
barBorderRadius: [0, 10, 10, 0]
}
}, {
type: 'pie',
radius: ['10%', '36%'],
center: ['75%', '30%'],
data: pieData,
hoverAnimation: false,
label: {
show: true,
position: 'outside',
formatter: '{b}：{d}%',
},
zlevel: 2
}, {
name: '外圈',
type: 'pie',
radius: ['36%', '37.5%'],
center: ['75%', '30%'],
hoverAnimation: false,
itemStyle: {
color: 'rgb(21 132 214 / 0.1)',
},
emphasis: {
itemStyle: {
color: 'rgb(21 132 214 / 0.1)'
}
},
labelLine: {
show: false
},
data: [{
value: 1
}],
zlevel: 1
}, {
name: '内圈',
type: 'pie',
radius: ['8.5%', '10%'],
center: ['75%', '30%'],
hoverAnimation: false,
itemStyle: {
color: 'rgb(21 132 214 / 0.1)',
},
emphasis: {
itemStyle: {
color: 'rgb(21 132 214 / 0.1)'
}
},
labelLine: {
show: false
},
data: [{
value: 1
}],
zlevel: 1
}]
}
}
}
}
</script>
<style lang="scss" scoped>
.dashboard {
&-container {
margin: 30px;
}
&-text {
font-size: 30px;
line-height: 46px;
}
.home {
padding: 16px;
}
</style>
src/views/log/index.vue
浏览文件 @ 6d93b736
......@@ -27,7 +27,7 @@
<script>
import TablePage from "@/components/Table/TablePage.vue";
import TableOperation from "@/components/Table/TableOperation.vue";
import { title,operates } from "./config";
import { title } from "./config";
import { getLogList } from "@/api/log";
import SearchBar from "@/components/SearchBar";
......
vue.config.js
浏览文件 @ 6d93b736
......@@ -31,7 +31,8 @@ module.exports = {
lintOnSave: false,
productionSourceMap: false,
devServer: {
host: '172.24.100.18',
// host: '172.24.100.18',
host:'127.0.0.1',
port: port,
open: true,
overlay: {
......@@ -40,15 +41,16 @@ module.exports = {
},
proxy: {
'/api': {
target: 'http://192.168.1.230:9566/api',
// target:'http://222.85.214.245:9066/api',
// target: 'http://192.168.1.230:9566/api',
target:'http://222.85.214.245:9566/api',
changeOrigin: true,
pathRewrite: {
'^/api': ''
}
},
'/files': {
target: 'http://192.168.1.230:9563/files',
// target: 'http://192.168.1.230:9563/files',
target: 'http://222.85.214.245:9563/files',
changeOrigin: true,
pathRewrite: {
'^/files': ''
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论