Skip to content

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

完善审批管理

上级 ba3882c5
隐藏空白字符变更
内嵌 并排
正在显示 包含 1216 行增加 和 1334 行删除
src/api/display.js
浏览文件 @ e807e5ce
......@@ -77,7 +77,7 @@ export function getDisplayCheckById(params) {
})
}
// 查询审批结果
// 审批
export function postCheck(data) {
return request({
url: '/bizCheck/check',
......
src/components/Table/TableOperation.vue
浏览文件 @ e807e5ce
......@@ -3,11 +3,11 @@
<span v-for="(op, index) in operations" :key="index">
<span v-if="op.type == 'delete'">
<el-popconfirm :title="deleteTitle ? deleteTitle : '确定删除吗？'" @onConfirm="clickOperation(op)">
<el-button type="danger" size="mini" slot="reference" :icon="icons[op.type]" style="margin-right: 4px">
<el-button type="danger" :disabled="disabled" size="mini" slot="reference" :icon="icons[op.type]" style="margin-right: 4px">
{{ op.title }}</el-button>
</el-popconfirm>
</span>
<el-button size="mini" :icon="icons[op.type]" @click="clickOperation(op)" type="primary" style="margin-right: 4px"
<el-button size="mini" :icon="icons[op.type]" :disabled="(disabled &&op.type!='view')" @click="clickOperation(op)" type="primary" style="margin-right: 4px"
v-else>{{ op.title }}
</el-button>
</span>
......@@ -27,6 +27,10 @@ export default {
deleteTitle: {
type: String,
},
disabled:{
type: Boolean,
default:false
}
},
data() {
return {
......
src/components/Uploader/ManualUploader.vue
浏览文件 @ e807e5ce
......@@ -3,11 +3,11 @@
<div class="images-list">
<el-upload :disabled="onlyRead" action="#" :on-remove="handleRemove" :on-exceed="handleExceed" :on-change="handleChange"
:file-list="fileList" :multiple="fileLimit > 1" :limit="fileLimit" :list-type="listType" :accept="fileAccept"
:auto-upload="false" ref="ManualUploader" :class="{ disabled: uploadDisabled }">
<i v-if="listType === 'picture-card'" class="el-icon-plus" slot="trigger"></i>
<el-button v-else size="small" type="primary" >点击上传</el-button>
:auto-upload="false" ref="ManualUploader" :class="{ disabled: uploadDisabled || onlyRead }">
<i v-if="listType === 'picture-card'" class="el-icon-plus" slot="trigger" ></i>
<el-button size="small" type="primary" v-else-if="!onlyRead">点击上传</el-button>
<div v-if="showTip" slot="tip" class="el-upload__tip">
<div v-if="(showTip && !onlyRead)" slot="tip" class="el-upload__tip">
<div v-if="advice" style="color: #f56c6c">建议：{{ advice }}</div>
提示：只能上传{{ fileTypeName || "jpg/png" }}文件，且不超过
{{ fileSize }}MB，最多上传{{ fileLimit }}个文件
......@@ -210,7 +210,7 @@ export default {
};
</script>
<style lang="scss" >
.disabled .el-upload--picture-card {
.disabled .el-upload--picture-card,.el-upload--card {
display: none !important;
}
......
src/components/Uploader/ManualUploaderBind.vue
浏览文件 @ e807e5ce
<template>
<div class="images-list">
<el-upload
action="#"
:on-remove="handleRemove"
:on-exceed="handleExceed"
:on-change="handleChange"
:file-list="fileList"
:multiple="fileLimit > 1"
:limit="fileLimit"
:list-type="listType"
:accept="fileAccept"
:auto-upload="false"
ref="ManualUploaderBind"
:class="{ disabled: uploadDisabled }"
>
<i
v-if="listType === 'picture-card'"
class="el-icon-plus"
slot="trigger"
></i>
<el-button v-else size="small" type="primary">点击上传</el-button>
<div v-if="showTip" slot="tip" class="el-upload__tip">
<div v-if="advice" style="color: #f56c6c">建议：{{ advice }}</div>
提示：只能上传{{ fileTypeName || "jpg/png" }}文件，且不超过
{{ fileSize }}MB，最多上传{{ fileLimit }}个文件
</div>
</el-upload>
</div>
</template>
<script>
export default {
name: "ManualUploaderBind",//用于使用双向绑定的父组件
props: {
// // 用于v-model绑定
value: {
type: [Number, Array, String],
},
// 大小限制(MB)
fileSize: {
type: Number,
default: 50,
},
// 文件类型, 例如["doc", "xls", "ppt", "txt", "pdf"]
fileType: {
type: Array,
default: () => ["png", "jpg", "jpeg"],
},
// 文件列表类型 text/picture/picture-card
listType: {
type: String,
default: "picture",
},
// 是否显示提示
isShowTip: {
type: Boolean,
default: true,
},
// 最大允许上传个数
fileLimit: {
type: Number,
default: 99,
},
//建议
advice: {
type: String,
},
<div class="images-list">
<el-upload action="#" :on-remove="handleRemove" :on-exceed="handleExceed" :on-change="handleChange"
:file-list="fileList" :multiple="fileLimit > 1" :limit="fileLimit" :list-type="listType" :accept="fileAccept"
:auto-upload="false" ref="ManualUploaderBind" :class="{ disabled: uploadDisabled || onlyRead }">
<i v-if="listType === 'picture-card'" class="el-icon-plus" slot="trigger"></i>
<el-button v-else size="small" type="primary">点击上传</el-button>
<div v-if="(showTip &&!onlyRead)" slot="tip" class="el-upload__tip">
<div v-if="advice" style="color: #f56c6c">建议：{{ advice }}</div>
提示：只能上传{{ fileTypeName || "jpg/png" }}文件，且不超过
{{ fileSize }}MB，最多上传{{ fileLimit }}个文件
</div>
</el-upload>
</div>
</template>
<script>
export default {
name: "ManualUploaderBind",//用于使用双向绑定的父组件
props: {
// // 用于v-model绑定
value: {
type: [Number, Array, String],
},
data() {
return {
fileList: [],
};
},
watch: {
value: {
handler: function (val) {
// 将回填的字段从url-->pressUrl
if (val) {
let tempList = [...val];
this.fileList = tempList.map((item) => {
if (item.status == "ready") {
return item;
} else {
return {
highImg: item.url,
lowImg: item.pressUrl,
url: item.pressUrl,
// pressUrl:item.pressUrl,
name: item.name,
fileId: item.fileId,
};
}
});
} else {
this.fileList = [];
}
},
immediate: true,
deep: true,
},
// 大小限制(MB)
fileSize: {
type: Number,
default: 50,
},
computed: {
// 是否显示提示
showTip() {
return this.isShowTip && (this.fileType || this.fileSize);
},
fileTypeName() {
let typeName = "";
this.fileType.forEach((item) => {
typeName += `${item}，`;
});
return typeName;
},
fileAccept() {
let fileAccept = "";
this.fileType.forEach((element) => {
fileAccept += `.${element},`;
});
return fileAccept;
},
uploadDisabled() {
return this.fileList.length == this.fileLimit;
},
// 文件类型, 例如["doc", "xls", "ppt", "txt", "pdf"]
fileType: {
type: Array,
default: () => ["png", "jpg", "jpeg"],
},
methods: {
// 上传前校检格式和大小
handleBeforeUpload(file) {
return new Promise((resolve, reject) => {
var isValidated = true;
if (this.fileType && file) {
let fileExtension = "";
if (file.name.lastIndexOf(".") > -1) {
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
}
const isTypeOk = this.fileType.some((type) => {
if (file.raw.type.indexOf(type) > -1) return true;
if (fileExtension && fileExtension.indexOf(type) > -1) return true;
return false;
});
if (!isTypeOk & file) {
this.$message.error(
`文件格式不正确, 请上传${this.fileType.join("/")}格式文件!`
);
isValidated = false;
}
}
// 校检文件大小
if (this.fileSize && file) {
const isLt = file.size / 1024 / 1024 < this.fileSize;
if (!isLt) {
this.$message.error(`上传文件大小不能超过 ${this.fileSize} MB!`);
isValidated = false;
}
}
if (isValidated) {
resolve(file);
} else {
reject("验证失败");
}
});
},
handleUploadError(err) {
this.$message.error("上传失败, 请重试");
},
// 文件个数超出
handleExceed() {
this.$message.error(`超出上传文件个数,请删除以后再上传！`);
},
// 文件列表移除文件时的钩子
handleRemove(file, fileList) {
let that = this;
that.fileList.map(async (item, index) => {
if (item.uid === file.uid) {
that.fileList.splice(index, 1);
}
});
if (
this.fileType.indexOf("jpg") != -1 ||
this.fileType.indexOf("jpeg") != -1 ||
this.fileType.indexOf("png") != -1
) {
let newFileList = that.fileList.map((item) => {
// 文件列表类型 text/picture/picture-card
listType: {
type: String,
default: "picture",
},
// 是否显示提示
isShowTip: {
type: Boolean,
default: true,
},
// 最大允许上传个数
fileLimit: {
type: Number,
default: 99,
},
//建议
advice: {
type: String,
},
onlyRead: {
type: Boolean,
default: false
}
},
data() {
return {
fileList: [],
};
},
watch: {
value: {
handler: function (val) {
// 将回填的字段从url-->pressUrl
if (val) {
let tempList = [...val];
this.fileList = tempList.map((item) => {
if (item.status == "ready") {
return item;
} else {
item.url = item.highImg;
item.pressUrl = item.lowImg;
item.name = item.name;
item.fileId = item.fileId;
return item;
return {
highImg: item.url,
lowImg: item.pressUrl,
url: item.pressUrl,
// pressUrl:item.pressUrl,
name: item.name,
fileId: item.fileId,
};
}
});
that.$emit("input", newFileList);
} else {
that.$emit("input", that.fileList);
this.fileList = [];
}
},
handleChange(file, fileList) {
let that = this;
if (fileList.length == this.fileLimit) {
this.maxNum = this.fileLimit;
immediate: true,
deep: true,
},
},
computed: {
// 是否显示提示
showTip() {
return this.isShowTip && (this.fileType || this.fileSize);
},
fileTypeName() {
let typeName = "";
this.fileType.forEach((item) => {
typeName += `${item}，`;
});
return typeName;
},
fileAccept() {
let fileAccept = "";
this.fileType.forEach((element) => {
fileAccept += `.${element},`;
});
return fileAccept;
},
uploadDisabled() {
return this.fileList.length == this.fileLimit;
},
},
methods: {
// 上传前校检格式和大小
handleBeforeUpload(file) {
return new Promise((resolve, reject) => {
var isValidated = true;
if (this.fileType && file) {
let fileExtension = "";
if (file.name.lastIndexOf(".") > -1) {
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
}
const isTypeOk = this.fileType.some((type) => {
if (file.raw.type.indexOf(type) > -1) return true;
if (fileExtension && fileExtension.indexOf(type) > -1) return true;
return false;
});
if (!isTypeOk & file) {
this.$message.error(
`文件格式不正确, 请上传${this.fileType.join("/")}格式文件!`
);
isValidated = false;
}
}
if (file.status === "ready") {
this.handleBeforeUpload(file)
.then((res) => {
that.fileList.push(res);
if (
this.fileType.indexOf("jpg") != -1 ||
this.fileType.indexOf("jpeg") != -1 ||
this.fileType.indexOf("png") != -1
) {
let tempList = [...that.fileList];
let newFileList = tempList.map((item) => {
if (item.status == "ready") {
return item;
} else {
item.url = item.highImg;
item.pressUrl = item.lowImg;
item.name = item.name;
item.fileId = item.fileId;
return item;
}
});
that.$emit("input", newFileList);
} else {
that.$emit("input", that.fileList);
}
})
.catch((err) => {
console.log("err", err);
});
// 校检文件大小
if (this.fileSize && file) {
const isLt = file.size / 1024 / 1024 < this.fileSize;
if (!isLt) {
this.$message.error(`上传文件大小不能超过 ${this.fileSize} MB!`);
isValidated = false;
}
}
},
if (isValidated) {
resolve(file);
} else {
reject("验证失败");
}
});
},
handleUploadError(err) {
this.$message.error("上传失败, 请重试");
},
};
</script>
<style lang="scss" >
.disabled .el-upload--picture-card {
display: none !important;
}
.el-upload-list__item {
transition: none !important;
}
</style>
\ No newline at end of file
// 文件个数超出
handleExceed() {
this.$message.error(`超出上传文件个数,请删除以后再上传！`);
},
// 文件列表移除文件时的钩子
handleRemove(file, fileList) {
let that = this;
that.fileList.map(async (item, index) => {
if (item.uid === file.uid) {
that.fileList.splice(index, 1);
}
});
if (
this.fileType.indexOf("jpg") != -1 ||
this.fileType.indexOf("jpeg") != -1 ||
this.fileType.indexOf("png") != -1
) {
let newFileList = that.fileList.map((item) => {
if (item.status == "ready") {
return item;
} else {
item.url = item.highImg;
item.pressUrl = item.lowImg;
item.name = item.name;
item.fileId = item.fileId;
return item;
}
});
that.$emit("input", newFileList);
} else {
that.$emit("input", that.fileList);
}
},
handleChange(file, fileList) {
let that = this;
if (fileList.length == this.fileLimit) {
this.maxNum = this.fileLimit;
}
if (file.status === "ready") {
this.handleBeforeUpload(file)
.then((res) => {
that.fileList.push(res);
if (
this.fileType.indexOf("jpg") != -1 ||
this.fileType.indexOf("jpeg") != -1 ||
this.fileType.indexOf("png") != -1
) {
let tempList = [...that.fileList];
let newFileList = tempList.map((item) => {
if (item.status == "ready") {
return item;
} else {
item.url = item.highImg;
item.pressUrl = item.lowImg;
item.name = item.name;
item.fileId = item.fileId;
return item;
}
});
that.$emit("input", newFileList);
} else {
that.$emit("input", that.fileList);
}
})
.catch((err) => {
console.log("err", err);
});
}
},
},
};
</script>
<style lang="scss" >
.disabled .el-upload--picture-card {
display: none !important;
}
.el-upload-list__item {
transition: none !important;
}
</style>
\ No newline at end of file
src/main.js
浏览文件 @ e807e5ce
......@@ -13,14 +13,16 @@ import router from './router'
import '@/icons' // icon
import '@/permission' // permission control
import VideoPlayer from 'vue-video-player'
import {
getFullUrl
} from '@/utils/index'
import * as echarts from 'echarts';
Vue.use(VideoPlayer)
Vue.prototype.$getFullUrl = getFullUrl
Vue.prototype.$echarts = echarts
......
src/views/approval/components/BaseInfo.vue
浏览文件 @ e807e5ce
<template>
<div>
<div class="base-info">
<el-form :model="displayDetail" class="basic-info" ref="form">
<el-row :gutter="50">
<el-col :span="12">
<el-col :span="10">
<el-form-item label="展览标题" :label-width="formLabelWidth">
<el-input disabled v-model="displayDetail.title" autocomplete="off" placeholder="暂无数据"
<el-input disabled v-model="displayDetail.title" autocomplete="off" placeholder="无"
clearable></el-input>
</el-form-item>
<el-form-item label="展览介绍" :label-width="formLabelWidth">
<div style="background-color: #F5F7FA;border:1px solid #E4E7ED;color: #C0C4CC;padding: 0 10px;border-radius: 4px;"
v-html="displayDetail.intro"></div>
<div v-if="(displayDetail.intro.length > 0)" class="intro" v-html="displayDetail.intro"></div>
<div v-else class="intro">暂无</div>
</el-form-item>
<el-form-item label="展览单位" :label-width="formLabelWidth">
<el-cascader disabled style="width: 100%" v-model="displayDetail.deptId" :options="orgTreeData"
:props="optionProps" placeholder="暂无数据" clearable>
:props="optionProps" placeholder="无" clearable>
</el-cascader>
</el-form-item>
<el-form-item label="展览地区" :label-width="formLabelWidth">
<el-cascader disabled class="years item" style="width: 100%" v-model="displayDetail.regionCode"
:options="regionTree" :props="culturalRegionProps" placeholder="暂无数据" filterable clearable>
:options="regionTree" :props="culturalRegionProps" placeholder="无" filterable clearable>
</el-cascader>
</el-form-item>
<el-form-item label="展览类型" :label-width="formLabelWidth">
<el-select disabled v-model="displayDetail.type" placeholder="暂无数据" style="width: 100%"
clearable>
<el-select disabled v-model="displayDetail.type" placeholder="无" style="width: 100%" clearable>
<el-option v-for="(value, key) in dicts.displayType" :key="key" :label="value" :value="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="展览性质" :label-width="formLabelWidth" style="display: none">
<el-select disabled v-model="displayDetail.displayCharacter" placeholder="暂无数据"
style="width: 100%" clearable>
<el-select disabled v-model="displayDetail.displayCharacter" placeholder="无" style="width: 100%"
clearable>
<el-option v-for="(value, key) in dicts.displayCharacter" :key="key" :label="value"
:value="key">
</el-option>
......@@ -39,7 +38,7 @@
</el-form-item>
<el-form-item label="模板主题" :label-width="formLabelWidth">
<el-select disabled v-model="displayDetail.themeType" placeholder="暂无数据" style="width: 100%"
<el-select disabled v-model="displayDetail.themeType" placeholder="无" style="width: 100%"
clearable>
<el-option v-for="item in themeTypeOptions" :key="item.value" :label="item.label"
:value="item.value">
......@@ -49,13 +48,13 @@
<el-form-item label="关键词" :label-width="formLabelWidth">
<el-input disabled v-model="displayDetail.keyword" autocomplete="off" placeholder="暂无数据"
<el-input disabled v-model="displayDetail.keyword" autocomplete="off" placeholder="无"
clearable></el-input>
</el-form-item>
<el-form-item label="展览文物" :label-width="formLabelWidth">
<el-select disabled v-model="crIds" multiple filterable remote reserve-keyword
placeholder="暂无数据" style="width: 100%" clearable>
<el-select disabled v-model="crIds" multiple filterable remote reserve-keyword placeholder="无"
style="width: 100%" clearable>
<el-option v-for="item in crList" :key="item.crId" :label="item.name" :value="item.crId">
</el-option>
</el-select>
......@@ -71,15 +70,15 @@
<el-form-item label="关联文献" :label-width="formLabelWidth">
<el-select disabled v-model="literatureValues" multiple filterable remote reserve-keyword
placeholder="暂无数据" style="width: 100%" ref="literatureSelect" clearable>
placeholder="无" style="width: 100%" ref="literatureSelect" clearable>
<el-option v-for="item in literatureList" :key="item.literatureId" :label="item.name"
:value="item.literatureId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="关联虚拟展厅" :label-width="formLabelWidth">
<el-select disabled v-model="vrIds" multiple filterable remote reserve-keyword
placeholder="暂无数据" style="width: 100%" ref="virtualSelect" clearable>
<el-select disabled v-model="vrIds" multiple filterable remote reserve-keyword placeholder="无"
style="width: 100%" ref="virtualSelect" clearable>
<el-option v-for="item in vrList" :key="item.bvId" :label="item.name" :value="item.bvId">
</el-option>
</el-select>
......@@ -88,49 +87,55 @@
<el-switch v-model="displayDetail.status" disabled> </el-switch>
</el-form-item>
<el-form-item label="备注" :label-width="formLabelWidth">
<el-input disabled type="textarea" placeholder="暂无数据" v-model="displayDetail.remark"
<el-input disabled type="textarea" placeholder="无" v-model="displayDetail.remark"
maxlength="100" show-word-limit clearable>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-col :span="14">
<el-form-item label="展览封面" :label-width="formLabelWidth">
<div v-if="displayDetail.faceImagePressUrl" class="img-container">
<img :src="displayDetail.faceImagePressUrl" alt="">
<ManualUploader :fileLimit="1" listType="picture-card" :fileType="['png', 'jpeg', 'jpg']"
:files="faceImage" ref="faceImage" onlyRead />
</div>
<div v-else>
暂无封面
无
</div>
</el-form-item>
<el-form-item label="展览图片" :label-width="formLabelWidth">
<div class="images-group" v-if="displayDetail.imagesVo.length > 0">
<div class="img-container" v-for="(item, index) in displayDetail.imagesVo" :key="index">
<img :src="item.pressUrl" alt="">
</div>
<ManualUploader :files="images" :fileLimit="20" :fileSize="50" listType="picture-card"
:fileType="['png', 'jpeg', 'jpg']" ref="images" onlyRead />
</div>
<div v-else>
暂无展览图片
无
</div>
</el-form-item>
<el-form-item label="展览音频" :label-width="formLabelWidth">
<div class="images-group" v-if="displayDetail.imagesVo.length > 0">
<div class="img-container" v-for="(item, index) in displayDetail.imagesVo" :key="index">
</div>
<div class="images-group" v-if="displayDetail.audiosVo.length > 0">
<ManualUploader :files="audios" :fileLimit="1" :fileSize="50" :fileType="['mp3']"
listType="card" ref="audios" onlyRead />
</div>
<div v-else>
暂无展览音频
无
</div>
</el-form-item>
<el-form-item label="展览视频" :label-width="formLabelWidth">
<div class="images-group" v-if="displayDetail.videosVo.length > 0">
<ManualUploader :files="videos" :fileLimit="6" :fileSize="500" :fileType="['mp4']"
listType="card" ref="videos" onlyRead />
</div>
<div v-else>
无
</div>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="展览单元" :label-width="formLabelWidth">
<ExhibitionUnit :exhibitionUnits="displayDetail.exhibitionUnits" ref="exhibitionUnits" />
<ExhibitionUnit :exhibitionUnits="displayDetail.exhibitionUnits" :isDisableEvent="true"
ref="exhibitionUnits" />
</el-form-item>
</el-row>
</el-form>
......@@ -163,74 +168,79 @@ export default {
},
},
watch: {
displayDetail(value) {
if (Object.key(value).length == 0) {
return
}
// // 回填媒体资源
// if (
// this.displayDetail.faceImageUrl ||
// this.displayDetail.faceImagePressUrl
// ) {
// this.faceImage = [
// {
// name: "",
// url: this.displayDetail.faceImageUrl || "",
// pressUrl:
// this.displayDetail.faceImagePressUrl ||
// this.displayDetail.faceImageUrl ||
// "",
// fileId: this.displayDetail.faceImage || "",
// },
// ];
// } else {
// this.faceImage = [];
// }
// this.images = this.displayDetail.imagesVo || [];
// this.videos = this.displayDetail.videosVo || [];
// this.audios = this.displayDetail.audiosVo || [];
// 回填状态
this.dialogForm.status = Boolean(Number(this.dialogForm.status));
// 回填文献
this.literatureValues = [];
displayDetail: {
handler: function (value) {
if (Object.keys(value).length == 0) {
return
}
// 回填媒体资源
if (
this.displayDetail.faceImageUrl ||
this.displayDetail.faceImagePressUrl
) {
this.faceImage = [
{
name: "",
url: this.displayDetail.faceImageUrl || "",
pressUrl:
this.displayDetail.faceImagePressUrl ||
this.displayDetail.faceImageUrl ||
"",
fileId: this.displayDetail.faceImage || "",
},
];
} else {
this.faceImage = [];
}
this.images = this.displayDetail.imagesVo || [];
this.videos = this.displayDetail.videosVo || [];
this.audios = this.displayDetail.audiosVo || [];
// 回填状态
this.displayDetail.status = Boolean(Number(this.displayDetail.status));
// 回填文献
this.literatureValues = [];
if (
this.displayDetail.literatureVo &&
this.displayDetail.literatureVo.length > 0
) {
this.literatureList = this.displayDetail.literatureVo;
this.displayDetail.literatureVo.forEach((lt) => {
if (this.literatureValues) {
this.literatureValues.push(lt.literatureId);
}
});
}
// 回填文物
this.crIds = [];
if (
this.displayDetail.culturalRelicVo &&
this.displayDetail.culturalRelicVo.length > 0
) {
this.crList = this.displayDetail.culturalRelicVo;
this.displayDetail.culturalRelicVo.forEach((cr) => {
if (this.crIds) {
this.crIds.push(cr.crId);
}
});
}
// 回填虚拟展厅
this.vrIds = [];
if (
this.displayDetail.virtualVo &&
this.displayDetail.virtualVo.length > 0
) {
this.vrList = this.displayDetail.virtualVo;
this.displayDetail.virtualVo.forEach((vr) => {
if (this.vrIds) {
this.vrIds.push(vr.bvId);
}
});
}
},
deep: true,
immediate: true
if (
this.dialogForm.literatureVo &&
this.dialogForm.literatureVo.length > 0
) {
this.literatureList = this.dialogForm.literatureVo;
this.dialogForm.literatureVo.forEach((lt) => {
if (this.literatureValues) {
this.literatureValues.push(lt.literatureId);
}
});
}
// 回填文物
this.crIds = [];
if (
this.dialogForm.culturalRelicVo &&
this.dialogForm.culturalRelicVo.length > 0
) {
this.crList = this.dialogForm.culturalRelicVo;
this.dialogForm.culturalRelicVo.forEach((cr) => {
if (this.crIds) {
this.crIds.push(cr.crId);
}
});
}
// 回填虚拟展厅
this.vrIds = [];
if (
this.dialogForm.virtualVo &&
this.dialogForm.virtualVo.length > 0
) {
this.vrList = this.dialogForm.virtualVo;
this.dialogForm.virtualVo.forEach((vr) => {
if (this.vrIds) {
this.vrIds.push(vr.bvId);
}
});
}
}
},
data() {
......@@ -306,5 +316,31 @@ export default {
width: 148px;
height: 148px;
cursor: pointer;
margin-right: 2px;
img {
width: 100%;
height: 100%;
object-fit: cover;
}
}
.images-group {
// width: 450px;
// display: flex;
// flex-wrap: wrap;
// padding-top: 10px;
}
.intro {
background-color: #F5F7FA;
border: 1px solid #E4E7ED;
color: #C0C4CC;
padding: 0 10px;
border-radius: 4px;
}
.base-info {
overflow-x: hidden;
}
</style>
\ No newline at end of file
src/views/approval/components/PreviewDisplayDialog.vue
浏览文件 @ e807e5ce
......@@ -5,10 +5,12 @@
<div class="label">{{ title }}</div>
</div>
<div class="dialog-content">
<el-tabs v-model="activeName">
<el-tab-pane label="基本信息" name="info">
<BaseInfo :displayDetail="displayDetail" :dicts="dicts" />
</el-tab-pane>
<el-tabs v-model="activeName" v-loading="dialogLoading">
<!-- <el-tab-pane label="基本信息" name="info">
<div class="container">
<BaseInfo :displayDetail="displayDetail" :dicts="dicts" />
</div>
</el-tab-pane> -->
<el-tab-pane label="效果预览" name="page">
<div class="container" v-if="dicts">
<NormalStyle v-if="displayDetail.themeType == '1'" :displayDetail="displayDetail" :dicts="dicts" />
......@@ -18,36 +20,41 @@
</el-tab-pane>
<el-tab-pane label="审批历史记录" name="history">
<div class="container">
<el-steps :active="displayDetail.historyChecks.length" align-center>
<el-steps :active="displayDetail.historyChecks.length">
<el-step v-for="(item, index) in displayDetail.historyChecks" :title="getStepTitle(item)" :key="index"
:icon="getStepIcon(item)">
<div slot="description">
<div class="name">{{ item.createName }}</div>
<div class="time">{{ item.createTime }}</div>
<div class="desc">{{ item.remark }}</div>
</div>
</div>
</el-step>
</el-steps>
</div>
</el-tab-pane>
</el-tabs>
<div class="dialog-footer">
<el-button @click="handleClose" style="margin-right:6px">取消</el-button>
<el-popover placement="top-end" width="400" trigger="click">
<div>
<el-form :model="dialogForm">
<el-form-item label="驳回意见" prop="remark">
<el-input placeholder="驳回意见" v-model="dialogForm.remark" size="small">
<el-button type="primary" slot="append" @click.native="handleCheck(-2)">确定</el-button>
</el-input>
</el-form-item>
</el-form>
<span v-if="(displayDetail.checkStatus == 0)">
<el-button @click.native="handleClose" style="margin-right:6px">取消</el-button>
<el-popover placement="top-end" width="400" trigger="click">
<div>
<el-form :model="dialogForm">
<el-form-item label="驳回意见" prop="remark">
<el-input placeholder="驳回意见" v-model="dialogForm.remark" size="small">
<el-button type="primary" slot="append" @click.native="handleCheck(-2)">确定</el-button>
</el-input>
</el-form-item>
</el-form>
</div>
<el-button slot="reference" type="danger" icon="el-icon-close">驳回</el-button>
</el-popover>
<el-button style="margin-left:6px" type="primary" icon="el-icon-check"
@click.native="handleCheck(1)">同意</el-button>
</span>
<span v-else>
<el-button type="primary" @click.native="handleClose">关闭</el-button>
</span>
</div>
<el-button slot="reference" type="danger" icon="el-icon-close">驳回</el-button>
</el-popover>
<el-button style="margin-left:6px" type="primary" icon="el-icon-check"
@click.native="handleCheck(1)">同意</el-button>
</div>
</div>
......@@ -80,6 +87,10 @@ export default {
type: Object,
default: () => ({}),
},
loading: {
type: Boolean,
default: false,
}
},
computed: {
......@@ -103,7 +114,7 @@ export default {
return (item) => {
switch (item.checkStatus) {
case 0:
return 'el-icon-s-check'
return 'el-icon-s-promotion'
case 1:
return 'el-icon-s-claim'
case -2:
......@@ -122,6 +133,9 @@ export default {
immediate: true,
deep: true,
},
loading(value) {
this.dialogLoading = value
}
},
data() {
return {
......@@ -129,7 +143,9 @@ export default {
dialogForm: {
remark: '',//驳回意见
},
activeName: 'info'
activeName: 'page',
historyChecks: [],
dialogLoading: false
};
},
async mounted() {
......@@ -137,17 +153,27 @@ export default {
"displayType",
"displayCharacter",
]);
console.log('this.dicts',this.dicts);
},
methods: {
handleClose(done) {
this.$emit("handleClose");
},
handleCheck(checkStatus) {
console.log('checkStatus', checkStatus);
// postCheck()
async handleCheck(checkStatus) {
this.dialogLoading = true
const params = {
sourceId: this.displayDetail.exhibitionId,
checkStatus,
remark: this.dialogForm.remark,
sourceType: 'biz_exhibition',
sourceName: this.displayDetail.title
}
let res = await postCheck(params)
if (res.code == 0) {
this.$message.success('操作成功！')
this.dialogLoading = false
this.handleClose()
}
}
},
};
......@@ -172,12 +198,11 @@ export default {
.dialog-content {
padding: 0 32px;
.container {
border: 1px dashed #409eff;
height: calc(64vh);
overflow: auto;
padding: 16px 0;
padding: 46px;
.desc {
color: #666 !important;
......
src/views/approval/display.vue
浏览文件 @ e807e5ce
......@@ -50,7 +50,7 @@
</el-tabs>
<PreviewDisplayDialog v-if="Object.keys(curPreviewObj).length > 0" :visible="previewDialogVisible"
:displayDetail="curPreviewObj" @handleClose="handleClosePreviewDialog" />
:displayDetail="curPreviewObj" @handleClose="handleClosePreviewDialog" :loading="previewLoading"/>
<el-image-viewer v-if="imgViewerVisible" :on-close="closeImgViewer" :url-list="imgList" />
</div>
......@@ -67,9 +67,6 @@ import {
} from "@/api/display";
import SearchBar from "@/components/SearchBar";
import { mapGetters } from "vuex";
import { getToken } from "@/utils/auth";
import { importZip } from "@/utils/file";
import { thisTypeAnnotation } from "@babel/types";
export default {
components: {
TablePage,
......@@ -127,7 +124,8 @@ export default {
}
],
activeName: '0',
currentTabIndex: 0
currentTabIndex: 0,
dialogLoading:false
};
},
computed: {
......@@ -200,10 +198,12 @@ export default {
console.log(value, row);
// debugger
if (value.type == 'approval' || value.type == 'view') {
this.previewLoading = true
if (row) {
this.previewDialogVisible = true;
let res = await getDisplayCheckById({ exhibitionId: row.exhibitionId });
this.curPreviewObj = res.data;
this.previewLoading = false;
}
}
......
src/views/display/components/ExhibitionUnit.vue
浏览文件 @ e807e5ce
......@@ -7,43 +7,27 @@
<div class="exhibition-units-tree-node" slot-scope="{ node, data }">
<div style="display: flex; align-items: center">
<div class="title" @click="handleClickNode(node, data)">
<el-input
placeholder="请输入标题"
v-model="data.title"
v-if="data.isEditing"
:ref="data.euId + 'Title'"
@blur="() => handleInputBlur(node, data)"
>
<el-input placeholder="请输入标题" v-model="data.title" v-if="data.isEditing" :ref="data.euId + 'Title'"
@blur="() => handleInputBlur(node, data)">
</el-input>
<span v-else>{{ data.title }}</span>
</div>
<el-tooltip content="编辑标题" placement="top">
<i
v-if="!data.isEditing"
class="el-icon-edit plus-peer"
@click="() => editNode(node, data)"
></i>
</el-tooltip>
<el-tooltip content="添加子节点" placement="top">
<svg-icon
@click="() => appendChild(data)"
icon-class="node-child2"
class="plus-child"
style="font-size: 32px; color: #409eff"
></svg-icon>
</el-tooltip>
<el-tooltip content="添加同级节点" placement="top">
<i
class="el-icon-plus plus-peer"
@click="() => appendPeerNode(node, data)"
></i>
</el-tooltip>
<el-tooltip content="删除当前节点" placement="top">
<i
class="el-icon-close delete"
@click="() => remove(node, data)"
></i>
</el-tooltip>
<span v-if="!isDisableEvent">
<el-tooltip content="编辑标题" placement="top">
<i v-if="!data.isEditing" class="el-icon-edit plus-peer" @click="() => editNode(node, data)"></i>
</el-tooltip>
<el-tooltip content="添加子节点" placement="top">
<svg-icon @click="() => appendChild(data)" icon-class="node-child2" class="plus-child"
style="font-size: 32px; color: #409eff"></svg-icon>
</el-tooltip>
<el-tooltip content="添加同级节点" placement="top">
<i class="el-icon-plus plus-peer" @click="() => appendPeerNode(node, data)"></i>
</el-tooltip>
<el-tooltip content="删除当前节点" placement="top">
<i class="el-icon-close delete" @click="() => remove(node, data)"></i>
</el-tooltip>
</span>
</div>
</div>
</el-tree>
......@@ -55,44 +39,23 @@
</el-input>
</el-col>
<el-col :span="24" class="mg-bt20">
<VueQuillEditor
v-model="currentData.intro"
placeholder="请输入单元介绍"
/>
<VueQuillEditor v-model="currentData.intro" placeholder="请输入单元介绍" />
</el-col>
<el-col :span="24" class="mg-bt20">
<div>单元文物：</div>
<el-select
v-model="currentData.crIds"
multiple
filterable
remote
reserve-keyword
placeholder="请输入关键词搜索文物"
:remote-method="searchCR"
:loading="loading"
style="width: 100%"
ref="remoteSelect"
>
<el-option
v-for="item in crList"
:key="item.crId"
:label="item.name"
:value="item.crId"
>
<el-select :disabled="isDisableEvent" v-model="currentData.crIds" multiple filterable remote reserve-keyword
:placeholder="isDisableEvent ? '无' : '请输入关键词搜索文物'" :remote-method="searchCR" :loading="loading"
style="width: 100%" ref="remoteSelect">
<el-option v-for="item in crList" :key="item.crId" :label="item.name" :value="item.crId">
</el-option>
</el-select>
</el-col>
<el-col :span="24">
<div>单元图片：</div>
<ManualUploaderBind
v-model="currentData.imagesVo"
:fileLimit="7"
:fileSize="50"
:fileType="['jpeg', 'jpg', 'png']"
listType="picture-card"
:ref="'unit-images-' + currentData.euId"
/>
<span></span>
<ManualUploaderBind v-model="currentData.imagesVo" :fileLimit="7" :fileSize="50"
:fileType="['jpeg', 'jpg', 'png']" listType="picture-card" :ref="'unit-images-' + currentData.euId"
:onlyRead="isDisableEvent" />
</el-col>
</el-row>
<!-- <el-collapse-transition>
......@@ -101,31 +64,14 @@
</el-row>
</el-collapse-transition> -->
<div class="next-prev">
<el-button
size="mini"
type="primary"
icon="el-icon-back"
@click="handleToUnit('prev')"
>上一节点</el-button
>
<el-button
size="mini"
type="primary"
icon="el-icon-right"
@click="handleToUnit('next')"
>下一节点</el-button
>
<el-button size="mini" type="primary" icon="el-icon-back" @click="handleToUnit('prev')">上一节点</el-button>
<el-button size="mini" type="primary" icon="el-icon-right" @click="handleToUnit('next')">下一节点</el-button>
</div>
</el-col>
</el-row>
<el-button
v-if="!treeData.length > 0"
type="primary"
icon="el-icon-circle-plus-outline"
@click="handleAddUnit('manual')"
size="small"
>手动添加展览单元</el-button
>
<el-button v-if="(!treeData.length > 0 && !isDisableEvent)" type="primary" icon="el-icon-circle-plus-outline"
@click="handleAddUnit('manual')" size="small">手动添加展览单元</el-button>
<span v-if="(treeData.length == 0 && isDisableEvent)">暂无</span>
<!-- <el-button
v-if="!treeData.length > 0"
type="success"
......@@ -163,6 +109,10 @@ export default {
type: Array,
default: () => [],
},
isDisableEvent: {
type: Boolean,
default: false
}
},
watch: {
exhibitionUnits: {
......@@ -231,7 +181,7 @@ export default {
this.loading = false;
const res = await getCulturalRelicListPer(params);
if (res.code == 0) {
this.crList = [...new Set([...this.crList, ...res.data.records])];
this.crList = [...new Set([...this.crList, ...res.data.records])];
} else {
this.crList = [];
this.$message.error(res.msg);
......@@ -379,6 +329,7 @@ export default {
display: flex;
width: 100%;
flex-direction: column;
.title {
width: 200px;
overflow: hidden;
......@@ -386,6 +337,7 @@ export default {
text-overflow: ellipsis;
}
}
::v-deep .el-tree-node__content {
// padding: 10px;
// min-height: 140px;
......@@ -398,6 +350,7 @@ export default {
.tree-container {
border: 1px #ccc dashed;
}
.node-detail {
background: #f4f9ff;
padding: 16px;
......@@ -411,11 +364,13 @@ export default {
padding: 4px;
border-radius: 4px;
margin-left: 10px;
&:hover {
background-color: rgba($color: #000000, $alpha: 0.05);
//
}
}
.plus-peer {
font-size: 20px !important;
// font-weight: bold;
......@@ -424,11 +379,13 @@ export default {
padding: 4px;
border-radius: 4px;
margin-left: 10px;
&:hover {
background-color: rgba($color: #000000, $alpha: 0.05);
//
}
}
.delete {
font-size: 20px;
// font-weight: bold;
......@@ -437,14 +394,17 @@ export default {
padding: 4px;
border-radius: 4px;
margin-left: 10px;
&:hover {
background-color: rgba($color: #000000, $alpha: 0.05);
//
}
}
.add-image {
display: flex;
align-items: center;
.svg-icon {
width: 24px;
height: 24px;
......@@ -455,14 +415,17 @@ export default {
box-sizing: border-box;
}
}
.mg-bt20 {
margin-bottom: 20px;
}
::v-deep .images-list {
& > div {
&>div {
white-space: pre-wrap;
}
}
.next-prev {
display: flex;
justify-content: flex-end;
......
src/views/display/components/InfoEditDialog.vue
浏览文件 @ e807e5ce
<template>
<el-dialog
v-loading="submitLoading"
element-loading-background="rgba(0, 0, 0, 0.5)"
:element-loading-text="loadingText"
:visible.sync="dialogVisible"
width="80%"
:before-close="handleClose"
top="2vh"
lock-scroll
>
<el-dialog v-loading="submitLoading" element-loading-background="rgba(0, 0, 0, 0.5)"
:element-loading-text="loadingText" :visible.sync="dialogVisible" width="80%" :before-close="handleClose" top="2vh"
lock-scroll>
<div class="title" slot="title">
<div class="divider"></div>
<div class="label">
{{ title }}
<span
v-if="dialogForm.exhibitionId"
style="font-size: 12px; margin-left: 10px; font-weight: 500"
>
<i class="el-icon-warning-outline"></i
>点击左右切换按钮可切换展览。<span style="color: #f56c6c">
<span v-if="dialogForm.exhibitionId" style="font-size: 12px; margin-left: 10px; font-weight: 500">
<i class="el-icon-warning-outline"></i>点击左右切换按钮可切换展览。<span style="color: #f56c6c">
注意：切换前请注意保存当前展览信息
</span>
</span>
......@@ -26,142 +15,53 @@
</div>
<div class="el-dialog-div">
<div class="dialog-content" v-if="dialogVisible" id="dialog-content">
<el-form
:model="dialogForm"
class="basic-info"
:rules="rules"
ref="form"
>
<el-form :model="dialogForm" class="basic-info" :rules="rules" ref="form">
<el-row :gutter="50">
<el-col :span="12">
<el-form-item
label="展览标题"
:label-width="formLabelWidth"
prop="title"
>
<el-input
v-model="dialogForm.title"
autocomplete="off"
placeholder="请输入展览标题"
clearable
></el-input>
<el-form-item label="展览标题" :label-width="formLabelWidth" prop="title">
<el-input v-model="dialogForm.title" autocomplete="off" placeholder="请输入展览标题" clearable></el-input>
</el-form-item>
<el-form-item
label="展览单位"
:label-width="formLabelWidth"
prop="deptId"
>
<el-cascader
style="width: 100%"
v-model="dialogForm.deptId"
:options="orgTreeData"
:props="optionProps"
placeholder="请选择展览单位"
clearable
>
<el-form-item label="展览单位" :label-width="formLabelWidth" prop="deptId">
<el-cascader style="width: 100%" v-model="dialogForm.deptId" :options="orgTreeData" :props="optionProps"
placeholder="请选择展览单位" clearable>
</el-cascader>
</el-form-item>
<el-form-item label="展览地区" :label-width="formLabelWidth">
<el-cascader
class="years item"
style="width: 100%"
v-model="dialogForm.regionCode"
:options="regionTree"
:props="culturalRegionProps"
placeholder="请选择所属地区"
filterable
clearable
>
<el-cascader class="years item" style="width: 100%" v-model="dialogForm.regionCode"
:options="regionTree" :props="culturalRegionProps" placeholder="请选择所属地区" filterable clearable>
</el-cascader>
</el-form-item>
<el-form-item label="展览类型" :label-width="formLabelWidth">
<el-select
v-model="dialogForm.type"
placeholder="请选择展览类型"
style="width: 100%"
clearable
>
<el-option
v-for="(value, key) in dicts.displayType"
:key="key"
:label="value"
:value="key"
>
<el-select v-model="dialogForm.type" placeholder="请选择展览类型" style="width: 100%" clearable>
<el-option v-for="(value, key) in dicts.displayType" :key="key" :label="value" :value="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item
label="展览性质"
:label-width="formLabelWidth"
style="display: none"
>
<el-select
v-model="dialogForm.displayCharacter"
placeholder="请选择展览性质"
style="width: 100%"
clearable
>
<el-option
v-for="(value, key) in dicts.displayCharacter"
:key="key"
:label="value"
:value="key"
>
<el-form-item label="展览性质" :label-width="formLabelWidth" style="display: none">
<el-select v-model="dialogForm.displayCharacter" placeholder="请选择展览性质" style="width: 100%" clearable>
<el-option v-for="(value, key) in dicts.displayCharacter" :key="key" :label="value" :value="key">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="模板主题" :label-width="formLabelWidth">
<el-select
v-model="dialogForm.themeType"
placeholder="请选择模板主题"
style="width: 100%"
clearable
>
<el-option
v-for="item in themeTypeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
>
<el-select v-model="dialogForm.themeType" placeholder="请选择模板主题" style="width: 100%" clearable>
<el-option v-for="item in themeTypeOptions" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="展览介绍" :label-width="formLabelWidth">
<VueQuillEditor
v-model="dialogForm.intro"
placeholder="请输入展览介绍"
/>
<VueQuillEditor v-model="dialogForm.intro" placeholder="请输入展览介绍" />
</el-form-item>
<el-form-item label="关键词" :label-width="formLabelWidth">
<el-input
v-model="dialogForm.keyword"
autocomplete="off"
placeholder="请输入关键词"
clearable
></el-input>
<el-input v-model="dialogForm.keyword" autocomplete="off" placeholder="请输入关键词" clearable></el-input>
</el-form-item>
<el-form-item label="展览文物" :label-width="formLabelWidth">
<el-select
v-model="crIds"
multiple
filterable
remote
reserve-keyword
placeholder="请输入关键词搜索文物"
:remote-method="searchCR"
:loading="loading"
style="width: 100%"
clearable
>
<el-option
v-for="item in crList"
:key="item.crId"
:label="item.name"
:value="item.crId"
>
<el-select v-model="crIds" multiple filterable remote reserve-keyword placeholder="请输入关键词搜索文物"
:remote-method="searchCR" :loading="loading" style="width: 100%" clearable>
<el-option v-for="item in crList" :key="item.crId" :label="item.name" :value="item.crId">
</el-option>
</el-select>
<!-- <PageSelect
......@@ -175,48 +75,18 @@
</el-form-item>
<el-form-item label="关联文献" :label-width="formLabelWidth">
<el-select
v-model="literatureValues"
multiple
filterable
remote
reserve-keyword
placeholder="请输入关键词搜索文献"
:remote-method="searchLiterature"
:loading="loading"
style="width: 100%"
ref="literatureSelect"
clearable
>
<el-option
v-for="item in literatureList"
:key="item.literatureId"
:label="item.name"
:value="item.literatureId"
>
<el-select v-model="literatureValues" multiple filterable remote reserve-keyword
placeholder="请输入关键词搜索文献" :remote-method="searchLiterature" :loading="loading" style="width: 100%"
ref="literatureSelect" clearable>
<el-option v-for="item in literatureList" :key="item.literatureId" :label="item.name"
:value="item.literatureId">
</el-option>
</el-select>
</el-form-item>
<el-form-item label="关联虚拟展厅" :label-width="formLabelWidth">
<el-select
v-model="vrIds"
multiple
filterable
remote
reserve-keyword
placeholder="请输入关键词搜索虚拟展厅"
:remote-method="searchVirtual"
:loading="loading"
style="width: 100%"
ref="virtualSelect"
clearable
>
<el-option
v-for="item in vrList"
:key="item.bvId"
:label="item.name"
:value="item.bvId"
>
<el-select v-model="vrIds" multiple filterable remote reserve-keyword placeholder="请输入关键词搜索虚拟展厅"
:remote-method="searchVirtual" :loading="loading" style="width: 100%" ref="virtualSelect" clearable>
<el-option v-for="item in vrList" :key="item.bvId" :label="item.name" :value="item.bvId">
</el-option>
</el-select>
</el-form-item>
......@@ -224,117 +94,56 @@
<el-switch v-model="dialogForm.status"> </el-switch>
</el-form-item>
<el-form-item label="备注" :label-width="formLabelWidth">
<el-input
type="textarea"
placeholder="请输入备注"
v-model="dialogForm.remark"
maxlength="100"
show-word-limit
clearable
>
<el-input type="textarea" placeholder="请输入备注" v-model="dialogForm.remark" maxlength="100"
show-word-limit clearable>
</el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="展览封面" :label-width="formLabelWidth">
<ManualUploader
:fileLimit="1"
listType="picture-card"
:fileType="['png', 'jpeg', 'jpg']"
:files="faceImage"
ref="faceImage"
/>
<ManualUploader :fileLimit="1" listType="picture-card" :fileType="['png', 'jpeg', 'jpg']"
:files="faceImage" ref="faceImage" />
</el-form-item>
<el-form-item label="展览图片" :label-width="formLabelWidth">
<ManualUploader
:files="images"
:fileLimit="20"
:fileSize="50"
listType="picture-card"
:fileType="['png', 'jpeg', 'jpg']"
ref="images"
:advice="imagesAdvice"
/>
<ManualUploader :files="images" :fileLimit="20" :fileSize="50" listType="picture-card"
:fileType="['png', 'jpeg', 'jpg']" ref="images" :advice="imagesAdvice" />
</el-form-item>
<el-form-item label="展览音频" :label-width="formLabelWidth">
<ManualUploader
:files="audios"
:fileLimit="1"
:fileSize="50"
:fileType="['mp3']"
listType="card"
ref="audios"
/>
<ManualUploader :files="audios" :fileLimit="1" :fileSize="50" :fileType="['mp3']" listType="card"
ref="audios" />
</el-form-item>
<el-form-item label="展览视频" :label-width="formLabelWidth">
<ManualUploader
:files="videos"
:fileLimit="6"
:fileSize="500"
:fileType="['mp4']"
listType="card"
ref="videos"
/>
<ManualUploader :files="videos" :fileLimit="6" :fileSize="500" :fileType="['mp4']" listType="card"
ref="videos" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-form-item label="展览单元" :label-width="formLabelWidth">
<ExhibitionUnit
:exhibitionUnits="dialogForm.exhibitionUnits"
ref="exhibitionUnits"
/>
<ExhibitionUnit :exhibitionUnits="dialogForm.exhibitionUnits" ref="exhibitionUnits" />
</el-form-item>
</el-row>
</el-form>
</div>
<div class="dialog-footer">
<el-button icon="el-icon-top" type="info" @click.native="handleToTop"
>回到顶部</el-button
>
<el-button @click="cancelForm" icon="el-icon-circle-close" type="danger"
>取 消</el-button
>
<el-button icon="el-icon-top" @click.native="handleToTop"></el-button>
<el-button @click="cancelForm" icon="el-icon-circle-close" type="warning">取 消</el-button>
<el-button type="primary" @click="handleSubmit(0)" :disabled="loading" icon="el-icon-document-checked">
只保存
</el-button>
<!-- <el-button @click="handlePreview">预 览</el-button> -->
<el-button type="primary" @click="handleSubmit" :disabled="loading"
>{{ dialogForm.exhibitionId ? "保存" : "发布"
}}<i
:class="
dialogForm.exhibitionId
? 'el-icon-circle-check'
: 'el-icon-s-promotion'
"
style="margin-left: 5px"
></i
></el-button>
<el-button type="primary" @click="handleSubmit(1)" icon="el-icon-circle-check" :disabled="loading">保存并提交审核
</el-button>
</div>
</div>
<el-tooltip
class="item"
effect="dark"
content="下一展览"
placement="top-start"
>
<div
class="next btn"
v-if="dialogForm.exhibitionId"
@click="handleChangeDisplay('next')"
>
<el-tooltip class="item" effect="dark" content="下一展览" placement="top-start">
<div class="next btn" v-if="dialogForm.exhibitionId" @click="handleChangeDisplay('next')">
<i class="el-icon-arrow-right"></i>
</div>
</el-tooltip>
<el-tooltip
class="item"
effect="dark"
content="上一展览"
placement="top-start"
>
<div
class="prev btn"
v-if="dialogForm.exhibitionId"
@click="handleChangeDisplay('prev')"
>
<el-tooltip class="item" effect="dark" content="上一展览" placement="top-start">
<div class="prev btn" v-if="dialogForm.exhibitionId" @click="handleChangeDisplay('prev')">
<i class="el-icon-arrow-left"></i>
</div>
</el-tooltip>
......@@ -563,7 +372,7 @@ export default {
label: "name",
children: "children",
checkStrictly: true,
},
culturalRegionProps: {
value: "code",
......@@ -739,7 +548,7 @@ export default {
break;
}
},
handleSubmit() {
handleSubmit(submitFlag) {
// this.loading = true;
this.$refs.form.validate(async (valid) => {
if (valid) {
......@@ -928,6 +737,7 @@ export default {
params.crIds = this.crIds.join(",");
params.bvIds = this.vrIds.join(",");
params.displayCharacter = 1; //传布展
params.submitFlag = submitFlag
addDisplay(params)
.then((res) => {
if (res.code == 0) {
......@@ -997,10 +807,12 @@ export default {
if (deleteFileArr.length > 0) {
await deleteFiles(deleteFileArr);
}
params.submitFlag = submitFlag
editDisplay(params)
.then(async (res) => {
let deleteRes;
console.log(res);
// console.log(res);
// return
if (res.code == 0) {
......@@ -1057,7 +869,7 @@ export default {
this.reload();
this.submitLoading = false;
})
.catch((_) => {});
.catch((_) => { });
},
refresh() {
this.$emit("refresh");
......@@ -1070,34 +882,43 @@ export default {
.title {
display: flex;
margin-bottom: 16px;
.divider {
width: 8px;
border-left: 4px solid #409eff;
margin-right: 8px;
}
.label {
font-weight: bold;
}
}
.el-dialog-div {
height: 80vh;
overflow-x: hidden;
}
.dialog-content {
padding: 0 32px;
display: flex;
.basic-info {
flex: 1;
margin-right: 48px;
}
.relate {
flex: 1;
}
}
.dialog-footer {
display: flex;
justify-content: flex-end;
margin: 20px 50px;
position: sticky;
bottom: 0;
}
.video-lists {
......@@ -1107,6 +928,7 @@ export default {
::v-deep .el-dialog__body {
position: relative;
}
.btn {
width: 80px;
height: 80px;
......@@ -1118,11 +940,13 @@ export default {
position: absolute;
top: 40%;
cursor: pointer;
i {
font-size: 50px;
color: #fff;
}
}
.prev {
left: -8%;
}
......
src/views/display/components/templates/NormalStyle.vue
浏览文件 @ e807e5ce
......@@ -42,19 +42,14 @@
dicts.displayType[displayDetail.type] || "暂无"
}}</span>
</div>
<div class="body-item">
<div class="body-item" v-if="(dicts && dicts.displayCharacter)">
<span class="label">
<!-- <svg-icon icon-class="zlxz"></svg-icon> -->
展览性质：
</span>
<span class="value">{{
dicts.displayCharacter[
displayDetail.displayCharacter
] || "暂无"
}}</span>
<span>
{{ dicts }}
</span>
<span class="value">
{{ dicts.displayCharacter[displayDetail.displayCharacter] || '暂无'
}}</span>
</div>
<div class="body-item">
<span class="label">
......@@ -179,9 +174,14 @@
{{ item.name.split(".")[0] }}
</div>
</div> -->
</div>
<div class="video-container">
<video v-if="currentVideo && currentVideo.url" :src="$getFullUrl(currentVideo.url)"
:controls="true"></video>
</div>
<video-player v-if="currentVideo && currentVideo.url" :src="$getFullUrl(currentVideo.url)" class="video-box">
</video-player>
<!-- <VideoCustomPlayer v-if="currentVideo && currentVideo.url" :src="$getFullUrl(currentVideo.url)" class="video-box" /> -->
</div>
<!--展览单元 -->
......@@ -253,13 +253,13 @@ import { swiper, swiperSlide } from "vue-awesome-swiper";
import "swiper/dist/css/swiper.css";
import { isElementInViewport2 } from "@/utils/index";
import NormalStyleUnit from './NormalStyleUnit.vue'
import videoPlayer from "@/components/VideoPlayer";
import VideoCustomPlayer from "@/components/VideoPlayer";
export default {
name: "NormalStyle",
components: {
AudioPlayer,
ReaderOperations,
videoPlayer,
VideoCustomPlayer,
NormalStyleUnit,
SlideImage,
SlideImageGroup,
......@@ -334,7 +334,6 @@ export default {
},
async mounted() {
this.loadDetail();
console.log('this.dicts',this.dicts.displayCharacter);
this.$nextTick(() => {
window.addEventListener("scroll", this.initHeight);
this.offsetTop = document.querySelector("#tabbar").offsetTop; //距离offsetParent的高度
......@@ -1014,6 +1013,11 @@ $themeColor: #132c33;
}
::v-deep .swiper-wrapper{
height: auto;
}
// .video-item {
// font-size: 18px;
// margin: 8px 30px;
......@@ -1081,6 +1085,15 @@ $themeColor: #132c33;
height: 100%;
}
}
.video-container {
width: 100%;
height: 400px;
video {
width: 100%;
height: 100%;
}
}
}
......
src/views/display/components/templates/RedStyle.vue
浏览文件 @ e807e5ce
......@@ -54,13 +54,13 @@
<div class="info-container">
<div class="info-container-left">
<el-image :src="
$getFullUrl(
displayDetail.faceImagePressUrl ||
displayDetail.faceImageUrl
)
" fit="cover" @click.native="
handelPreviewImages([displayDetail.faceImageUrl])
"></el-image>
$getFullUrl(
displayDetail.faceImagePressUrl ||
displayDetail.faceImageUrl
)
" fit="cover" @click.native="
handelPreviewImages([displayDetail.faceImageUrl])
"></el-image>
</div>
<div class="info-container-right">
<div class="info-title">
......@@ -80,13 +80,13 @@
<div class="body-item">
<span class="label">展览类型</span>
<span class="value">{{
dicts.displayType[displayDetail.type]
}}</span>
dicts.displayType[displayDetail.type]
}}</span>
</div>
<div class="body-item">
<div class="body-item" v-if="(dicts && dicts.displayCharacter)">
<span class="label">展览性质</span>
<span class="value">{{
dicts.displayCharacter[displayDetail.displayCharacter]
<span class="value">
{{ dicts.displayCharacter[displayDetail.displayCharacter] || '暂无'
}}</span>
</div>
<div class="body-item">
......@@ -249,16 +249,16 @@
<div class="custom-title">相关文献</div>
<div class="lts-content">
<el-table :data="displayDetail.literatureVo" :header-cell-style="{
background: '#eeeeee',
color: '#333',
}" :row-style="tableRowStyle">
background: '#eeeeee',
color: '#333',
}" :row-style="tableRowStyle">
<el-table-column prop="name" label="名称" align="center"></el-table-column>
<el-table-column prop="authors" label="作者" align="center"></el-table-column>
<el-table-column prop="date" label="出版时间" align="center"></el-table-column>
<el-table-column align="center" prop="source" label="出版所在刊物"></el-table-column>
<el-table-column label="阅读" align="center">
<template slot-scope="scope">
<div class="pdf-img" >
<div class="pdf-img">
<img src="@/assets/imgs/display/ch/pdf-icon.png" />
</div>
</template>
......@@ -275,691 +275,691 @@
</template>
<script>
import AudioPlayer from "@/components/AudioPlayer";
import ReaderOperations from "@/components/ReaderOperations";
import Card from "@/components/Card";
import Video from "@/components/Video";
import ChStyleUnit from "./ChStyleUnit.vue";
import NavBar from "@/components/NavBar";
import Footer from "@/components/Footer";
export default {
components: {
AudioPlayer,
ReaderOperations,
Video,
Card,
ChStyleUnit,
NavBar,
Footer,
"el-image-viewer": () => import("element-ui/packages/image/src/image-viewer"),
},
props: {
displayDetail: {
type: Object,
default: () => ({}),
},
dicts: {
type: Object,
default: () => ({}),
},
},
data() {
return {
imgViewerVisible: false,
relateRelics: [],
audioPlaying: true,
currentUnit: null,
};
import AudioPlayer from "@/components/AudioPlayer";
import ReaderOperations from "@/components/ReaderOperations";
import Card from "@/components/Card";
import Video from "@/components/Video";
import ChStyleUnit from "./ChStyleUnit.vue";
import NavBar from "@/components/NavBar";
import Footer from "@/components/Footer";
export default {
components: {
AudioPlayer,
ReaderOperations,
Video,
Card,
ChStyleUnit,
NavBar,
Footer,
"el-image-viewer": () => import("element-ui/packages/image/src/image-viewer"),
},
props: {
displayDetail: {
type: Object,
default: () => ({}),
},
async mounted() {
this.loadDetail();
// let units = this.$refs.
dicts: {
type: Object,
default: () => ({}),
},
methods: {
async loadDetail() {
processUnit(this.displayDetail.exhibitionUnits);
this.currentUnit =
this.displayDetail.exhibitionUnits.length > 0
? this.displayDetail.exhibitionUnits[0]
: null;
function processUnit(list) {
for (let o of list || []) {
if (o.children) {
if (o.children.length == 0) {
o.children = null;
} else {
processUnit(o.children);
}
},
data() {
return {
imgViewerVisible: false,
relateRelics: [],
audioPlaying: true,
currentUnit: null,
};
},
async mounted() {
this.loadDetail();
// let units = this.$refs.
},
methods: {
async loadDetail() {
processUnit(this.displayDetail.exhibitionUnits);
this.currentUnit =
this.displayDetail.exhibitionUnits.length > 0
? this.displayDetail.exhibitionUnits[0]
: null;
function processUnit(list) {
for (let o of list || []) {
if (o.children) {
if (o.children.length == 0) {
o.children = null;
} else {
processUnit(o.children);
}
}
}
this.$nextTick(() => {
// if (
// this.displayDetail.videosVo &&
// this.displayDetail.videosVo.length > 0
// ) {
// this.$message.info("正在播放当前文物讲解音频，点击按钮可关闭");
// this.$refs.AudioPlayer.play();
// }
});
},
//节流函数
throttle(fn, gapTime) {
let _this = this;
return function () {
let _nowTime = +new Date();
if (_nowTime - _this._lastTime > gapTime || !_this._lastTime) {
fn(...arguments); // 函数可以带参数
_this._lastTime = _nowTime;
}
};
},
// 关联文献的行样式调整
tableRowStyle({ row, rowIndex }) {
if (rowIndex % 2 == 0) {
return {
background: "#f9f9f9 !important",
};
} else {
return {
background: "#fff !important",
};
}
},
// 点击音频
handleClickAudio() {
this.audioPlaying = !this.audioPlaying;
if (this.audioPlaying) {
this.$refs["AudioPlayer"].play();
// console.log(this.$refs['audioContainer']);
} else {
this.$refs["AudioPlayer"].pause();
}
this.$nextTick(() => {
// if (
// this.displayDetail.videosVo &&
// this.displayDetail.videosVo.length > 0
// ) {
// this.$message.info("正在播放当前文物讲解音频，点击按钮可关闭");
// this.$refs.AudioPlayer.play();
// }
});
},
//节流函数
throttle(fn, gapTime) {
let _this = this;
return function () {
let _nowTime = +new Date();
if (_nowTime - _this._lastTime > gapTime || !_this._lastTime) {
fn(...arguments); // 函数可以带参数
_this._lastTime = _nowTime;
}
},
};
},
// 关联文献的行样式调整
tableRowStyle({ row, rowIndex }) {
if (rowIndex % 2 == 0) {
return {
background: "#f9f9f9 !important",
};
} else {
return {
background: "#fff !important",
};
}
},
// 点击音频
handleClickAudio() {
this.audioPlaying = !this.audioPlaying;
if (this.audioPlaying) {
this.$refs["AudioPlayer"].play();
// console.log(this.$refs['audioContainer']);
} else {
this.$refs["AudioPlayer"].pause();
}
},
reload() {
this.$emit("reload");
},
reload() {
this.$emit("reload");
},
handelPreviewImages(images) {
this.imgViewerVisible = true;
this.imgList = images.map((item) => this.$getFullUrl(item.url));
},
handelPreviewImages(images) {
this.imgViewerVisible = true;
this.imgList = images.map((item) => this.$getFullUrl(item.url));
},
closeImgViewer() {
this.imgViewerVisible = false;
},
closeImgViewer() {
this.imgViewerVisible = false;
},
handleClickUnitTitle(item) {
this.currentUnit = item;
},
handleClickUnitTitle(item) {
this.currentUnit = item;
},
};
},
};
</script>
<style lang="scss" scoped>
// 中国风主题样式
/**公共样式开始 */
.wrapper {
width: 1400px;
}
// 中国风主题样式
/**公共样式开始 */
.wrapper {
width: 1400px;
}
.custom-title {
width: 50px;
background-color: #d72f3f;
min-height: 300px;
color: #fff;
font-size: 28px;
writing-mode: vertical-rl;
display: flex;
align-items: center;
justify-content: center;
box-shadow: rgb(215 47 63 / 30%) 4px 3px 8px 1px;
letter-spacing: 10px;
}
.units {
background-image: linear-gradient(to bottom, #660d04, #520002);
min-height: 400px;
}
.content-item {
width: 100%;
}
/**公共样式结束 */
/**样式开始 */
.display-detail {
overflow: hidden;
.content {
width: 100%;
overflow: hidden;
.custom-title {
width: 50px;
background-color: #d72f3f;
min-height: 300px;
color: #fff;
font-size: 28px;
writing-mode: vertical-rl;
display: flex;
align-items: center;
justify-content: center;
box-shadow: rgb(215 47 63 / 30%) 4px 3px 8px 1px;
letter-spacing: 10px;
}
/**轮播图 */
.display-detail_imgs {
.img-container {
height: 430px;
.units {
background-image: linear-gradient(to bottom, #660d04, #520002);
min-height: 400px;
}
img {
width: 100%;
height: 100%;
object-fit: cover;
}
}
}
.content-item {
width: 100%;
}
/**基本信息 */
.display-detail_basic_info {
margin: 80px 0;
display: flex;
justify-content: center;
.wrapper {
min-height: 200px;
border-left: 4px solid #ccc9cd;
border-right: 4px solid #ccc9cd;
position: relative;
overflow: hidden;
&:hover {
.top-list,
.bottom-list {
animation-play-state: paused;
-webkit-animation-play-state: paused;
}
}
/**公共样式结束 */
.top {
position: absolute;
left: 0;
top: 0;
overflow: hidden;
display: flex;
width: 1400px;
}
/**样式开始 */
.display-detail {
overflow: hidden;
.bottom {
position: absolute;
left: 0;
bottom: 0;
overflow: hidden;
}
.content {
width: 100%;
overflow: hidden;
.top-wrapper,
.bottom-wrapper {
display: flex;
width: 2400px;
}
/**轮播图 */
.display-detail_imgs {
.img-container {
height: 430px;
.film-img-container {
animation: filmMoveLeft 60s linear infinite;
height: 40px;
img {
width: 100%;
width: 1400px;
height: 100%;
object-fit: cover;
}
}
}
/**基本信息 */
.display-detail_basic_info {
margin: 80px 0;
.info-container {
display: flex;
justify-content: center;
justify-content: space-between;
padding: 40px 20px 40px 0;
height: 100%;
.wrapper {
.info-container-left {
min-height: 200px;
border-left: 4px solid #ccc9cd;
border-right: 4px solid #ccc9cd;
position: relative;
overflow: hidden;
&:hover {
.top-list,
.bottom-list {
animation-play-state: paused;
-webkit-animation-play-state: paused;
}
}
margin-right: 40px;
flex: 1;
.top {
position: absolute;
left: 0;
top: 0;
overflow: hidden;
display: flex;
width: 1400px;
.el-image {
height: 100%;
width: 100%;
background-color: #f5f5f9;
}
}
.bottom {
position: absolute;
left: 0;
bottom: 0;
overflow: hidden;
}
.info-container-right {
flex: 1;
min-height: 200px;
padding: 40px 0 10px;
.top-wrapper,
.bottom-wrapper {
.info-title {
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 2px solid #f2f2f2;
display: flex;
width: 2400px;
}
.film-img-container {
animation: filmMoveLeft 60s linear infinite;
height: 40px;
justify-content: space-between;
img {
width: 1400px;
height: 100%;
.title {
font-size: 32px;
font-weight: 500;
color: #8b0000;
}
}
}
.info-container {
display: flex;
justify-content: space-between;
padding: 40px 20px 40px 0;
height: 100%;
.info-container-left {
min-height: 200px;
margin-right: 40px;
flex: 1;
.view-count {
font-size: 18px;
margin-top: 10px;
color: #999;
font-weight: normal;
display: flex;
align-items: center;
.el-image {
height: 100%;
width: 100%;
background-color: #f5f5f9;
.svg-icon {
margin-right: 10px;
}
}
}
.info-container-right {
flex: 1;
min-height: 200px;
padding: 40px 0 10px;
.info-title {
padding-bottom: 20px;
margin-bottom: 20px;
border-bottom: 2px solid #f2f2f2;
.basic-info {
.body-item {
display: flex;
justify-content: space-between;
.title {
font-size: 32px;
font-weight: 500;
color: #8b0000;
}
.view-count {
font-size: 18px;
margin-top: 10px;
color: #999;
font-weight: normal;
display: flex;
align-items: center;
.svg-icon {
margin-right: 10px;
}
}
}
.basic-info {
.body-item {
display: flex;
.label {
display: block;
width: 80px;
margin-right: 26px;
margin-bottom: 10px;
font-weight: bold;
color: #9f9c9a;
}
.label {
display: block;
width: 80px;
margin-right: 26px;
margin-bottom: 10px;
font-weight: bold;
color: #9f9c9a;
}
}
}
}
}
}
/**简介和视频 */
.display-detail_intro {
display: flex;
justify-content: center;
.wrapper {
display: flex;
background-color: #fafafa;
border: 2px solid #cccccc;
border-left: none;
/**简介和视频 */
.display-detail_intro {
display: flex;
justify-content: center;
.intro-content,
.intro-video {
flex: 1;
padding: 40px 0;
}
.wrapper {
display: flex;
background-color: #fafafa;
border: 2px solid #cccccc;
border-left: none;
.intro-content,
.intro-video {
flex: 1;
padding: 40px 0;
}
.intro-content {
padding: 20px;
text-indent: 32px;
background-color: #f3f3f3;
margin: 20px;
line-height: 28px;
}
.intro-content {
padding: 20px;
text-indent: 32px;
background-color: #f3f3f3;
margin: 20px;
line-height: 28px;
}
.intro-video {
padding: 20px;
}
.intro-video {
padding: 20px;
}
}
}
/**展览单元 */
.display-detail_units {
/**展览单元 */
.display-detail_units {
display: flex;
justify-content: center;
margin-top: 100px;
// height: 750px;
// height: calc(100vh);
background-image: url("~@/assets/imgs/display/red/unit-bg.jpg");
.wrapper {
// width;
display: flex;
justify-content: center;
margin-top: 100px;
// height: 750px;
// height: calc(100vh);
background-image: url("~@/assets/imgs/display/red/unit-bg.jpg");
.wrapper {
// width;
border: 2px solid #cccccc;
border-left: none;
transition: width 0.5s ease-in-out;
.units-content {
flex: 1;
display: flex;
border: 2px solid #cccccc;
border-left: none;
transition: width 0.5s ease-in-out;
.units-content {
flex: 1;
.left-menu {
width: 524px;
display: flex;
align-items: center;
flex-direction: column;
.left-menu {
width: 524px;
.left-menu-item {
height: 54px;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
position: relative;
padding: 0 22px;
display: flex;
align-items: center;
flex-direction: column;
background: #520002;
.left-menu-item {
height: 54px;
width: 100%;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
position: relative;
padding: 0 22px;
display: flex;
align-items: center;
background: #520002;
&:hover {
.text {
color: #fff;
}
&:hover {
.text {
color: #fff;
}
}
.base-img {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
// background-position: center;
// background-size: cover;
transition: all 0.3s ease;
.base-img {
img {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
// background-position: center;
// background-size: cover;
object-fit: cover;
filter: brightness(0.4);
transition: all 0.3s ease;
img {
width: 100%;
height: 100%;
object-fit: cover;
filter: brightness(0.4);
transition: all 0.3s ease;
}
&:hover {
background: #520002;
img {
display: none;
}
}
}
.active {
&:hover {
background: #520002;
img {
display: none;
}
}
}
.text {
font-size: 24px;
font-weight: 400;
color: #ccc;
position: relative;
z-index: 1;
.active {
background: #520002;
img {
display: none;
}
}
.text {
font-size: 24px;
font-weight: 400;
color: #ccc;
position: relative;
z-index: 1;
}
}
}
.right-content {
flex: 1;
.right-content {
flex: 1;
.el-col {
&:first-child {
position: relative;
.el-col {
&:first-child {
position: relative;
.img-container {
height: 420px;
}
.img-container {
height: 420px;
}
.unit-name-intro {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
padding: 100px 28px 50px;
background-image: linear-gradient(to top,
rgba(0, 0, 0, 0.8),
rgba(0, 0, 0, 0.1));
cursor: pointer;
transition: all 0.5s ease;
&:hover {
background: rgba(0, 0, 0, 0.8);
.unit-intro {
color: #fff;
}
}
.unit-name-intro {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
padding: 100px 28px 50px;
background-image: linear-gradient(to top,
rgba(0, 0, 0, 0.8),
rgba(0, 0, 0, 0.1));
cursor: pointer;
transition: all 0.5s ease;
.unit-name {
font-size: 48px;
font-weight: bold;
color: #ffffff;
text-align: center;
margin-bottom: 40px;
}
&:hover {
background: rgba(0, 0, 0, 0.8);
.unit-intro {
font-size: 16px;
font-weight: 400;
color: #ccc;
text-indent: 32px;
line-height: 40px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
color: #fff;
}
}
}
}
.img-container {
width: 100%;
// height: 100%;
height: 162px;
overflow: hidden;
cursor: pointer;
.unit-name {
font-size: 48px;
font-weight: bold;
color: #ffffff;
text-align: center;
margin-bottom: 40px;
}
&:hover {
img {
transform: scale(1.1);
.unit-intro {
font-size: 16px;
font-weight: 400;
color: #ccc;
text-indent: 32px;
line-height: 40px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
}
}
}
.img-container {
width: 100%;
// height: 100%;
height: 162px;
overflow: hidden;
cursor: pointer;
&:hover {
img {
width: 100%;
height: 100%;
object-fit: cover;
transition: all ease 0.5s;
transform: scale(1.1);
}
}
img {
width: 100%;
height: 100%;
object-fit: cover;
transition: all ease 0.5s;
}
}
}
/**以下为手风琴样式（暂时弃用） */
// &:hover {
// width: 100%;
// .custom-title,
// .units {
// display: none;
// }
// }
// .units-content {
// display: flex;
// // flex-wrap: wrap;
// flex: 1;
// &:hover {
// .units-content-item {
// width: 10vw;
// justify-content: flex-start;
// align-items: flex-start;
// padding: 50px;
// .title {
// writing-mode: vertical-rl;
// color: #ccc;
// }
// }
// }
// .units-content-item {
// width: 25%;
// // height: calc(100vh - 4px);
// display: flex;
// justify-content: center;
// align-items: center;
// position: relative;
// transition: width 0.5s ease 0.1s;
// padding: 50px;
// overflow-x: hidden;
// &:hover {
// // width: 70%;
// width: 70vw;
// .units-content-img {
// filter: none;
// background-image: url("~@/assets/imgs/display/red/unit-bg.jpg") !important;
// }
// .title {
// writing-mode: horizontal-tb;
// color: #666;
// font-size: 40px !important;
// }
// .intro {
// padding: 60px 0;
// }
// .intro,
// .imgs,
// .desc-title {
// display: block !important;
// }
// .desc-title {
// display: flex !important;
// }
// }
// .units-content-container {
// position: relative;
// z-index: 1;
// color: #fff;
// display: flex;
// flex-direction: column;
// .title {
// font-size: 32px;
// font-family: "KaiTi";
// }
// .intro {
// margin-top: 10px;
// display: none;
// font-family: "KaiTi";
// color: #333;
// text-indent: 32px;
// font-size: 22px;
// line-height: 36px;
// width: calc(68vw - 40px);
// margin-bottom: 10px;
// }
// .imgs {
// display: none;
// .el-image {
// width: 100%;
// height: 300px;
// }
// }
// .desc-title {
// display: none;
// font-size: 14px;
// color: #333;
// display: flex;
// justify-content: center;
// }
// }
// .units-content-img {
// position: absolute;
// left: 0;
// top: 0;
// width: 100%;
// height: 100%;
// // z-index: -1;
// -webkit-filter: brightness(0.3);
// filter: brightness(0.3);
// // transition: all 1s ease;
// cursor: pointer;
// background-size: cover;
// background-repeat: no-repeat;
// }
// }
// }
}
}
/**关联文献 */
.display-detail_lts {
display: flex;
justify-content: center;
margin: 100px 0;
/**以下为手风琴样式（暂时弃用） */
// &:hover {
// width: 100%;
// .custom-title,
// .units {
// display: none;
// }
// }
// .units-content {
// display: flex;
// // flex-wrap: wrap;
// flex: 1;
// &:hover {
// .units-content-item {
// width: 10vw;
// justify-content: flex-start;
// align-items: flex-start;
// padding: 50px;
// .title {
// writing-mode: vertical-rl;
// color: #ccc;
// }
// }
// }
// .units-content-item {
// width: 25%;
// // height: calc(100vh - 4px);
// display: flex;
// justify-content: center;
// align-items: center;
// position: relative;
// transition: width 0.5s ease 0.1s;
// padding: 50px;
// overflow-x: hidden;
// &:hover {
// // width: 70%;
// width: 70vw;
// .units-content-img {
// filter: none;
// background-image: url("~@/assets/imgs/display/red/unit-bg.jpg") !important;
// }
// .title {
// writing-mode: horizontal-tb;
// color: #666;
// font-size: 40px !important;
// }
// .intro {
// padding: 60px 0;
// }
// .intro,
// .imgs,
// .desc-title {
// display: block !important;
// }
// .desc-title {
// display: flex !important;
// }
// }
// .units-content-container {
// position: relative;
// z-index: 1;
// color: #fff;
// display: flex;
// flex-direction: column;
// .title {
// font-size: 32px;
// font-family: "KaiTi";
// }
// .intro {
// margin-top: 10px;
// display: none;
// font-family: "KaiTi";
// color: #333;
// text-indent: 32px;
// font-size: 22px;
// line-height: 36px;
// width: calc(68vw - 40px);
// margin-bottom: 10px;
// }
// .imgs {
// display: none;
// .el-image {
// width: 100%;
// height: 300px;
// }
// }
// .desc-title {
// display: none;
// font-size: 14px;
// color: #333;
// display: flex;
// justify-content: center;
// }
// }
// .units-content-img {
// position: absolute;
// left: 0;
// top: 0;
// width: 100%;
// height: 100%;
// // z-index: -1;
// -webkit-filter: brightness(0.3);
// filter: brightness(0.3);
// // transition: all 1s ease;
// cursor: pointer;
// background-size: cover;
// background-repeat: no-repeat;
// }
// }
// }
}
}
.wrapper {
display: flex;
background-color: #fafafa;
border: 2px solid #cccccc;
border-left: none;
/**关联文献 */
.display-detail_lts {
display: flex;
justify-content: center;
margin: 100px 0;
.lts-content {
width: 100%;
flex: 1;
padding: 10px;
}
.wrapper {
display: flex;
background-color: #fafafa;
border: 2px solid #cccccc;
border-left: none;
.lts-content {
width: 100%;
flex: 1;
padding: 10px;
}
}
}
}
}
::v-deep .el-carousel__item--card {
width: 100%;
height: 100%;
transform: translateX(0) scale(1) !important;
}
@keyframes filmMoveLeft {
0% {
transform: translateX(0);
}
::v-deep .el-carousel__item--card {
width: 100%;
height: 100%;
transform: translateX(0) scale(1) !important;
}
100% {
transform: translateX(-1400px);
}
@keyframes filmMoveLeft {
0% {
transform: translateX(0);
}
@keyframes filmMoveRight {
0% {
transform: translateX(0);
}
100% {
transform: translateX(-1400px);
}
}
100% {
transform: translateX(1400px);
}
@keyframes filmMoveRight {
0% {
transform: translateX(0);
}
@keyframes audioRotate {
0% {
transform: rotateZ(0deg);
}
100% {
transform: translateX(1400px);
}
}
100% {
transform: rotateZ(360deg);
}
@keyframes audioRotate {
0% {
transform: rotateZ(0deg);
}
@-webkit-keyframes audioRotate {
0% {
transform: rotateZ(0deg);
}
100% {
transform: rotateZ(360deg);
}
}
100% {
transform: rotateZ(360deg);
}
@-webkit-keyframes audioRotate {
0% {
transform: rotateZ(0deg);
}
.animation-play-paused {
animation-play-state: paused;
-webkit-animation-play-state: paused;
/* Safari 和 Chrome */
100% {
transform: rotateZ(360deg);
}
}
.animation-play-paused {
animation-play-state: paused;
-webkit-animation-play-state: paused;
/* Safari 和 Chrome */
}
</style>
\ No newline at end of file
src/views/display/config.js
浏览文件 @ e807e5ce
......@@ -69,11 +69,7 @@ export const title = [{
sortable: true
},
{
prop: "remark",
label: "备注",
columnAlign: 'center', showOverFlowToolTip: true,
},
{
prop: "status",
label: "是否上架",
......@@ -89,6 +85,11 @@ export const title = [{
prop: "themeType",
label: "模板主题",
columnAlign: 'center',
},
{
prop: "remark",
label: "备注",
columnAlign: 'center', showOverFlowToolTip: true,
},
// {
// prop: "images",
......@@ -113,7 +114,7 @@ export const title = [{
export const operates = {
operate: true,
label: "操作",
width: "260px",
width: "320px",
minwidth: "220px",
titleAlign: "center",
columnAlign: "center",
......@@ -127,11 +128,14 @@ export const operations = [{
type: 'edit',
title: '编辑'
},
// {
// type: 'approval',
// title: '提交审核'
// },
{
type: 'delete',
title: '删除'
},
]
export const literatureTableTitle = [{
......@@ -168,29 +172,29 @@ export const importRecordsTitle = [{
width: 300
},
{
prop:'username',
label:'操作用户',
prop: 'username',
label: '操作用户',
columnAlign: "center",
},
{
prop:'optType',
label:'操作类型',
prop: 'optType',
label: '操作类型',
columnAlign: "center",
},
// {
// prop: "fileSize",
// label: "文件大小",
// columnAlign: "center",
// },
// {
// prop: "remark",
// label: "备注",
// columnAlign: "center",
// width: "60px",
// },
// {
// prop: "fileSize",
// label: "文件大小",
// columnAlign: "center",
// },
// {
// prop: "remark",
// label: "备注",
// columnAlign: "center",
// width: "60px",
// },
]
export const importOperates = {
......
src/views/display/index.vue
浏览文件 @ e807e5ce
......@@ -33,7 +33,8 @@
<TablePage :data="list.records" :tableTitle="tableTitle" :operates="tableOperates">
<template v-slot:status="data">
<el-popconfirm :title="getStatusTitle(data.scope.status)" @onConfirm="handleChangeStatus(data.scope)">
<el-switch slot="reference" :value="Boolean(Number(data.scope.status))"></el-switch>
<el-switch slot="reference" :disabled="isDisabledStatusbtn(data.scope.checkStatus)"
:value="Boolean(Number(data.scope.status))"></el-switch>
</el-popconfirm>
</template>
<template v-slot:displayType="data">
......@@ -42,7 +43,7 @@
<template v-slot:checkStatus="data">
<!-- {{ data.scope.checkStatus }} -->
<el-tag type="primary" v-if="data.scope.checkStatus == 0">
待审核
审核中
</el-tag>
<el-tag type="success" v-if="data.scope.checkStatus == 1">
已通过
......@@ -50,6 +51,9 @@
<el-tag type="danger" v-if="data.scope.checkStatus == -2">
已驳回
</el-tag>
<el-tag type="warning" v-if="(data.scope.checkStatus == -1)">
待提交
</el-tag>
</template>
<template v-slot:faceImageUrl="data">
<img :src="
......@@ -62,7 +66,8 @@
{{ themeTypeCode(data.scope.themeType) }}
</template>
<template v-slot:operates="scope">
<TableOperation :operations="tableOperations" :rawData="scope.scope.row" @handleOperation="handleOperation">
<TableOperation :operations="tableOperations" :rawData="scope.scope.row" @handleOperation="handleOperation"
:disabled="isDisabled(scope.scope.row.checkStatus)">
</TableOperation>
</template>
</TablePage>
......@@ -217,6 +222,20 @@ export default {
}
};
},
isDisabled(checkStatus) {
return (checkStatus) => {
return checkStatus == '0'
//在审核中和已通过，则不能使用提交审核、编辑及删除按钮
}
},
isDisabledStatusbtn(checkStatus) {
//待提交、审核中，不能使用上下架
return (checkStatus) => {
return checkStatus == '0' || checkStatus == '-1'
}
}
},
async created() {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论