Skip to content

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

修改登录页；增加文创和文献的提交loading

上级 e364dd0d
隐藏空白字符变更
内嵌 并排
正在显示 包含 709 行增加 和 536 行删除
src/components/VueQuillEditor/index.vue
浏览文件 @ 67072e65
......@@ -62,7 +62,7 @@ export default {
[{ font: [] }], // 字体种类-----[{ font: [] }]
[{ align: [] }], // 对齐方式-----[{ align: [] }]
["clean"], // 清除文本格式-----['clean']
["image"], // 链接、图片、视频-----['link', 'image', 'video']
// ["image"], // 链接、图片、视频-----['link', 'image', 'video']
];
return {
content: this.value, //内容
......
src/main.js
浏览文件 @ 67072e65
......@@ -28,6 +28,22 @@ Vue.use(ElementUI)
Vue.config.productionTip = false
// 自定义指令，防止用户多次提交，点击一次后禁用，持续两秒
Vue.directive('preventReClick', {
inserted(el, binding) {
el.addEventListener('click', () => {
if (!el.disabled) {
el.disabled = true
setTimeout(() => {
el.disabled = false
}, binding.value || 2000)
}
})
}
});
new Vue({
el: '#app',
router,
......
src/utils/file.js
浏览文件 @ 67072e65
......@@ -118,26 +118,30 @@ export function previewFile(href, previewName) {
* @param typeSuffix 文件后缀
*/
export function downloadBlob(url, fileName, typeSuffix) {
axios({
url,
method: 'get',
responseType: 'blob',
headers: {
'authorization': getToken()
}
}).
then(response => {
const blob = new Blob([response.data])
const link = document.createElement('a')
link.href = URL.createObjectURL(blob)
if (typeSuffix) {
link.download = fileName + '.' + typeSuffix
} else {
link.download = fileName
}
link.click()
URL.revokeObjectURL(link.href)
}).catch(err => {
console.error(err);
return new Promise((resolve,reject)=>{
axios({
url,
method: 'get',
responseType: 'blob',
headers: {
'authorization': getToken()
}
}).
then(response => {
const blob = new Blob([response.data])
const link = document.createElement('a')
link.href = URL.createObjectURL(blob)
if (typeSuffix) {
link.download = fileName + '.' + typeSuffix
} else {
link.download = fileName
}
link.click()
URL.revokeObjectURL(link.href)
resolve()
}).catch(err => {
console.error(err);
reject(err)
})
})
};
src/views/culturalRelic/components/InfoEditDialog.vue
浏览文件 @ 67072e65
......@@ -151,7 +151,7 @@
style="width: 100%"
filterable
>
<el-option
<el-option
v-for="(value, key) in dicts.culturalRelicSourceWay"
:key="key"
:label="value"
......@@ -159,7 +159,6 @@
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="是否上架" :label-width="formLabelWidth">
......@@ -261,7 +260,11 @@
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit" :loading="loading"
<el-button
type="primary"
@click="handleSubmit"
:loading="loading"
preventReClick
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
......@@ -442,7 +445,7 @@ export default {
await this.$store.dispatch("dict/getDictList", [
"culturalRelicLevel",
"culturalRelicType",
"culturalRelicSourceWay"
"culturalRelicSourceWay",
]);
let res = await this.$store.dispatch("dict/getDictTree", [
......@@ -739,32 +742,10 @@ export default {
.relate {
flex: 1;
}
.dialog-footer {
display: flex;
align-items: flex-end;
margin: 20px 0;
}
}
.upload-box {
background-color: #fbfdff;
border: 1px dashed #c0ccda;
border-radius: 6px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
width: 148px;
height: 148px;
line-height: 146px;
vertical-align: top;
text-align: center;
margin: 0 8px 8px 0;
i {
font-size: 28px;
color: #8c939d;
}
}
.video-lists {
.dialog-footer {
display: flex;
align-items: flex-end;
margin: 20px 0;
}
</style>
src/views/literature/components/InfoEditDialog.vue
浏览文件 @ 67072e65
......@@ -2,7 +2,6 @@
<el-dialog
:visible="dialogVisible"
width="40%"
style="height: 98%"
:before-close="handleClose"
top="5vh"
lock-scroll
......@@ -11,74 +10,77 @@
<div class="divider"></div>
<div class="label">{{ title }}</div>
</div>
<div class="dialog-content">
<el-form :model="dialogForm" class="basic-info">
<el-form-item label="名称" :label-width="formLabelWidth">
<el-input
v-model="dialogForm.name"
autocomplete="off"
placeholder="请输入文献名称"
></el-input>
</el-form-item>
<el-form-item label="作者" :label-width="formLabelWidth">
<el-input
v-model="dialogForm.authors"
autocomplete="off"
placeholder="请输入作者"
></el-input>
</el-form-item>
<el-form-item label="文献来源" :label-width="formLabelWidth">
<el-input
v-model="dialogForm.source"
autocomplete="off"
placeholder="请输入文献来源"
></el-input>
</el-form-item>
<el-form-item label="出版/发布日期" :label-width="formLabelWidth">
<el-date-picker
style="width: 100%"
v-model="dialogForm.date"
type="date"
placeholder="请选择出版/发布日期"
value-format="yyyy-MM-dd"
>
</el-date-picker>
</el-form-item>
<div class="el-dialog-div">
<div class="dialog-content">
<el-form
:model="dialogForm"
class="basic-info"
ref="form"
:rules="rules"
>
<el-form-item label="名称" :label-width="formLabelWidth" prop="name">
<el-input
v-model="dialogForm.name"
autocomplete="off"
placeholder="请输入文献名称"
></el-input>
</el-form-item>
<el-form-item label="作者" :label-width="formLabelWidth">
<el-input
v-model="dialogForm.authors"
autocomplete="off"
placeholder="请输入作者"
></el-input>
</el-form-item>
<el-form-item label="文献来源" :label-width="formLabelWidth">
<el-input
v-model="dialogForm.source"
autocomplete="off"
placeholder="请输入文献来源"
></el-input>
</el-form-item>
<el-form-item label="出版/发布日期" :label-width="formLabelWidth">
<el-date-picker
style="width: 100%"
v-model="dialogForm.date"
type="date"
placeholder="请选择出版/发布日期"
value-format="yyyy-MM-dd"
>
</el-date-picker>
</el-form-item>
<el-form-item label="状态" :label-width="formLabelWidth">
<el-switch v-model="status"> </el-switch>
</el-form-item>
<el-form-item label="文件" :label-width="formLabelWidth">
<ManualUploader
:files="files"
:fileLimit="1"
:fileSize="50"
listType="text"
<<<<<<< HEAD
:fileType="['pdf','ttf']"
=======
:fileType="['pdf']"
>>>>>>> f07b1c1b191bef418ce077a9c7b4d53fd7b72cee
ref="pdf"
/>
</el-form-item>
<el-form-item label="备注" :label-width="formLabelWidth">
<el-input
type="textarea"
placeholder="请输入备注"
v-model="dialogForm.remark"
maxlength="600"
show-word-limit
>
</el-input>
</el-form-item>
</el-form>
</div>
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
<el-form-item label="状态" :label-width="formLabelWidth">
<el-switch v-model="status"> </el-switch>
</el-form-item>
<el-form-item label="文件" :label-width="formLabelWidth">
<ManualUploader
:files="files"
:fileLimit="1"
:fileSize="50"
listType="text"
:fileType="['pdf']"
ref="pdf"
/>
</el-form-item>
<el-form-item label="备注" :label-width="formLabelWidth">
<el-input
type="textarea"
placeholder="请输入备注"
v-model="dialogForm.remark"
maxlength="600"
show-word-limit
>
</el-input>
</el-form-item>
</el-form>
</div>
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</div>
</el-dialog>
</template>
......@@ -147,64 +149,84 @@ export default {
status: true,
files: [], //文献文件
dialogVisible: false,
rules: {
name: [
{
required: true,
message: "请输入文献名称",
trigger: "blur",
},
],
},
};
},
methods: {
handlePreview({ type, file }) {
console.log(type, file);
},
handleRemove(file, fileList) {
console.log(file, fileList);
},
// 取消编辑
cancelForm() {
this.$emit("handleClose");
this.faceImage = [];
this.reset();
},
async handleSubmit() {
let params = JSON.parse(JSON.stringify(this.dialogForm));
// 回填文件
let file = this.$refs.pdf.getFiles();
let formData = new FormData();
if (file[0].status == "ready") {
formData.append("files", file[0].raw);
let upLoadRes = await uploadFile(formData);
if (upLoadRes.code == 0) {
params.pdfFile = upLoadRes.data[0].fileId;
} else {
this.$message.error("上传失败！:" + upLoadRes.data.msg);
}
} else if (file[0].status == "success") {
params.pdfFile = file[0].fileId;
}
// 修改状态
params.status = this.status ? 1 : 0;
if (params.literatureId) {
let res = await editLiterature(params);
if (res.code == 0) {
this.$message.success("修改成功！");
this.reload();
}
} else {
let res = await addLiterature(params);
if (res.code == 0) {
this.$message.success("添加成功！");
this.reload();
}
}
resetChildData() {
this.files = [];
this.$refs.form.resetFields();
},
reload() {
this.$emit("refresh");
reloadParent() {
this.$emit("handleClose");
this.files = [];
this.$emit("reloadParent");
},
handleSubmit() {
let that = this;
this.$refs.form.validate(async (valid) => {
if (valid) {
let params = JSON.parse(JSON.stringify(that.dialogForm));
// 回填文件
let file = that.$refs.pdf.getFiles();
let formData = new FormData();
if (file.length > 0) {
if (file[0].status == "ready") {
formData.append("files", file[0].raw);
let upLoadRes = await uploadFile(formData);
if (upLoadRes.code == 0) {
params.pdfFile = upLoadRes.data[0].fileId;
} else {
that.$message.error("上传失败！:" + upLoadRes.data.msg);
}
} else if (file[0].status == "success") {
params.pdfFile = file[0].fileId;
}
} else {
params.pdfFile = "";
}
// 修改状态
params.status = that.status ? 1 : 0;
if (params.literatureId) {
let res = await editLiterature(params);
if (res.code == 0) {
that.$message.success("修改成功！");
that.reloadParent();
that.resetChildData();
}
} else {
let res = await addLiterature(params);
if (res.code == 0) {
that.$message.success("添加成功！");
that.reloadParent();
that.resetChildData();
}
}
}
});
},
handleClose(done) {
this.$confirm("确认关闭？")
.then((_) => {
done();
this.$emit("handleClose");
this.files = [];
this.reloadParent();
this.resetChildData();
})
.catch((_) => {});
},
......@@ -225,6 +247,12 @@ export default {
font-weight: bold;
}
}
.el-dialog-div {
height: 70vh;
overflow-x: hidden;
}
.dialog-content {
padding: 0 32px;
display: flex;
......@@ -232,10 +260,13 @@ export default {
flex: 1;
margin-right: 48px;
}
.relate {
flex: 1;
}
}
.dialog-footer {
display: flex;
justify-content: flex-end;
margin: 20px 0;
}
</style>
\ No newline at end of file
src/views/literature/index.vue
浏览文件 @ 67072e65
......@@ -2,241 +2,286 @@
<div class="app-container">
<div class="top-bar">
<SearchBar :config="searchConfig" @search="search" @reset="reset" />
<el-button type="primary" @click.native="handleOperation({ type: 'add' })" icon="el-icon-plus">
添加</el-button>
<el-button
type="primary"
@click.native="handleOperation({ type: 'add' })"
icon="el-icon-plus"
>
添加</el-button
>
</div>
<TablePage :data="list.records" :tableTitle="tableTitle" :operates="tableOperates">
<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-popconfirm
:title="getStatusTitle(data.scope.status)"
@onConfirm="handleChangeStatus(data.scope)"
>
<el-switch
slot="reference"
:value="Boolean(Number(data.scope.status))"
></el-switch>
</el-popconfirm>
</template>
<template v-slot:operates="scope">
<TableOperation :operations="tableOperations" :rawData="scope.scope.row" @handleOperation="handleOperation">
<TableOperation
:operations="tableOperations"
:rawData="scope.scope.row"
@handleOperation="handleOperation"
>
</TableOperation>
</template>
</TablePage>
<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange"
:current-page="Number(list.current)" :page-sizes="[10, 20, 40, 50]" :page-size="Number(list.size)"
layout="total, sizes, prev, pager, next, jumper" :total="Number(list.total)" class="pagination">
<el-pagination
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="Number(list.current)"
:page-sizes="[10, 20, 40, 50]"
:page-size="Number(list.size)"
layout="total, sizes, prev, pager, next, jumper"
:total="Number(list.total)"
class="pagination"
>
</el-pagination>
<InfoEditDialog :visible="drawerVisible" :form="form" @handleClose="handleClose" @refresh="loadData" />
<InfoEditDialog
:visible="drawerVisible"
:form="form"
@handleClose="handleClose"
@reloadParent="loadData"
/>
</div>
</template>
<script>
import TablePage from "@/components/Table/TablePage.vue";
import TableOperation from "@/components/Table/TableOperation.vue";
import { title, operates, operations } from "./config";
import { editLiterature, deleteLt } from "@/api/literature";
import InfoEditDialog from "./components/InfoEditDialog";
import SearchBar from "@/components/SearchBar";
import { downloadFile, previewFile, downloadBlob } from "@/utils/file";
import TablePage from "@/components/Table/TablePage.vue";
import TableOperation from "@/components/Table/TableOperation.vue";
import { title, operates, operations } from "./config";
import { editLiterature, deleteLt } from "@/api/literature";
import InfoEditDialog from "./components/InfoEditDialog";
import SearchBar from "@/components/SearchBar";
import { downloadFile, previewFile, downloadBlob } from "@/utils/file";
export default {
components: {
TablePage,
TableOperation,
InfoEditDialog,
SearchBar,
},
data() {
return {
list: {
records: [],
size: 10,
current: 1,
total: 0,
export default {
components: {
TablePage,
TableOperation,
InfoEditDialog,
SearchBar,
},
data() {
return {
list: {
records: [],
size: 10,
current: 1,
total: 0,
},
searchForm: {
name: "",
status: "",
},
searchConfig: [
{
prop: "name",
type: "input",
label: "文献名称",
},
searchForm: {
name: "",
status: "",
{
prop: "authors",
type: "input",
label: "作者",
},
searchConfig: [
{
prop: "name",
type: "input",
label: "文献名称",
},
{
prop: "authors",
type: "input",
label: "作者",
},
{
prop: "status",
type: "select",
label: "状态",
selectOptions: [
{
label: "已上架",
value: "1",
},
{
label: "已下架",
value: "0",
},
],
},
],
drawerVisible: false,
form: {
name: "", //名称
authors: "", //作者
date: "", //日期（出版年份、发布日期）
source: "", //文献来源
status: 1, //上下架状态
remark: "", //备注
{
prop: "status",
type: "select",
label: "状态",
selectOptions: [
{
label: "已上架",
value: "1",
},
{
label: "已下架",
value: "0",
},
],
},
],
drawerVisible: false,
form: {
name: "", //名称
authors: "", //作者
date: "", //日期（出版年份、发布日期）
source: "", //文献来源
status: 1, //上下架状态
remark: "", //备注
},
};
},
computed: {
tableTitle() {
return title;
},
tableOperates() {
return operates;
},
tableOperations() {
return operations;
},
getStatusTitle(status) {
return (status) => {
if (Number(status)) {
return "是否确定要下架？";
} else {
return "是否确定要上架？";
}
};
},
},
mounted() {
this.loadData();
},
methods: {
async search(form) {
var params = {
page: this.list.current,
limit: this.list.size,
...form,
};
if (params.status == "") {
delete params.status;
}
const res = await this.$store.dispatch("dict/getLtList", params);
if (res.code == 0) {
this.list = res.data;
}
},
computed: {
tableTitle() {
return title;
},
tableOperates() {
return operates;
},
tableOperations() {
return operations;
},
getStatusTitle(status) {
return (status) => {
if (Number(status)) {
return "是否确定要下架？";
reset() {
this.loadData();
},
// 加载表格数据
async loadData() {
var params = {
page: this.list.current,
limit: this.list.size,
};
const res = await this.$store.dispatch("dict/getLtList", params);
if (res.code == 0) {
this.list = res.data;
}
},
async handleOperation(value, row) {
switch (value.type) {
case "add":
this.drawerVisible = true;
break;
case "view":
if (row.files && row.files.length > 0 && row.files[0].url ) {
previewFile(row.files[0].url, row.name);
} else {
return "是否确定要上架？";
let m = this.$message.info("暂无文献附件！");
setTimeout(() => {
m.close();
}, 1500);
}
};
},
},
mounted() {
this.loadData();
break;
case "download":
if (row.files && row.files.length > 0 && row.files[0].url) {
let start = this.$message.info("正在准备下载...");
let url = "/files" + row.files[0].url.split("files")[1];
downloadBlob(url, row.name, "pdf")
.then((res) => {
start.close();
this.$message.success("下载成功！");
})
.catch((err) => {
start.close();
this.$message.error("下载失败：" + err);
});
} else {
let m = this.$message.info("暂无文献！");
setTimeout(() => {
m.close();
}, 1500);
}
break;
case "edit":
this.form = row;
this.drawerVisible = true;
break;
case "delete":
let deleteRes = await deleteLt([row.literatureId]);
if (deleteRes.code == 0) {
this.$message.success("删除成功！");
this.loadData();
}
break;
}
},
methods: {
async search(form) {
var params = {
page: this.list.current,
limit: this.list.size,
...form,
};
if (params.status == "") {
delete params.status;
}
const res = await this.$store.dispatch("dict/getLtList", params);
if (res.code == 0) {
this.list = res.data;
}
},
reset() {
async handleChangeStatus(row) {
console.log("status", row);
const { status } = row;
let newStatus = status === "0" ? "1" : "0";
const params = {
...row,
status: newStatus,
};
let res = await editLiterature(params);
if (res.code == 0) {
this.loadData();
},
// 加载表格数据
async loadData() {
var params = {
page: this.list.current,
limit: this.list.size,
};
const res = await this.$store.dispatch("dict/getLtList", params);
if (res.code == 0) {
this.list = res.data;
}
},
async handleOperation(value, row) {
console.log("handleOperation", value, row);
switch (value.type) {
case "add":
this.drawerVisible = true;
break;
case "view":
if (row.files && row.files.length > 0 && row.files[0].url) {
previewFile(row.files[0].url, row.name);
} else {
this.$message.info("暂无文献附件！");
}
break;
case "download":
if (row.files && row.files.length > 0 && row.files[0].url) {
let url = '/files' + row.files[0].url.split('files')[1]
downloadBlob(url, row.name, "pdf");
} else {
this.$message.info("暂无文献！");
}
break;
case "edit":
this.form = row;
this.drawerVisible = true;
break;
case "delete":
let deleteRes = await deleteLt([row.literatureId]);
if (deleteRes.code == 0) {
this.$message.success("删除成功！");
this.loadData();
}
break;
}
},
async handleChangeStatus(row) {
console.log("status", row);
const { status } = row;
let newStatus = status === "0" ? "1" : "0";
const params = {
...row,
status: newStatus,
};
let res = await editLiterature(params);
if (res.code == 0) {
this.loadData();
this.$message.success("修改成功！");
}
},
this.$message.success("修改成功！");
}
},
// 改变页容量
handleSizeChange(value) {
this.list.size = value;
this.loadData();
},
// 改变页容量
handleSizeChange(value) {
this.list.size = value;
this.loadData();
},
// 改变当前显示页
handleCurrentChange(value) {
this.list.current = value;
this.loadData();
},
// 改变当前显示页
handleCurrentChange(value) {
this.list.current = value;
this.loadData();
},
// 关闭Dialog
handleClose() {
this.drawerVisible = false;
this.form = {
status: 1,
};
},
// 关闭Dialog
handleClose() {
this.drawerVisible = false;
this.form = {
status: 1,
};
},
};
},
};
</script>
<style lang="scss" scoped>
.top-bar {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.top-bar {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
}
.pagination {
margin: 16px;
}
.pagination {
margin: 16px;
}
// .el-button {
// margin-bottom: 22px;
// }
// .el-button {
// margin-bottom: 22px;
// }
::v-deep .el-card__header {
padding: 10px 20px;
font-weight: bold;
}
::v-deep .el-card__header {
padding: 10px 20px;
font-weight: bold;
}
</style>
\ No newline at end of file
src/views/login/index.vue
浏览文件 @ 67072e65
<template>
<div class="login-container">
<el-form
ref="loginForm"
:model="loginForm"
:rules="loginRules"
class="login-form"
auto-complete="on"
label-position="left"
>
<div class="title-container">
<h3 class="title">欢迎登录贵州省精品展览展示管理系统</h3>
<div class="login-box">
<div class="left">
<div class="logo">
<div class="logo-container">
<img src="@/assets/imgs/login/logo.png" alt="" />
</div>
<div class="text">
<span class="ch"> 贵州博物馆精品展览展示平台管理后台</span>
<span class="en">
Management Background Of Guizhou Museum Boutique Exhibition
Platform</span
>
</div>
</div>
</div>
<div class="login-container right">
<el-form
ref="loginForm"
:model="loginForm"
:rules="loginRules"
class="login-form"
auto-complete="on"
label-position="left"
>
<div class="title-container">
<h3 class="title">欢迎登录</h3>
</div>
<el-form-item prop="username">
<span class="svg-container">
<svg-icon icon-class="user" />
</span>
<el-input
ref="username"
v-model="loginForm.username"
placeholder="Username"
name="username"
type="text"
tabindex="1"
auto-complete="on"
/>
</el-form-item>
<el-form-item prop="username">
<span class="svg-container">
<svg-icon icon-class="user" />
</span>
<el-input
ref="username"
v-model="loginForm.username"
placeholder="用户名"
name="username"
type="text"
tabindex="1"
auto-complete="on"
/>
</el-form-item>
<el-form-item prop="password">
<span class="svg-container">
<svg-icon icon-class="password" />
</span>
<el-input
:key="passwordType"
ref="password"
v-model="loginForm.password"
:type="passwordType"
placeholder="Password"
name="password"
tabindex="2"
auto-complete="on"
/>
<span class="show-pwd" @click="showPwd">
<svg-icon
:icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"
<el-form-item prop="password">
<span class="svg-container">
<svg-icon icon-class="password" />
</span>
<el-input
:key="passwordType"
ref="password"
v-model="loginForm.password"
:type="passwordType"
placeholder="密码"
name="password"
tabindex="2"
auto-complete="on"
/>
</span>
</el-form-item>
<span class="show-pwd" @click="showPwd">
<svg-icon
:icon-class="passwordType === 'password' ? 'eye' : 'eye-open'"
/>
</span>
</el-form-item>
<el-row :gutter="10">
<el-col :span="16">
<el-form-item prop="captcha">
<el-input
ref="captcha"
v-model="loginForm.captcha"
placeholder="请输入验证码"
name="captcha"
tabindex="3"
auto-complete="on"
@keyup.enter.native="handleLogin"
<el-row :gutter="10">
<el-col :span="16">
<el-form-item prop="captcha">
<el-input
ref="captcha"
v-model="loginForm.captcha"
placeholder="请输入验证码"
name="captcha"
tabindex="3"
auto-complete="on"
@keyup.enter.native="handleLogin"
/>
</el-form-item>
</el-col>
<el-col :span="8" class="captcha">
<img
v-if="requestCodeSuccess"
style="margin-top: 2px"
:src="captchaImgSrc"
@click="handleGetCaptcha"
/>
</el-form-item>
</el-col>
<el-col :span="8" class="captcha">
<img
v-if="requestCodeSuccess"
style="margin-top: 2px"
:src="captchaImgSrc"
@click="handleGetCaptcha"
/>
<img
v-else
style="margin-top: 2px"
src="@/assets/404_images/checkcode.png"
@click="handleGetCaptcha"
/>
</el-col>
</el-row>
<img
v-else
style="margin-top: 2px"
src="@/assets/404_images/checkcode.png"
@click="handleGetCaptcha"
/>
</el-col>
</el-row>
<el-button
:loading="loading"
type="primary"
style="width: 100%; margin-bottom: 30px"
@click.native.prevent="handleLogin"
>登录</el-button
>
</el-form>
<el-button
:loading="loading"
type="primary"
style="width: 100%; margin-bottom: 30px"
@click.native.prevent="handleLogin"
>登录</el-button
>
</el-form>
</div>
<div class="footer">贵州省文化和旅游厅版权所有</div>
</div>
</template>
......@@ -98,14 +115,14 @@ export default {
loginForm: {
username: "",
password: "",
captcha:''
captcha: "",
},
loginRules: {
username: [
{ required: true, trigger: "blur", message: "请输入用户名" },
],
password: [{ required: true, trigger: "blur", message: "请输入密码" }],
captcha: [{ required: true, trigger: "blur", message: "请输入验证码" } ],
captcha: [{ required: true, trigger: "blur", message: "请输入验证码" }],
},
loading: false,
passwordType: "password",
......@@ -156,7 +173,7 @@ export default {
this.loading = true;
this.$store
.dispatch("user/login", this.loginForm)
.then(async() => {
.then(async () => {
// debugger
// await this.$store.dispatch('user/getMenuList')
this.$router.push({ path: this.redirect || "/" });
......@@ -202,10 +219,11 @@ $cursor: #fff;
-webkit-appearance: none;
border-radius: 0px;
padding: 12px 5px 12px 15px;
color: $light_gray;
// color: $light_gray;
color: #333;
height: 47px;
caret-color: $cursor;
// caret-color: $cursor;
caret-color: #333;
&:-webkit-autofill {
box-shadow: 0 0 0px 1000px $bg inset !important;
-webkit-text-fill-color: $cursor !important;
......@@ -214,8 +232,10 @@ $cursor: #fff;
}
.el-form-item {
border: 1px solid rgba(255, 255, 255, 0.1);
background: rgba(0, 0, 0, 0.1);
// border: 1px solid rgba(255, 255, 255, 0.1);
// background: rgba(0, 0, 0, 0.1);
border: 2px solid #e0e7ff;
background: transparent;
border-radius: 5px;
color: #454545;
}
......@@ -226,20 +246,74 @@ $cursor: #fff;
$bg: #2d3a4b;
$dark_gray: #889aa4;
$light_gray: #eee;
.login-box {
display: flex;
height: 100vh;
width: 100%;
overflow: hidden;
background-image: url("~@/assets/imgs/login/bg.png");
background-size: 100% 100%;
background-repeat: no-repeat;
box-sizing: border-box;
position: relative;
}
.left,
.right {
width: 50%;
height: 100%;
}
.left {
padding: 80px 0 0 100px;
.logo {
display: flex;
.logo-container {
width: 140px;
height: 140px;
margin-right: 4px;
img {
width: 100%;
}
}
.ch {
color: #fff;
font-size: 38px;
display: inline-block;
margin: 6px 0 10px;
letter-spacing: 2px;
}
.en {
color: #fff;
font-size: 20px;
display: inline-block;
letter-spacing: 1px;
}
}
}
.login-container {
min-height: 100%;
width: 100%;
background-color: $bg;
// width: 100%;
// background-color: $bg;
overflow: hidden;
display: flex;
justify-content: center;
align-items: center;
.login-form {
position: relative;
width: 520px;
max-width: 100%;
padding: 160px 35px 0;
margin: 0 auto;
padding: 120px 35px;
// margin: 0 auto;
overflow: hidden;
// background: #12417b;
// background: url("~@/assets/imgs/login/login-bg.png") 100% 100% no-repeat;
background-color: #fff;
border-radius: 16px;
box-shadow: 2px 6px 6px 2px rgba(0, 0, 0, 0.1);
}
.tips {
......@@ -267,7 +341,8 @@ $light_gray: #eee;
.title {
font-size: 26px;
color: $light_gray;
// color: $light_gray;
color: #333;
margin: 0px auto 40px auto;
text-align: center;
font-weight: bold;
......@@ -294,4 +369,19 @@ $light_gray: #eee;
}
}
}
.el-button--primary {
background-color: #1d63c3;
color: #fff;
&:hover {
background-color: rgba($color: #1d63c3, $alpha: 0.8);
}
}
.footer {
position: absolute;
bottom: 40px;
left: 50%;
transform: translateX(-50%);
}
</style>
src/views/product/components/InfoEditDialog.vue
浏览文件 @ 67072e65
......@@ -2,9 +2,8 @@
<el-dialog
:visible.sync="dialogVisible"
width="40%"
style="height: 98%"
:before-close="handleClose"
top="5vh"
top="2vh"
lock-scroll
v-loading="submitLoading"
element-loading-background="rgba(0, 0, 0, 0.5)"
......@@ -14,69 +13,71 @@
<div class="divider"></div>
<div class="label">{{ title }}</div>
</div>
<div class="dialog-content">
<el-form :model="dialogForm" class="basic-info">
<el-form-item label="名称" :label-width="formLabelWidth">
<el-input
v-model="dialogForm.title"
autocomplete="off"
placeholder="请输入名称"
></el-input>
</el-form-item>
<el-form-item label="所属博物馆" :label-width="formLabelWidth">
<el-cascader
style="width: 100%"
v-model="dialogForm.deptId"
:options="orgTreeData"
:props="optionProps"
placeholder="请选择所属博物馆"
:key="pidModalKey"
filterable
>
</el-cascader>
</el-form-item>
<el-form-item label="所属地" :label-width="formLabelWidth">
<el-cascader
style="width: 100%"
v-model="dialogForm.regionCode"
:options="regionTree"
:props="regionOptionProps"
placeholder="请选择所属地"
:key="regionCodeModalKey"
filterable
>
</el-cascader>
</el-form-item>
<div class="el-dialog-div">
<div class="dialog-content">
<el-form :model="dialogForm" class="basic-info">
<el-form-item label="名称" :label-width="formLabelWidth">
<el-input
v-model="dialogForm.title"
autocomplete="off"
placeholder="请输入名称"
></el-input>
</el-form-item>
<el-form-item label="所属博物馆" :label-width="formLabelWidth">
<el-cascader
style="width: 100%"
v-model="dialogForm.deptId"
:options="orgTreeData"
:props="optionProps"
placeholder="请选择所属博物馆"
:key="pidModalKey"
filterable
>
</el-cascader>
</el-form-item>
<el-form-item label="所属地" :label-width="formLabelWidth">
<el-cascader
style="width: 100%"
v-model="dialogForm.regionCode"
:options="regionTree"
:props="regionOptionProps"
placeholder="请选择所属地"
:key="regionCodeModalKey"
filterable
>
</el-cascader>
</el-form-item>
<el-form-item label="展览介绍" :label-width="formLabelWidth">
<VueQuillEditor
ref="VueQuillEditor"
v-model="dialogForm.intro"
:placeholder="'请输入产品介绍'"
/>
</el-form-item>
<el-form-item label="展览介绍" :label-width="formLabelWidth">
<VueQuillEditor
ref="VueQuillEditor"
v-model="dialogForm.intro"
:placeholder="'请输入产品介绍'"
/>
</el-form-item>
<el-form-item label="上架" :label-width="formLabelWidth">
<el-switch v-model="status"> </el-switch>
</el-form-item>
<el-form-item label="上架" :label-width="formLabelWidth">
<el-switch v-model="status"> </el-switch>
</el-form-item>
<el-form-item label="文创图片" :label-width="formLabelWidth">
<ManualUploader
:files="images"
:fileLimit="6"
:fileSize="50"
listType="picture-card"
:fileType="['png', 'jpeg', 'jpg','webp']"
ref="images"
/>
</el-form-item>
</el-form>
</div>
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
<el-form-item label="文创图片" :label-width="formLabelWidth">
<ManualUploader
:files="images"
:fileLimit="6"
:fileSize="50"
listType="picture-card"
:fileType="['png', 'jpeg', 'jpg', 'webp']"
ref="images"
/>
</el-form-item>
</el-form>
</div>
<div class="dialog-footer">
<el-button @click="cancelForm">取 消</el-button>
<el-button type="primary" @click="handleSubmit"
>确定<i class="el-icon-circle-check" style="margin-left: 5px"></i
></el-button>
</div>
</div>
</el-dialog>
</template>
......@@ -231,7 +232,7 @@ export default {
});
},
async handleSubmit() {
// this.submitLoading = true;
this.submitLoading = true;
let params = { ...this.dialogForm };
let deleteFileArr = [];
let oldImageIds = [];
......@@ -295,21 +296,23 @@ export default {
}
});
}
// console.log("deleteFileArr", deleteFileArr);
// return;
if (deleteFileArr.length > 0) {
await deleteFiles(deleteFileArr);
}
let res = await updateCcProduct(params);
if (res.code == 0) {
this.$message.success("修改成功！");
this.reload();
}
if (deleteFileArr.length > 0) {
await deleteFiles(deleteFileArr);
this.submitLoading = false;
}
} else {
let res = await addCcProduct(params);
if (res.code == 0) {
this.$message.success("添加成功！");
this.reload();
this.submitLoading = false;
}
}
},
......@@ -344,6 +347,12 @@ export default {
font-weight: bold;
}
}
.el-dialog-div {
height: 80vh;
overflow-x: hidden;
}
.dialog-content {
padding: 0 32px;
display: flex;
......@@ -354,13 +363,13 @@ export default {
.relate {
flex: 1;
}
}
.dialog-footer {
display: flex;
justify-content: flex-end;
}
.dialog-footer {
display: flex;
align-items: flex-end;
margin: 20px;
}
.upload-box {
background-color: #fbfdff;
border: 1px dashed #c0ccda;
......@@ -378,8 +387,4 @@ export default {
color: #8c939d;
}
}
.video-lists {
display: flex;
}
</style>
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论