官网管理上传修改
This commit is contained in:
parent
eaf8228a4a
commit
7abf25bd09
@ -144,7 +144,6 @@ const routes = [
|
||||
name: 'officialWebsiteBanner',
|
||||
component: () => import('../views/officialWebsite/banner.vue')
|
||||
},
|
||||
// 官网修改
|
||||
{
|
||||
path: '/officialWebsiteCase',
|
||||
name: 'officialWebsiteCase',
|
||||
@ -157,6 +156,10 @@ const routes = [
|
||||
path: '/officialWebsiteProduct',
|
||||
name: 'officialWebsiteProduct',
|
||||
component: () => import('../views/officialWebsite/product.vue')
|
||||
}, {
|
||||
path: '/officialWebsiteDetail',
|
||||
name: 'officialWebsiteDetail',
|
||||
component: () => import('../views/officialWebsite/detail.vue')
|
||||
},
|
||||
]
|
||||
},
|
||||
|
||||
@ -104,7 +104,7 @@ export default {
|
||||
// { name: '设备菜单', router: '', routerList: [], img: require('../assets/image/header-img5.png') },
|
||||
//systemManage systemManage
|
||||
// manage
|
||||
{ name: '管理', router: 'manage', routerList: ['manage','dataDevice','deviceStatusSet','officialWebsiteBanner','officialWebsiteProduct','officialWebsiteCase','officialWebsiteNews','deviceSet','deviceInfoManage','weatherData','mobileControl','userInfoControl','deviceManage','videoManage'], img: require('../assets/image/header-img6.png') },
|
||||
{ name: '管理', router: 'manage', routerList: ['manage','dataDevice','deviceStatusSet','officialWebsiteBanner','officialWebsiteProduct','officialWebsiteCase','officialWebsiteDetail','officialWebsiteNews','deviceSet','deviceInfoManage','weatherData','mobileControl','userInfoControl','deviceManage','videoManage'], img: require('../assets/image/header-img6.png') },
|
||||
|
||||
{ name: '大数据', router: 'largeScreen', routerList: ['largeScreen'], img: require('../assets/image/header-img8.png') }
|
||||
],
|
||||
@ -139,6 +139,7 @@ export default {
|
||||
'userInfoControl',
|
||||
'officialWebsiteCase',
|
||||
'officialWebsiteNews',
|
||||
'officialWebsiteDetail',
|
||||
'officialWebsiteProduct',
|
||||
'deviceManage',
|
||||
'videoManage',
|
||||
@ -411,6 +412,7 @@ export default {
|
||||
{deviceTypeName:'官网顶部轮播图管理',router:'officialWebsiteBanner',index:8},
|
||||
{deviceTypeName:'官网产品管理',router:'officialWebsiteProduct',index:11},
|
||||
{deviceTypeName:'官网案例管理',router:'officialWebsiteCase',index:9},
|
||||
{deviceTypeName:'官网公司简介',router:'officialWebsiteDetail',index:12},
|
||||
{deviceTypeName:'官网新闻管理',router:'officialWebsiteNews',index:10},
|
||||
// {deviceTypeName:'摄像头信息管理',router:'videoManage',index:8},
|
||||
] },
|
||||
|
||||
@ -199,13 +199,20 @@ export default {
|
||||
}
|
||||
},
|
||||
changeAddModel() {
|
||||
this.Addloading = this.$loading({
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功，请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.homepaeImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData,id:this.nowData.id.toString() };
|
||||
this.api.website_updateows(data).then((res) => {
|
||||
@ -221,6 +228,7 @@ export default {
|
||||
});
|
||||
} else {
|
||||
var data = { ...this.nowData};
|
||||
|
||||
this.api.website_addows(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
@ -268,6 +276,9 @@ export default {
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
|
||||
@ -209,15 +209,25 @@ detailedIntroductionTextEnTitle:'',
|
||||
}
|
||||
},
|
||||
changeAddModel() {
|
||||
this.Addloading = this.$loading({
|
||||
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功，请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData,id:this.nowData.id.toString() };
|
||||
|
||||
|
||||
this.api.website_updateops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
@ -278,6 +288,9 @@ detailedIntroductionTextEnTitle:'',
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
|
||||
299
src/views/officialWebsite/detail.vue
Normal file
299
src/views/officialWebsite/detail.vue
Normal file
@ -0,0 +1,299 @@
|
||||
<template>
|
||||
<div class="videoManage manage-page">
|
||||
<div class="flex-view flex-title">
|
||||
<div class="table-title">官网公司简介</div>
|
||||
<div class="table-title-btn blue" @click="openModel({}, 0)">
|
||||
<img src="../../assets/manageImg/add-btn.png" alt="" />添加
|
||||
</div>
|
||||
</div>
|
||||
<div class="table-view">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:row-class-name="tableRowClassName"
|
||||
height="620"
|
||||
style="width: 100%"
|
||||
>
|
||||
<el-table-column prop="detailedIntroductionSort" label="排序">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionName" label="公司名称">
|
||||
</el-table-column>
|
||||
<el-table-column prop="detailedIntroductionEnName" label="公司英文名称">
|
||||
</el-table-column>
|
||||
<el-table-column label="操作">
|
||||
<template slot-scope="scope">
|
||||
<div class="table-flex">
|
||||
<div class="table-operate blue" @click="openModel(scope.row, 1)">
|
||||
<img src="../../assets/manageImg/table-edit.png" alt="" />编辑
|
||||
</div>
|
||||
<el-popconfirm
|
||||
@confirm="confirmDel(scope.row)"
|
||||
title="这一段内容确定删除吗？"
|
||||
icon-color="red"
|
||||
>
|
||||
<div class="table-operate red" slot="reference">
|
||||
<img
|
||||
src="../../assets/manageImg/table-delete.png"
|
||||
alt=""
|
||||
/>删除
|
||||
</div>
|
||||
</el-popconfirm>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
title="提示"
|
||||
top="5vh"
|
||||
:visible.sync="addModel"
|
||||
width="700px"
|
||||
class="vrcode-model manage-model"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="vrcode-model-title">
|
||||
{{ modelName }}
|
||||
</div>
|
||||
<div class="vrcode-content " v-if="nowData">
|
||||
<div class="manage-left">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">公司名称</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionName"
|
||||
placeholder="请输入公司名称"
|
||||
/>
|
||||
</div>
|
||||
<div class="manage-input">
|
||||
<div class="input-title">公司英文名称</div>
|
||||
<input
|
||||
type="text"
|
||||
v-model="nowData.detailedIntroductionEnName"
|
||||
placeholder="请输入公司英文名称"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="manage-input">
|
||||
<div class="input-title">排序</div>
|
||||
<input
|
||||
type="number"
|
||||
v-model="nowData.detailedIntroductionSort"
|
||||
placeholder="请输入排序"
|
||||
/>
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">公司中文简介(以回车键换行)</div>
|
||||
<textarea v-model="nowData.detailedIntroductionText" name="" id="" cols="30" rows="10"></textarea>
|
||||
</div>
|
||||
<div class="manage-textarea">
|
||||
<div class="input-title">公司英文简介(以回车键换行)</div>
|
||||
<textarea v-model="nowData.detailedIntroductionEnText" name="" id="" cols="30" rows="10"></textarea>
|
||||
</div>
|
||||
</div></div>
|
||||
<div class="manage-right">
|
||||
<div class="manage-input">
|
||||
<div class="input-title">公司图片(图片大小不能超过2MB)</div>
|
||||
</div>
|
||||
<div class="manage-img" v-loading="loading">
|
||||
<label for="sel-img">
|
||||
<img
|
||||
v-show="nowData.detailedIntroductionImage"
|
||||
class=""
|
||||
:src="nowData.detailedIntroductionImage"
|
||||
alt="案例图片"
|
||||
/>
|
||||
<img
|
||||
class="upload-img"
|
||||
v-show="!nowData.detailedIntroductionImage"
|
||||
src="../../assets/img/upload-img.png"
|
||||
alt=""
|
||||
/>
|
||||
</label>
|
||||
<input
|
||||
ref="fileInput"
|
||||
type="file"
|
||||
:multiple="false"
|
||||
id="sel-img"
|
||||
accept="image/*"
|
||||
@change="handleImageChange($event, 0)"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span slot="footer" class="dialog-footer">
|
||||
<div class="vrcode-btn blue-btn w-100" @click="changeAddModel">
|
||||
确定
|
||||
</div>
|
||||
<div class="vrcode-btn cancle-btn w-100" @click="addModel = false">
|
||||
取消
|
||||
</div>
|
||||
</span>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tableData: [],
|
||||
addModel: false,
|
||||
nowData: {
|
||||
detailedIntroductionImage: "",
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: "",
|
||||
detailedIntroductionText: "",
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort: "",
|
||||
detailedIntroductionTextTitle:'',
|
||||
detailedIntroductionTextEnTitle:'',
|
||||
type:4,
|
||||
},
|
||||
modelName: "添加",
|
||||
typeSelList: [],
|
||||
TypeSel: "",
|
||||
selId: "",
|
||||
loading: false,
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.dataInit();
|
||||
},
|
||||
methods: {
|
||||
dataInit() {
|
||||
this.api.website_getowpabyowpidMan().then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.tableData = res.data.data.filter(item => item && item.type === 4);
|
||||
}
|
||||
});
|
||||
},
|
||||
openModel(item, type) {
|
||||
if (type == 0) {
|
||||
this.modelName = "添加";
|
||||
this.addModel = true;
|
||||
this.nowData = {
|
||||
detailedIntroductionImage: "",
|
||||
detailedIntroductionEnName: "",
|
||||
detailedIntroductionEnText: "",
|
||||
detailedIntroductionText: "",
|
||||
detailedIntroductionName: "",
|
||||
detailedIntroductionSort: "",
|
||||
detailedIntroductionTextTitle:'',
|
||||
detailedIntroductionTextEnTitle:'',
|
||||
type:4,
|
||||
};
|
||||
} else {
|
||||
this.modelName = "编辑";
|
||||
this.nowData = JSON.parse(JSON.stringify(item));
|
||||
this.addModel = true;
|
||||
}
|
||||
},
|
||||
changeAddModel() {
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功，请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData,id:this.nowData.id.toString() };
|
||||
this.api.website_updateops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
var data = { ...this.nowData };
|
||||
this.api.website_addops(data).then((res) => {
|
||||
this.Addloading.close();
|
||||
if (res.data.code == 200) {
|
||||
this.$message.success(res.data.msg);
|
||||
this.dataInit();
|
||||
this.addModel = false;
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
this.addModel = false;
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
handleImageChange(event, type) {
|
||||
this.loading = true;
|
||||
if (event.target.files.length === 0) {
|
||||
// 用户点击了取消
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
const file = event.target.files[0];
|
||||
|
||||
const reader = new FileReader();
|
||||
const maxSize = 2 * 1024 * 1024; // 2MB in bytes
|
||||
if (file.size > maxSize) {
|
||||
this.$message.error("图片大小不能超过2MB");
|
||||
this.$refs.fileInput.value = "";
|
||||
this.loading = false;
|
||||
return;
|
||||
}
|
||||
|
||||
reader.onload = (e) => {
|
||||
const imageData = e.target.result;
|
||||
const convertedFile = new File([imageData], file.name, {
|
||||
type: file.type,
|
||||
});
|
||||
// 处理转换后的文件...
|
||||
|
||||
var data = { file: convertedFile };
|
||||
this.api.websiteUploadImage(data).then((res) => {
|
||||
this.loading = false;
|
||||
if (res.data.code == 200) {
|
||||
this.nowData.detailedIntroductionImage = res.data.msg;
|
||||
this.$refs.fileInput.value = "";
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
},
|
||||
|
||||
confirmDel(item) {
|
||||
var data = { id: item.id.toString() };
|
||||
this.api.website_delops(data).then((res) => {
|
||||
if (res.data.code == 200) {
|
||||
this.dataInit();
|
||||
this.$message.success(res.data.msg);
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
});
|
||||
},
|
||||
tableRowClassName({ row, rowIndex }) {
|
||||
if (rowIndex % 2 == 1) {
|
||||
return "warning-row";
|
||||
} else if (rowIndex % 2 == 0) {
|
||||
return "success-row";
|
||||
}
|
||||
return "";
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss"></style>
|
||||
@ -378,13 +378,20 @@ export default {
|
||||
},
|
||||
|
||||
changeAddModel() {
|
||||
this.Addloading = this.$loading({
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功，请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData, id: this.nowData.id.toString() };
|
||||
this.api.website_updateops(data).then((res) => {
|
||||
@ -447,6 +454,9 @@ export default {
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
|
||||
@ -428,13 +428,20 @@ productId: "",
|
||||
},
|
||||
// 产品详情
|
||||
changeAddModel() {
|
||||
this.Addloading = this.$loading({
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功，请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
|
||||
if (this.modelName == "编辑") {
|
||||
var data = { ...this.nowData, id: this.nowData.id.toString() };
|
||||
this.api.website_updateops(data).then((res) => {
|
||||
@ -465,13 +472,20 @@ productId: "",
|
||||
},
|
||||
// 产品列表
|
||||
changeAddModel1() {
|
||||
this.Addloading = this.$loading({
|
||||
if(this.loading){
|
||||
this.$message.error("图片还未上传成功，请耐心等待。");
|
||||
return
|
||||
}
|
||||
if(!this.nowData1.detailedIntroductionImage){
|
||||
this.$message.error("图片还未上传。");
|
||||
return
|
||||
}
|
||||
this.Addloading = this.$loading({
|
||||
lock: true,
|
||||
text: "加载中",
|
||||
spinner: "el-icon-loading",
|
||||
background: "rgba(0, 0, 0, 0.7)",
|
||||
});
|
||||
|
||||
if (this.modelName1 == "编辑") {
|
||||
var data = { ...this.nowData1, id: this.nowData1.id.toString() };
|
||||
this.api.website_updateowp(data).then((res) => {
|
||||
@ -515,6 +529,7 @@ productId: "",
|
||||
if (file.size > maxSize) {
|
||||
this.$message.error("图片大小不能超过2MB");
|
||||
this.$refs.fileInput.value = "";
|
||||
this.loading = false
|
||||
return;
|
||||
}
|
||||
|
||||
@ -534,6 +549,9 @@ productId: "",
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
@ -573,6 +591,9 @@ productId: "",
|
||||
} else {
|
||||
this.$message.error(res.data.msg);
|
||||
}
|
||||
}).catch((err) => {
|
||||
this.loading = false;
|
||||
this.$message.error("插入图片失败");
|
||||
});
|
||||
};
|
||||
reader.readAsArrayBuffer(file);
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user