Commit e8d06349 authored by xulili's avatar xulili

Merge branch 'master' of http://111.203.232.171:8888/qzhxx/national_museum_vod into dev_xll

parents 246ba8e1 76f2cdad
...@@ -17,28 +17,47 @@ ...@@ -17,28 +17,47 @@
:rules="rules" :rules="rules"
> >
<el-form-item label="版本号:" prop="appVersion"> <el-form-item label="版本号:" prop="appVersion">
<el-input size="small" v-model="formItem.appVersion" clearable placeholder="请输入版本号"></el-input> <el-input
size="small"
v-model="formItem.appVersion"
clearable
placeholder="请输入版本号"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="版本信息:" prop="versionInfo"> <el-form-item label="版本信息:" prop="versionInfo">
<el-input type="textarea" size="small" v-model="formItem.versionInfo"></el-input> <el-input
type="textarea"
size="small"
v-model="formItem.versionInfo"
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="更新内容:" prop="updateContent"> <el-form-item label="更新内容:" prop="updateContent">
<el-input type="textarea" size="small" v-model="formItem.updateContent"></el-input> <el-input
type="textarea"
size="small"
v-model="formItem.updateContent"
></el-input>
</el-form-item> </el-form-item>
<el-upload <el-upload
class="text-center" class="text-center"
drag drag
action="http://192.168.110.67/mall/file/upload/allType" :action="uploadUrl"
:on-success="handleAvatarSuccess" :on-success="handleAvatarSuccess"
:file-list="fileList"> :before-upload="handleBeforeUpload"
:file-list="fileList"
>
<i class="el-icon-upload"></i> <i class="el-icon-upload"></i>
<div class="el-upload__text">将安装包拖到此处,或<em>点击上传安装包</em></div> <div class="el-upload__text">
<div class="el-upload__tip" slot="tip">只能上传apk文件,且不超过500kb</div> 将安装包拖到此处,或<em>点击上传安装包</em>
</div>
<div class="el-upload__tip" slot="tip">只能上传apk文件</div>
</el-upload> </el-upload>
</el-form> </el-form>
</div> </div>
<div slot="footer" class="dialog-footer btn-group"> <div slot="footer" class="dialog-footer btn-group">
<el-button size="mini" type="primary" @click="submitForm('formItem')">确定</el-button> <el-button size="mini" type="primary" @click="submitForm('formItem')"
>确定</el-button
>
<el-button size="mini" @click="close">取 消</el-button> <el-button size="mini" @click="close">取 消</el-button>
</div> </div>
</el-dialog> </el-dialog>
...@@ -48,111 +67,103 @@ ...@@ -48,111 +67,103 @@
export default { export default {
data() { data() {
return { return {
uploadUrl:'http://192.168.110.67/mall/file/upload/allType',
formVisible: false, formVisible: false,
formItem: {}, formItem: {},
fileList:[], fileList: [],
rules: { rules: {
appVersion: [ appVersion: [
{ required: true, message: "请输入版本号", trigger: "blur" } { required: true, message: "请输入版本号", trigger: "blur" },
], ],
versionInfo: [{ required: true, message: "请输入版本信息", trigger: "blur" }], versionInfo: [
updateContent: [{ required: true, message: "请输入更新内容", trigger: "blur" }] { required: true, message: "请输入版本信息", trigger: "blur" },
} ],
updateContent: [
{ required: true, message: "请输入更新内容", trigger: "blur" },
],
},
}; };
}, },
methods: { methods: {
backFn(item) { backFn() {
this.formVisible = true; this.formVisible = true
this.$nextTick(()=>{ this.$nextTick(() => {
this.$refs.formItem.clearValidate(); this.$refs.formItem.clearValidate()
}) });
this.formItem = {}; this.formItem = {}
}, },
// 关闭 // 关闭
close() { close() {
this.formVisible = false; this.formVisible = false;
for (let key in this.formItem) { for (let key in this.formItem) {
this.formItem[key] = null; this.formItem[key] = null
}
this.$refs["formItem"].resetFields()
},
// 格式控制
handleBeforeUpload(file) {
if (file.type !== "application/vnd.android.package-archive") {
this.$message.error("只能上传apk文件")
return false
} }
this.$refs["formItem"].resetFields(); return true
}, },
// 上传数据操作 // 上传数据操作
handleAvatarSuccess(res, file) { handleAvatarSuccess(res, file) {
this.formItem.apkUrl = res.url if(res.resultCode==='200'){
this.formItem.apkUrl = res.data.url
}else{
this.$message.error(res.message)
}
}, },
// 保存编辑信息 // 保存编辑信息
submitForm() { submitForm() {
let _this = this; let _this = this
console.log(this.formItem) _this.$refs.formItem.validate((valid) => {
_this.$refs.formItem.validate(valid => {
if (valid) { if (valid) {
if (!this.formItem.apkUrl) { if (!this.formItem.apkUrl) {
this.$message.info('请先选取文件!') this.$message.info("请先选取文件!")
return false return false
} }
let param = { let param = {
appVersion: this.formItem.appVersion, appVersion: this.formItem.appVersion,
versionInfo: this.formItem.versionInfo, versionInfo: this.formItem.versionInfo,
updateContent: this.formItem.updateContent , updateContent: this.formItem.updateContent,
apkUrl: this.formItem.apkUrl , apkUrl: this.formItem.apkUrl,
}; }
// const fileType = this.fileList.every(item => { _this
// console.log(item.raw.type) .$https(
// return item.raw.type === 'application/zip'
// })
// if (!fileType) {
// this.$message.error('支持扩展名:.zip格式!')
// return false
// }
// const param = new FormData()
// this.fileList.forEach(file => {
// param.append('file', file.raw) // 此处一定是append file.raw 上传文件只需维护fileList file.raw.name要加上
// param.append('fileName', file.name)
// param.append('appVersion', this.formItem.appVersion)
// param.append('versionInfo', this.formItem.versionInfo)
// param.append('updateContent', this.formItem.updateContent)
// })
// _this.$emit("refreshFn");
// _this.formVisible = false;
_this.$https(
{ {
url: "tAppVersion/save", url: "tAppVersion/save",
method: "post", method: "post",
authType: this.backToken authType: this.backToken,
}, },
_this.$qs.stringify(param) _this.$qs.stringify(param)
).then(res => { )
if (res.data.resultCode === '200') { .then(
_this.$message({ (res) => {
type: "success", if (res.data.resultCode === "200") {
message: res.data.message _this.$message.success(res.data.message)
}); _this.formVisible = false
_this.formVisible = false; _this.$emit("refreshFn")
_this.$emit("refreshFn");
} else { } else {
_this.$message({ _this.$message.error(res.data.message)
type: "error",
message: res.data.message
});
} }
}, },
error => { (error) => {
_this.$message({ console.log(error)
type: "error",
message: error
});
} }
); )
} }
}); })
}, },
} },
}; };
</script> </script>
<style lang="less"> <style lang="less">
@import "../../../../style/dialog.less"; @import "~@/style/dialog.less";
.text-center { .text-center {
text-align: center; text-align: center;
} }
......
...@@ -15,19 +15,41 @@ ...@@ -15,19 +15,41 @@
label-position="right" label-position="right"
> >
<el-form-item label="上传时间:" prop="createTime"> <el-form-item label="上传时间:" prop="createTime">
<el-input size="small" v-model="formItem.createTime" disabled></el-input> <el-input
size="small"
v-model="formItem.createTime"
disabled
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="操作者:" prop="userName"> <el-form-item label="操作者:" prop="userName">
<el-input size="small" v-model="formItem.userName" disabled></el-input> <el-input
size="small"
v-model="formItem.userName"
disabled
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="是否为当前使用版本:"> <el-form-item label="是否为当前使用版本:">
<el-input size="small" :value="formItem.isCurrent?'是':'否'" disabled></el-input> <el-input
size="small"
:value="formItem.isCurrent ? '是' : '否'"
disabled
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="版本信息:" prop="versionInfo"> <el-form-item label="版本信息:" prop="versionInfo">
<el-input type="textarea" size="small" v-model="formItem.versionInfo" disabled></el-input> <el-input
type="textarea"
size="small"
v-model="formItem.versionInfo"
disabled
></el-input>
</el-form-item> </el-form-item>
<el-form-item label="更新内容:" prop="updateLog"> <el-form-item label="更新内容:" prop="updateLog">
<el-input type="textarea" size="small" v-model="formItem.updateLog" disabled></el-input> <el-input
type="textarea"
size="small"
v-model="formItem.updateLog"
disabled
></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -47,18 +69,17 @@ export default { ...@@ -47,18 +69,17 @@ export default {
}, },
methods: { methods: {
backFn(item) { backFn(item) {
this.formVisible = true; this.formVisible = true
this.formItem = item; this.formItem = item
}, },
// 关闭 // 关闭
close() { close() {
this.formVisible = false; this.formVisible = false
}, },
} },
}; };
</script> </script>
<style lang="less"> <style lang="less">
@import "../../../../style/dialog.less"; @import "~@/style/dialog.less";
</style> </style>
\ No newline at end of file
...@@ -21,7 +21,9 @@ ...@@ -21,7 +21,9 @@
</el-form> </el-form>
<div class="page-tip"> <div class="page-tip">
<span class="page-tip-title">页面说明:</span> <span class="page-tip-title">页面说明:</span>
<span class="page-tips">可查看系统使用过的所有app版本信息,可设置其中一个版本为当前使用版本。可产看安装包详情信息。可上传新的安装包,“*”为必填项。</span> <span class="page-tips"
>可查看系统使用过的所有app版本信息,可设置其中一个版本为当前使用版本。可产看安装包详情信息。可上传新的安装包,“*”为必填项。</span
>
</div> </div>
</div> </div>
<div class="table-content"> <div class="table-content">
...@@ -29,12 +31,24 @@ ...@@ -29,12 +31,24 @@
<el-button type="primary" @click="addBox">上传安装包</el-button> <el-button type="primary" @click="addBox">上传安装包</el-button>
</div> </div>
<div class="party-table"> <div class="party-table">
<el-table border style="width: 100%;height:100%" height="100%" :data="tableData"> <el-table
<el-table-column type="index" width="120" label="序号"></el-table-column> border
<el-table-column label="app版本号" prop="appVersion"></el-table-column> style="width: 100%; height: 100%"
height="100%"
:data="tableData"
>
<el-table-column
type="index"
width="120"
label="序号"
></el-table-column>
<el-table-column
label="app版本号"
prop="appVersion"
></el-table-column>
<el-table-column label="是否为最新版本"> <el-table-column label="是否为最新版本">
<template slot-scope="scope"> <template slot-scope="scope">
<span>{{scope.row.isCurrent?'是':'否'}}</span> <span>{{ scope.row.isCurrent ? "是" : "否" }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="上传时间" prop="createTime"></el-table-column> <el-table-column label="上传时间" prop="createTime"></el-table-column>
...@@ -43,16 +57,16 @@ ...@@ -43,16 +57,16 @@
<template slot-scope="scope" width="220"> <template slot-scope="scope" width="220">
<div class="table-btn-group"> <div class="table-btn-group">
<el-tooltip content="详情" placement="top"> <el-tooltip content="详情" placement="top">
<el-button circle @click="handleDetail(scope.row)"> <el-button circle @click="handleDetail(scope.row)">
<i class="icon-table icon-detail"></i> <i class="icon-table icon-detail"></i>
</el-button> </el-button>
</el-tooltip> </el-tooltip>
<el-tooltip content="启用" placement="top"> <el-tooltip content="启用" placement="top">
<el-button circle @click="ableBtn(scope.row)"> <el-button circle @click="ableBtn(scope.row)">
<i class="icon-table icon-enable"></i> <i class="icon-table icon-enable"></i>
</el-button> </el-button>
</el-tooltip> </el-tooltip>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
...@@ -68,70 +82,74 @@ ...@@ -68,70 +82,74 @@
></el-pagination> ></el-pagination>
</div> </div>
</div> </div>
<add-dialog ref="addDialog" @refreshFn="onSearch"/> <add-dialog ref="addDialog" @refreshFn="onSearch" />
<detail-dialog ref="detailDialog"/> <detail-dialog ref="detailDialog" />
</div> </div>
</template> </template>
<script> <script>
import { partyPagination, partyTable } from "@/components/index"; import { partyPagination, partyTable } from "@/components/index";
import { addDialog , detailDialog } from "./components/index"; import { addDialog, detailDialog } from "./components/index";
export default { export default {
data() { data() {
return { return {
page: { currentPage: 1, pageSize: 10, total: 0 }, page: {
currentPage: 1,
pageSize: 10,
total: 0
},
form: { form: {
dateRange: [] dateRange: [],
}, },
tableData: [] tableData: [],
}; };
}, },
components: { partyPagination ,addDialog ,detailDialog}, components: { partyPagination, addDialog, detailDialog },
mounted() { mounted() {
this.onSearch() this.onSearch();
}, },
methods: { methods: {
// 查询 // 查询
onSearch() { onSearch() {
this.page.currentPage = 1 this.page.currentPage = 1;
this.getTableData(); this.getTableData();
}, },
// 获得数据接口 // 获得数据接口
getTableData() { getTableData() {
let vm = this; let vm = this
let param = { let param = {
_index: this.page.currentPage, _index: this.page.currentPage,
_size: this.page.pageSize, _size: this.page.pageSize,
startTime: this.form.dateRange.length?this.form.dateRange[0]:'' , startDate: this.form.dateRange.length ? this.form.dateRange[0] : "",
endTime: this.form.dateRange.length?this.form.dateRange[1]:'' , endDate: this.form.dateRange.length ? this.form.dateRange[1] : "",
}; };
vm.$https( vm.$https(
{ {
url: "tAppVersion/getPageList", url: "tAppVersion/getPageList",
method: "post", method: "post",
authType: this.backToken authType: this.backToken,
}, },
vm.$qs.stringify(param) vm.$qs.stringify(param)
) )
.then(res => { .then((res) => {
if(res.data.resultCode==='200'){ if (res.data.resultCode === "200") {
let data = res.data.data let data = res.data.data
vm.page.total = data.total vm.page.total = data.total
vm.tableData = data.records vm.tableData = data.records
}else{ } else {
this.$message({type:'error',message:res.data.message}) this.$message.error(res.data.message)
} }
}) })
.catch(function(err) { .catch(function (err) {
console.log(err); console.log(err)
}); });
}, },
// 新增弹框打开 // 新增弹框打开
addBox() { addBox() {
this.$refs.addDialog.backFn() this.$refs.addDialog.backFn();
}, },
// 详情弹框打开 // 详情弹框打开
handleDetail(item) { handleDetail(item) {
this.$refs.detailDialog.backFn(item) this.$refs.detailDialog.backFn(item);
}, },
// 启用 // 启用
ableBtn(row) { ableBtn(row) {
...@@ -140,55 +158,58 @@ export default { ...@@ -140,55 +158,58 @@ export default {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
type: "warning", type: "warning",
center: true center: true,
}) })
.then(() => { .then(() => {
// 请求接口 tAppVersion/update this.updateVersion(row);
this.updateVersion(row)
}) })
.catch(() => { .catch(() => {
this.$message("已取消") this.$message("已取消");
}); });
}, },
updateVersion(row){ // 启用
let vm = this; updateVersion(row) {
let vm = this
let param = { let param = {
id: row.id, id: row.id,
isCurrent:1 isCurrent: 1,
}; };
vm.$https( vm.$https(
{ {
url: "tAppVersion/update", url: "tAppVersion/update",
method: "put", method: "put",
authType: this.backToken authType: this.backToken,
}, },
vm.$qs.stringify(param) vm.$qs.stringify(param)
) )
.then(res => { .then((res) => {
if(res.data.resultCode==='200'){ if (res.data.resultCode === "200") {
this.$message.success("操作成功") this.$message.success("操作成功")
this.onSearch() this.onSearch()
}else{ } else {
this.$message({type:'error',message:res.data.message}) this.$message.error(res.data.message)
} }
}) })
.catch(function(err) { .catch(function (err) {
console.log(err); console.log(err)
}); });
}, },
// 重置
handleReset() { handleReset() {
this.form = {}; this.form = {
dateRange: [],
};
this.onSearch()
}, },
// 分页 // 分页
handleCurrentChange(val) { handleCurrentChange(val) {
this.page.currentPage = val this.page.currentPage = val
this.getTableData() this.getTableData()
} },
} },
}; };
</script> </script>
<style lang="less"> <style lang="less">
@import "../../../style/dialog.less"; @import "~@/style/table.less";
@import "../../../style/table.less"; @import "~@/style/pagination.less";
@import "../../../style/pagination.less";
</style> </style>
\ No newline at end of file
...@@ -32,7 +32,11 @@ ...@@ -32,7 +32,11 @@
</el-select> </el-select>
</el-form-item> </el-form-item>
<el-form-item label="机构地理位置:" prop="areaName"> <el-form-item label="机构地理位置:" prop="areaName">
<el-input size="small" v-model="formItem.areaName" disabled></el-input> <el-input
size="small"
v-model="formItem.areaName"
disabled
></el-input>
</el-form-item> </el-form-item>
</el-form> </el-form>
</div> </div>
...@@ -44,32 +48,31 @@ ...@@ -44,32 +48,31 @@
</template> </template>
<script> <script>
export default { export default {
data() { data() {
return { return {
title:'', title: "", // 标题
formVisible: false, formVisible: false,
formItem: {}, formItem: {},
orgOptions: [], orgOptions: [], // 单位信息
rules: { rules: {
orgId: [{ required: true, message: "请选择所属单位", trigger: "change" }] orgId: [
} { required: true, message: "请选择所属单位", trigger: "change" },
],
},
}; };
}, },
mounted(){ mounted() {},
},
methods: { methods: {
backFn(item) { backFn(item) {
this.formVisible = true; this.formVisible = true;
this.$nextTick(()=>{ this.$nextTick(() => {
this.$refs.formItem.clearValidate(); this.$refs.formItem.clearValidate();
}) });
// 新增 // 新增
this.orgOptions = item this.orgOptions = item;
this.title="新增" this.title = "新增";
this.formItem = {}; this.formItem = {};
}, },
// 关闭 // 关闭
close() { close() {
...@@ -81,65 +84,58 @@ export default { ...@@ -81,65 +84,58 @@ export default {
}, },
// 联动出地址 // 联动出地址
selectItem(val) { selectItem(val) {
this.orgOptions.forEach(item=>{ this.orgOptions.forEach((item) => {
if(val===item.id){ if (val === item.id) {
this.formItem.areaName = item.areaName; this.formItem.areaName = item.areaName;
this.formItem.areaId = item.areaId; this.formItem.areaId = item.areaId;
} }
if(item.id===this.formItem.orgId){ if (item.id === this.formItem.orgId) {
this.formItem.userName = item.name this.formItem.userName = item.name;
} }
}) });
}, },
// 保存编辑信息 // 保存编辑信息
submitForm() { submitForm() {
let _this = this; let _this = this;
console.log(this.formItem) _this.$refs.formItem.validate((valid) => {
_this.$refs.formItem.validate(valid => {
if (valid) { if (valid) {
let searchObj = {}; let searchObj = {};
for (let key in _this.formItem) { for (let key in _this.formItem) {
if (this.formItem[key]) { if (this.formItem[key]) {
searchObj[key] = _this.formItem[key]; searchObj[key] = _this.formItem[key]
} }
} }
_this.$https({ _this
.$https(
{
url: "tUser/boxAdd", url: "tUser/boxAdd",
method: "post", method: "post",
authType: this.backToken authType: this.backToken,
}, },
_this.$qs.stringify(searchObj) _this.$qs.stringify(searchObj)
).then(res => { )
if (res.data.resultCode == '200') { .then(
_this.$message({ (res) => {
type: "success", if (res.data.resultCode === "200") {
message: res.data.message _this.$message.success(res.data.message)
}); _this.formVisible = false
_this.formVisible = false; _this.$emit("refreshFn")
_this.$emit("refreshFn");
} else { } else {
_this.$message({ _this.$message.error(res.data.message)
type: "error",
message: res.data.message
});
} }
}, },
error => { (error) => {
_this.$message({ console.log(error)
type: "error",
message: error
});
} }
); )
} }
}); })
} },
} },
}; };
</script> </script>
<style lang="less"> <style lang="less">
@import "../../../../style/dialog.less"; @import "~@/style/dialog.less";
</style> </style>
\ No newline at end of file
...@@ -29,7 +29,9 @@ ...@@ -29,7 +29,9 @@
</el-form> </el-form>
<div class="page-tip"> <div class="page-tip">
<span class="page-tip-title">页面说明:</span> <span class="page-tip-title">页面说明:</span>
<span class="page-tips">可按照账号状态及所属单位进行信息筛选。可新增机顶盒账号,“*”为必填项。请先创建单位管理员账号,否则机顶盒无法激活</span> <span class="page-tips"
>可按照账号状态及所属单位进行信息筛选。可新增机顶盒账号,“*”为必填项。请先创建单位管理员账号,否则机顶盒无法激活</span
>
</div> </div>
</div> </div>
<div class="table-content"> <div class="table-content">
...@@ -37,13 +39,22 @@ ...@@ -37,13 +39,22 @@
<el-button type="primary" @click="addBox">新建机顶盒账号</el-button> <el-button type="primary" @click="addBox">新建机顶盒账号</el-button>
</div> </div>
<div class="party-table"> <div class="party-table">
<el-table border style="width: 100%;height:100%" height="100%" :data="tableData"> <el-table
<el-table-column type="index" width="120" label="序号"></el-table-column> border
style="width: 100%; height: 100%"
height="100%"
:data="tableData"
>
<el-table-column
type="index"
width="120"
label="序号"
></el-table-column>
<el-table-column label="MAC地址" prop="mac"></el-table-column> <el-table-column label="MAC地址" prop="mac"></el-table-column>
<el-table-column label="所属单位" prop="organName"></el-table-column> <el-table-column label="所属单位" prop="organName"></el-table-column>
</el-table> </el-table>
</div> </div>
<div class="partyt-pagination" style="margin:0 20px;"> <div class="partyt-pagination" style="margin: 0 20px">
<el-pagination <el-pagination
background background
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
...@@ -66,19 +77,23 @@ export default { ...@@ -66,19 +77,23 @@ export default {
components: { partyPagination, customDialog }, components: { partyPagination, customDialog },
data() { data() {
return { return {
page: { currentPage: 1, pageSize: 10, total: 0 }, page: {
areaOptions: [], currentPage: 1,
pageSize: 10,
total: 0
},
orgOptions: [], // 单位信息
areaOptions: [], //区域信息
defaultProps: { defaultProps: {
label: "name", label: "name",
value: "id", value: "id",
checkStrictly: true checkStrictly: true,
}, },
orgOptions: [],
form: { form: {
orgId: "", orgId: "",
areaId: [] areaId: [],
}, },
tableData: [] tableData: [], // 表格信息
}; };
}, },
...@@ -88,21 +103,18 @@ export default { ...@@ -88,21 +103,18 @@ export default {
this.getOrgList(); this.getOrgList();
}, },
methods: { methods: {
getOrgList(){ // 获取单位信息
getOrgListWithOutPage().then(res => { async getOrgList() {
console.log(res) this.orgOptions = await getOrgListWithOutPage()
this.orgOptions = res;
});
}, },
getAreas() { // 获取区域信息
getAreas().then(res => { async getAreas() {
this.areaOptions = res; this.areaOptions = await getAreas()
});
}, },
// 查询 // 查询
onSearch() { onSearch() {
this.page.currentPage = 1; this.page.currentPage = 1
this.getTableData(); this.getTableData()
}, },
// 获得数据接口 // 获得数据接口
getTableData() { getTableData() {
...@@ -110,49 +122,51 @@ export default { ...@@ -110,49 +122,51 @@ export default {
let param = { let param = {
_index: this.page.currentPage, _index: this.page.currentPage,
_size: this.page.pageSize, _size: this.page.pageSize,
areaId: this.form.areaId[this.form.areaId.length-1], areaId: this.form.areaId.length ? this.form.areaId[this.form.areaId.length - 1] : '',
organId: this.form.orgId, organId: this.form.orgId
}; };
vm.$https( vm.$https(
{ {
url: "boxOperation/selectPageList", url: "boxOperation/selectPageList",
method: "post", method: "post",
authType: this.backToken authType: this.backToken,
}, },
vm.$qs.stringify(param) vm.$qs.stringify(param)
) )
.then(res => { .then((res) => {
console.log(res.data.data); if (res.data.resultCode === "200") {
let data = res.data.data; let data = res.data.data
vm.page.total = data.total; vm.page.total = data.total
vm.tableData = data.records; vm.tableData = data.records
} else {
this.$message.error(res.data.message)
}
}) })
.catch(function(err) { .catch(function (err) {
console.log(err); console.log(err)
}); });
}, },
// 新增弹框打开 // 新增弹框打开
addBox() { addBox() {
console.log(this.$refs.formItem);
this.$refs.formItem.backFn(this.orgOptions); this.$refs.formItem.backFn(this.orgOptions);
}, },
// 重置
handleReset() { handleReset() {
this.form = { this.form = {
orgId: "", orgId: "",
areaId: [] areaId: [],
}; };
this.onSearch() this.onSearch();
}, },
// 分页 // 分页
handleCurrentChange(val) { handleCurrentChange(val) {
this.page.currentPage = val; this.page.currentPage = val;
this.getTableData(); this.getTableData();
} },
} },
}; };
</script> </script>
<style lang="less"> <style lang="less">
@import "../../../style/dialog.less"; @import "~@/style/table.less";
@import "../../../style/table.less"; @import "~@/style/pagination.less";
@import "../../../style/pagination.less";
</style> </style>
\ No newline at end of file
<template>
<div class="interactive-wrapper height100">
<el-card class="height100 tree-box">
<div class="tree-title">组织机构</div>
<div class="tree-body">
<el-input
suffix-icon="el-icon-search"
placeholder="请输入组织结构名称"
v-model="filterText"
></el-input>
<div class="tree-content">
<el-tree
class="org-tree"
:data="treeData"
:props="defaultProps"
accordion
:filter-node-method="filterNode"
@node-click="handleNodeClick"
ref="tree"
>
<div
class="custom-tree-node"
slot-scope="{ node, data }"
:class="'tree-node-level' + data.level"
>
<i class="icon-org" v-if="data.level === 1"></i>
<span>{{ node.label }}</span>
</div>
</el-tree>
</div>
</div>
</el-card>
<el-card class="height100 detail-box" ref="rightBox">
<div class="content-title">
<div class="title">“北京市政府”展板互动信息汇总</div>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips"
>可按照账号状态及所属单位进行信息筛选。可新增机顶盒账号,“*”为必填项。请先创建单位管理员账号,否则机顶盒无法激活</span
>
</div>
</div>
<div class="scrollBox">
<div
class="content-item"
v-for="(item, index) in tableData"
:key="index"
>
<h5 class="title">{{ item.name }}</h5>
<p>{{ item.content }}</p>
<div class="img-box">
<img v-for="(j, idx) in item.images" :src="j" :key="idx" alt="" />
</div>
<div class="author">
<div>{{ item.username }}</div>
<div>{{ item.createTime }}</div>
</div>
</div>
</div>
<div class="partyt-pagination" style="margin: 0 20px">
<el-pagination
background
@current-change="handleCurrentChange"
:current-page="page.currentPage"
:page-size="page.pageSize"
layout="prev, pager, next, jumper"
:total="page.total"
></el-pagination>
</div>
</el-card>
</div>
</template>
<script>
export default {
data() {
return {
filterText: "",
page: {
currentPage: 1,
pageSize: 10,
total: 0
},
treeData: [],
defaultProps: {
children: "children",
label: "name",
},
selectAreaId: "",
tableData: [],
};
},
watch: {
filterText(val) {
this.$refs.tree.filter(val);
},
},
mounted() {
// 获取全部组织机构数据
this.getOrgData()
this.onSearch()
},
methods: {
// 查询
onSearch() {
this.page.currentPage = 1
this.getTableData()
},
// 获得数据接口
getTableData() {
let vm = this
vm.tableData = []
let param = {
_index: this.page.currentPage,
_size: this.page.pageSize,
orgId: this.selectAreaId,
};
vm.$https(
{
url: "interaction/getList",
method: "post",
authType: this.backToken,
},
vm.$qs.stringify(param)
)
.then((res) => {
if (res.data.resultCode === "200") {
let data = res.data.data
vm.page.total = data.total
vm.tableData = data.records
vm.tableData.forEach((item) => {
item.images = item.images.split(",")
item.images.forEach((result, index) => {
if (/\.(MP4|mp4)/.test(result)) {
item.images[index] = require("@/assets/video-icon.png")
} else if (/\.(MP3|mp3)/.test(result)) {
item.images[index] = require("@/assets/audio-icon.png")
} else {
item.images[index] = require("@/assets/default-img.jpeg")
}
})
})
vm.tableData = [...vm.tableData]
} else {
this.$message.error(res.data.message)
}
})
.catch(function (err) {
console.log(err)
});
},
// 获取组织机构数据
getOrgData() {
this.$https({
method: "get",
url: "organ/getTree",
authType: this.backToken,
}).then(
(res) => {
if (res.data.resultCode === "200") {
this.treeData = res.data.data
} else {
this.$message.error(res.data.message)
}
},
(error) => {
console.log(error)
}
);
},
// 过滤树结构数据
filterNode(value, data) {
if (!value) return true;
return data.name.indexOf(value) !== -1;
},
// 点击节点事件
handleNodeClick(data) {
this.selectAreaId = data.id;
this.onSearch()
},
// 分页
handleCurrentChange(val) {
this.page.currentPage = val
this.getTableData()
},
},
};
</script>
<style lang="less">
@import "~@/style/pagination.less";
.interactive-wrapper {
display: flex;
.tree-box {
width: 420px;
.tree-body {
padding: 20px;
height: calc(100% - 56px);
.tree-content {
overflow-y: auto;
height: calc(100% - 50px);
}
.el-input {
margin-bottom: 10px;
.el-input__inner {
background: #f8f8f8;
border-radius: 22px;
}
.el-input__icon {
font-size: 18px;
color: #ac9374;
}
}
}
}
.detail-box {
width: calc(100% - 440px);
margin-left: 20px;
}
.scrollBox {
height: calc(100% - 160px);
overflow-y: auto;
}
.page-tip {
display: flex;
font-size: 14px;
color: #333333;
.page-tip-title {
font-weight: bold;
padding-right: 10px;
}
}
.el-card__body {
padding: 0;
height: 100%;
}
.tree-title {
font-size: 16px;
color: #fff;
text-align: center;
height: 56px;
line-height: 56px;
background: #9b1e23;
border-radius: 8px 8px 0 0;
}
.content-title {
display: flex;
justify-content: space-between;
padding: 20px;
border-bottom: 1px solid #eee;
.title {
font-size: 20px;
color: #333;
}
.page-tips {
width: 500px;
}
}
.content-item {
font-size: 16px;
margin: 20px;
padding: 40px;
background: #f8f8f8;
.title {
padding-bottom: 20px;
}
p {
padding-bottom: 20px;
border-bottom: 1px solid #bbb;
}
.img-box {
padding: 20px;
border-bottom: 1px solid #bbb;
img {
width: 90px;
height: 90px;
margin-right: 20px;
}
}
.author {
display: flex;
justify-content: space-between;
padding-top: 16px;
font-size: 14px;
}
}
}
</style>
\ No newline at end of file
...@@ -39,25 +39,36 @@ ...@@ -39,25 +39,36 @@
</el-form> </el-form>
<div class="page-tip"> <div class="page-tip">
<span class="page-tip-title">页面说明:</span> <span class="page-tip-title">页面说明:</span>
<span class="page-tips">可按照机顶盒状态及所属单位进行信息筛选。可查看当前系统所有机顶盒运维状态信息。</span> <span class="page-tips"
>可按照机顶盒状态及所属单位进行信息筛选。可查看当前系统所有机顶盒运维状态信息。</span
>
</div> </div>
</div> </div>
<div class="table-content"> <div class="table-content">
<div class="party-table"> <div class="party-table">
<el-table border style="width: 100%;height:100%" height="100%" :data="tableData"> <el-table
<el-table-column type="index" width="120" label="序号"></el-table-column> border
style="width: 100%; height: 100%"
height="100%"
:data="tableData"
>
<el-table-column
type="index"
width="120"
label="序号"
></el-table-column>
<el-table-column label="mac地址" prop="mac"></el-table-column> <el-table-column label="mac地址" prop="mac"></el-table-column>
<el-table-column label="所属单位" prop="organName"></el-table-column> <el-table-column label="所属单位" prop="organName"></el-table-column>
<el-table-column label="机顶盒状态" prop="status"> <el-table-column label="机顶盒状态" prop="status">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.status===1">待激活</span> <span v-if="scope.row.status === 1">待激活</span>
<span v-if="scope.row.status===2">已激活</span> <span v-if="scope.row.status === 2">已激活</span>
<span v-if="scope.row.status===3">故障</span> <span v-if="scope.row.status === 3">故障</span>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
</div> </div>
<div class="partyt-pagination" style="margin:0 20px;"> <div class="partyt-pagination" style="margin: 0 20px">
<el-pagination <el-pagination
background background
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
...@@ -76,51 +87,54 @@ import { getOrgListWithOutPage } from "@/config/organ.js"; ...@@ -76,51 +87,54 @@ import { getOrgListWithOutPage } from "@/config/organ.js";
export default { export default {
data() { data() {
return { return {
page: { currentPage: 1, pageSize: 10, total: 0 }, page: {
areaOptions: [], currentPage: 1,
pageSize: 10,
total: 0,
},
orgOptions: [], // 单位信息
areaOptions: [], // 区域信息
defaultProps: { defaultProps: {
label: "name", label: "name",
value: "id", value: "id",
checkStrictly: true, checkStrictly: true,
}, },
orgOptions: [],
statusOptions: [ statusOptions: [
// 状态信息
{ {
value: "1", value: "1",
label: "待激活" label: "待激活",
}, },
{ {
value: "2", value: "2",
label: "已激活" label: "已激活",
}, },
{ {
value: "3", value: "3",
label: "故障" label: "故障",
} },
], ],
form: { form: {
orgId: "", orgId: "",
status: "", status: "",
areaId: [] areaId: [],
}, },
tableData:[] tableData: [], // 表格信息
}; };
}, },
mounted() { mounted() {
this.getAreas(); this.getAreas();
this.getOrgList();
this.onSearch(); this.onSearch();
this.getOrgList()
}, },
methods: { methods: {
getAreas() { // 获取区域信息
getAreas().then(res => { async getAreas() {
this.areaOptions = res; this.areaOptions = await getAreas();
});
}, },
getOrgList(){ // 获取单位信息
getOrgListWithOutPage().then(res => { async getOrgList() {
this.orgOptions = res; this.orgOptions = await getOrgListWithOutPage();
});
}, },
// 查询 // 查询
onSearch() { onSearch() {
...@@ -133,7 +147,9 @@ export default { ...@@ -133,7 +147,9 @@ export default {
let param = { let param = {
_index: this.page.currentPage, _index: this.page.currentPage,
_size: this.page.pageSize, _size: this.page.pageSize,
areaId: this.form.areaId[this.form.areaId.length-1], areaId: this.form.areaId.length
? this.form.areaId[this.form.areaId.length - 1]
: "",
organId: this.form.orgId, organId: this.form.orgId,
status: this.form.status, status: this.form.status,
}; };
...@@ -141,36 +157,41 @@ export default { ...@@ -141,36 +157,41 @@ export default {
{ {
url: "boxOperation/getPageList", url: "boxOperation/getPageList",
method: "post", method: "post",
authType: this.backToken authType: this.backToken,
}, },
vm.$qs.stringify(param) vm.$qs.stringify(param)
) )
.then(res => { .then((res) => {
let data = res.data.data; if (res.data.resultCode === "200") {
vm.page.total = data.total; let data = res.data.data;
vm.tableData = data.records; vm.page.total = data.total;
vm.tableData = data.records;
} else {
this.$message.error(res.data.message);
}
}) })
.catch(function(err) { .catch(function (err) {
console.log(err); console.log(err);
}); });
}, },
// 重置
handleReset() { handleReset() {
this.form = { this.form = {
orgId: "", orgId: "",
status: "", status: "",
areaId: [] areaId: [],
}; };
this.onSearch() this.onSearch();
}, },
// 分页 // 分页
handleCurrentChange(val) { handleCurrentChange(val) {
this.page.currentPage = val; this.page.currentPage = val;
this.getTableData(); this.getTableData();
} },
} },
}; };
</script> </script>
<style lang="less"> <style lang="less">
@import "../../../style/table.less"; @import "~@/style/table.less";
@import "../../../style/pagination.less"; @import "~@/style/pagination.less";
</style> </style>
\ No newline at end of file
<template> <template>
<div class="custom-page height100"> <div class="custom-page height100">
<el-card class="height100"> <el-card class="height100">
<!-- <div class="page-title">app界面自定义</div> -->
<div class="page-content"> <div class="page-content">
<div class="page-tip"> <div class="page-tip">
<span class="tip-title">页面说明:</span> <span class="tip-title">页面说明:</span>
...@@ -14,6 +13,7 @@ ...@@ -14,6 +13,7 @@
<el-upload <el-upload
action="http://192.168.110.67/mall/file/image/upload" action="http://192.168.110.67/mall/file/image/upload"
:on-success="uploadPageImg" :on-success="uploadPageImg"
:before-upload="handleBeforeUpload"
:file-list="dirList" :file-list="dirList"
> >
<el-button type="default">上传背景图</el-button> <el-button type="default">上传背景图</el-button>
...@@ -44,7 +44,9 @@ ...@@ -44,7 +44,9 @@
<el-upload <el-upload
action="http://192.168.110.67/mall/file/image/upload" action="http://192.168.110.67/mall/file/image/upload"
:on-success="uploadRunImg" :on-success="uploadRunImg"
:file-list="fileRunList"> :before-upload="handleBeforeUpload"
:file-list="fileRunList"
>
<el-button type="default">上传背景图</el-button> <el-button type="default">上传背景图</el-button>
</el-upload> </el-upload>
</div> </div>
...@@ -54,7 +56,7 @@ ...@@ -54,7 +56,7 @@
<swiper-slide v-for="(item, index) in runList" :key="index"> <swiper-slide v-for="(item, index) in runList" :key="index">
<div class="swiper-item"> <div class="swiper-item">
<el-radio v-model="radioRun" :label="item.id"></el-radio> <el-radio v-model="radioRun" :label="item.id"></el-radio>
<img :src="item.url" alt /> <img :src="item.appRunPic" alt />
</div> </div>
</swiper-slide> </swiper-slide>
<div class="swiper-button-prev" slot="button-prev"> <div class="swiper-button-prev" slot="button-prev">
...@@ -69,7 +71,9 @@ ...@@ -69,7 +71,9 @@
</div> </div>
<div class="btn-group footer-btn"> <div class="btn-group footer-btn">
<el-button size="mini" @click="close">取 消</el-button> <el-button size="mini" @click="close">取 消</el-button>
<el-button size="mini" type="primary" @click="submitForm('editform')">确定</el-button> <el-button size="mini" type="primary" @click="submitForm('editform')"
>确定</el-button
>
</div> </div>
</el-card> </el-card>
</div> </div>
...@@ -82,40 +86,37 @@ export default { ...@@ -82,40 +86,37 @@ export default {
components: { Swiper, SwiperSlide }, components: { Swiper, SwiperSlide },
data() { data() {
return { return {
radioPage: '', radioPage: "", // 选中项
radioRun: '', radioRun: "",
dirList:[], dirList: [], // 上传列表
fileRunList:[], fileRunList: [],
swiperOption: { swiperOption: {
slideToClickedSlide: true, //点击后居中展示 slideToClickedSlide: true, //点击后居中展示
slidesPerView: 5, slidesPerView: 5,
spaceBetween: 30, spaceBetween: 30,
centeredSlides: true, centeredSlides: true,
observer: true, // 动态检查器,自动初始化swiper,默认为false observer: true,
observerParents: true, observerParents: true,
// centerInsufficientSlides: true, //不够5个时居中显示 // centerInsufficientSlides: true, //不够5个时居中显示
// loop: true, // 不能同上一个属性同用 // loop: true, // 不能同上一个属性同用
navigation: { navigation: {
nextEl: ".swiper-button-next", nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev" prevEl: ".swiper-button-prev",
}, },
on: { on: {
click: function() { click: function () {
console.log(vm) console.log(vm);
if (this.$el[0].parentNode.className.indexOf("top") > 0) { if (this.$el[0].parentNode.className.indexOf("top") > 0) {
vm.radioPage = this.realIndex; vm.radioPage = this.realIndex;
// vm.radioPage = vm.pageList[this.realIndex].id;
} }
if (this.$el[0].parentNode.className.indexOf("bottom") > 0) { if (this.$el[0].parentNode.className.indexOf("bottom") > 0) {
vm.radioRun = this.realIndex; vm.radioRun = this.realIndex;
// vm.radioRun = vm.runList[this.realIndex].id;
} }
} },
} },
}, },
pagefileList: [], pageList: [], // 数据列表
pageList: [], runList: [],
runList: []
}; };
}, },
created() {}, created() {},
...@@ -127,131 +128,147 @@ export default { ...@@ -127,131 +128,147 @@ export default {
// 查询目录列表 // 查询目录列表
getDirPicList() { getDirPicList() {
let _this = this; let _this = this;
_this.$https({ _this
url: "tAppDirPic/getList", .$https({
method: "get", url: "tAppDirPic/getList",
authType: this.backToken method: "get",
}) authType: this.backToken,
.then(res => { })
.then((res) => {
if (res.data.resultCode === "200") { if (res.data.resultCode === "200") {
_this.pageList = res.data.data; _this.pageList = res.data.data;
_this.pageList.forEach(item => { _this.pageList.forEach((item) => {
if (item.isCurrent) { if (item.isCurrent) {
this.radioPage = item.id; this.radioPage = item.id;
} }
}); });
} else { } else {
this.$message({ type: "error", message: res.data.message }); this.$message.error(res.data.message);
} }
}) })
.catch(function(err) { .catch(function (err) {
console.log(err); console.log(err);
}); });
}, },
// 查询运行列表 // 查询运行列表
getAppRunList() { getAppRunList() {
let _this = this; let _this = this;
_this.$https({ _this
url: "tAppRunPic/getList", .$https({
method: "get", url: "tAppRunPic/getList",
authType: this.backToken method: "get",
}) authType: this.backToken,
.then(res => { })
.then((res) => {
if (res.data.resultCode === "200") { if (res.data.resultCode === "200") {
_this.runList = res.data.data; _this.runList = res.data.data;
_this.runList.forEach(item => { _this.runList.forEach((item) => {
if (item.isCurrent) { if (item.isCurrent) {
this.radioRun = item.id; this.radioRun = item.id;
} }
}); });
} else { } else {
this.$message({ type: "error", message: res.data.message }); this.$message.error(res.data.message);
} }
}) })
.catch(function(err) { .catch(function (err) {
console.log(err); console.log(err);
}); });
}, },
// 上传文件格式限制
handleBeforeUpload(file) {
if (file.type !== "image/jpeg" && file.type !== "image/png") {
this.$message.error("只能上传jpeg、jpg、png格式的文件");
return false;
}
return true;
},
// 新增目录图片
uploadPageImg(res, file) { uploadPageImg(res, file) {
this.saveItem(res.url,'tAppDirPic/save') if (res.resultCode === "200") {
this.saveItem(
{ appDirPic: res.data.url, isCurrent: 1 },
"tAppDirPic/save"
);
} else {
this.$message.error(res.message);
}
}, },
// 新增运行图片
uploadRunImg(res, file) { uploadRunImg(res, file) {
this.saveItem(res.url,'tAppRunPic/save') if (res.resultCode === "200") {
this.saveItem(
{ appRunPic: res.data.url, isCurrent: 1 },
"tAppRunPic/save"
);
} else {
this.$message.error(res.message);
}
}, },
saveItem(pic,url){ // 新增接口
saveItem(param, url) {
let _this = this; let _this = this;
let param = { _this
appDirPic: pic, .$https(
isCurrent: 1
};
_this.$https(
{ {
url: url, url: url,
method: "post", method: "post",
authType: this.backToken authType: this.backToken,
}, },
_this.$qs.stringify(param) _this.$qs.stringify(param)
) )
.then( .then(
res => { (res) => {
if (res.data.resultCode === "200") { if (res.data.resultCode === "200") {
_this.$message({ _this.$message.success(res.data.message);
type: "success", this.getDirPicList();
message: res.data.message this.getAppRunList();
});
this.getDirPicList()
this.getAppRunList()
} else { } else {
_this.$message({ _this.$message.error(res.data.message);
type: "error",
message: res.data.message
});
} }
}, },
error => { (error) => {
_this.$message({ console.log(error);
type: "error",
message: error
});
} }
); );
}, },
// 修改当前项
submitForm() { submitForm() {
// 修改当前项 this.updateCurrent(this.pageList[vm.radioPage].id, "tAppDirPic/update");
this.updateCurrent(this.pageList[vm.radioPage].id,'tAppDirPic/update') this.updateCurrent(this.runList[vm.radioRun].id, "tAppRunPic/update");
this.updateCurrent(this.runList[vm.radioRun].id,'tAppRunPic/update')
}, },
updateCurrent(id,url){ updateCurrent(id, url) {
let vm = this; let vm = this;
let param = { let param = {
id: id, id: id,
isCurrent:1 isCurrent: 1,
}; };
vm.$https( vm.$https(
{ {
url: url, url: url,
method: "put", method: "put",
authType: this.backToken authType: this.backToken,
}, },
vm.$qs.stringify(param) vm.$qs.stringify(param)
) )
.then(res => { .then((res) => {
if(res.data.resultCode==='200'){ if (res.data.resultCode === "200") {
this.$message.success("操作成功") this.$message.success("操作成功");
this.getDirPicList(); this.getDirPicList();
this.getAppRunList(); this.getAppRunList();
}else{ } else {
this.$message({type:'error',message:res.data.message}) this.$message.error(res.data.message);
} }
}) })
.catch(function(err) { .catch(function (err) {
console.log(err); console.log(err);
}); });
}, },
// 取消
close() { close() {
this.$router.go(-1); this.$router.go(-1);
} },
} },
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
......
<template>
<div class="interactive-wrapper height100">
<el-row :gutter="16" style="margin-left:0;margin-right:0;height:calc(100% - 41px);">
<el-col :span="6" class="height100">
<el-card class="height100">
<div class="tree-title">组织机构</div>
<div class="tree-body">
<el-input suffix-icon="el-icon-search" placeholder="请输入组织结构名称" v-model="filterText"></el-input>
<el-tree
class="filter-tree"
:data="treeData"
:props="defaultProps"
default-expand-all
accordion
:filter-node-method="filterNode"
@node-click="handleNodeClick"
ref="tree"
/>
</div>
</el-card>
</el-col>
<el-col :span="18" class="height100" ref="rightBox">
<el-card class="height100">
<div class="content-title">
<div class="title">“北京市政府”展板互动信息汇总</div>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips">可按照账号状态及所属单位进行信息筛选。可新增机顶盒账号,“*”为必填项。请先创建单位管理员账号,否则机顶盒无法激活</span>
</div>
</div>
<div class="scrollBox" :style="{height:height+'px'}">
<div class="content-item" v-for="(item,index) in tableData" :key="index">
<h5 class="title">{{item.name}}</h5>
<p>{{item.content}}</p>
<div class="img-box">
<img v-for="(j,idx) in item.images" :src="j" :key='idx' alt="">
<!-- <img src="@/assets/audio-icon.png" alt="">
<img src="@/assets/audio-icon.png" alt="">
<img src="@/assets/video-icon.png" alt="">
<img src="https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic139.nipic.com%2Ffile%2F20170825%2F24044964_112347917039_2.jpg&refer=http%3A%2F%2Fpic139.nipic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1616393684&t=43405cf2c33d8addc98e0909da78f359" alt=""> -->
</div>
<div class="author">
<div>{{item.username}}</div>
<div>{{item.createTime}}</div>
</div>
</div>
</div>
<div class="partyt-pagination" style="margin:0 20px;">
<el-pagination
background
@current-change="handleCurrentChange"
:current-page="page.currentPage"
:page-size="page.pageSize"
layout="prev, pager, next, jumper"
:total="page.total"
></el-pagination>
</div>
</el-card>
</el-col>
</el-row>
</div>
</template>
<script>
export default {
data() {
return {
height:'',
filterText: "",
page: { currentPage: 1, pageSize: 10, total: 0 },
treeData: [],
defaultProps: {
children: "children",
label: "name"
},
selectAreaId:'',
tableData: [
{
title: "建党百年,爱国主义教育",
content: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar tempor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus sapien nunc eget.",
author: "邢潇潇",
files:['@/assets/audio-icon.png','@/assets/video-icon.png','https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic139.nipic.com%2Ffile%2F20170825%2F24044964_112347917039_2.jpg&refer=http%3A%2F%2Fpic139.nipic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1616393684&t=43405cf2c33d8addc98e0909da78f359'],
macUrl: "2021/01/02 14:34:22"
},
{
title: "建党百年,爱国主义教育",
content: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. Proin gravida dolor sit amet lacus accumsan et viverra justo commodo. Proin sodales pulvinar tempor. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam fermentum, nulla luctus pharetra vulputate, felis tellus mollis orci, sed rhoncus sapien nunc eget.",
author: "邢潇潇",
files:['@/assets/audio-icon.png','@/assets/video-icon.png','https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fpic139.nipic.com%2Ffile%2F20170825%2F24044964_112347917039_2.jpg&refer=http%3A%2F%2Fpic139.nipic.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1616393684&t=43405cf2c33d8addc98e0909da78f359'],
macUrl: "2021/01/02 14:34:22"
},
]
};
},
watch: {
filterText(val) {
this.$refs.tree.filter(val);
}
},
mounted(){
this.height = this.$refs.rightBox.$el.offsetHeight-160
// 获取全部组织机构数据
this.getOrgData()
this.onSearch()
},
methods: {
// 查询
onSearch() {
this.page.currentPage = 1
this.getTableData();
},
// 获得数据接口
getTableData() {
let vm = this;
vm.tableData = []
let param = {
_index:this.page.currentPage,
_size:this.page.pageSize,
orgId: this.selectAreaId
};
vm.$https(
{
url: "interaction/getList",
method: "post",
authType: this.backToken
},
vm.$qs.stringify(param)
).then(res => {
if(res.data.resultCode==='200'){
let data = res.data.data;
vm.page.total = data.total;
vm.tableData = data.records;
vm.tableData.forEach(item=>{
item.images = item.images.split(',')
item.images.forEach((result,index)=>{
if (/\.(MP4|mp4)/.test(result)){
item.images[index] = require('@/assets/video-icon.png')
}else if (/\.(MP3|mp3)/.test(result)){
item.images[index] = require('@/assets/audio-icon.png')
}else {
item.images[index] = require('@/assets/default-img.jpeg')
}
})
})
vm.tableData = [...vm.tableData]
}else{
this.$message({type:'error',message:res.data.message})
}
})
.catch(function(err) {
console.log(err);
})
},
// 获取组织机构数据
getOrgData(){
this.$https({
method: "get",
url: "organ/getList",
authType: this.backToken
}).then(res => {
if(res.data.resultCode === '200'){
this.treeData = res.data.data;
}else{
this.$message({type:'error',message:res.data.message})
}
},
error => {
console.log(error);
}
);
},
// 过滤树结构数据
filterNode(value, data) {
if (!value) return true;
return data.name.indexOf(value) !== -1;
},
// 点击节点事件
handleNodeClick(data) {
this.selectAreaId = data.id
this.getTableData()
},
// 分页
handleCurrentChange(val) {
this.page.currentPage = val;
this.getTableData();
},
}
};
</script>
<style lang="less">
@import '../../../style/pagination.less';
.interactive-wrapper {
.scrollBox {
overflow: auto;
}
.page-tip {
display: flex;
font-size: 14px;
color: #333333;
.page-tip-title {
font-weight: bold;
padding-right: 10px;
}
}
.el-card__body {
padding: 0;
}
.tree-title {
font-size: 16px;
color: #fff;
text-align: center;
height: 56px;
line-height: 56px;
background: #9B1E23;
border-radius: 8px 8px 0 0;
}
.tree-body {
padding: 20px;
.el-input__inner {
background: #F8F8F8;
border-radius: 22px;
}
.el-input__icon {
font-size: 18px;
color: #AC9374;
}
.el-tree-node__content:hover {
border-radius: 20px;
}
.el-tree-node__content {
height:30px;
margin: 5px 0;
}
}
.content-title {
display: flex;
justify-content: space-between;
padding: 20px;
border-bottom: 1px solid #eee;
.title {
font-size: 20px;
color: #333;
}
.page-tips {
width:500px;
}
}
.content-item {
font-size: 16px;
margin: 20px;
padding: 40px;
background: #f8f8f8;
.title {
padding-bottom: 20px;
}
p {
padding-bottom: 20px;
border-bottom: 1px solid #bbb;
}
.img-box {
padding: 20px;
border-bottom: 1px solid #bbb;
img {
width: 90px;
height: 90px;
margin-right: 20px;
}
}
.author {
display: flex;
justify-content: space-between;
padding-top: 16px;
font-size: 14px;
}
}
}
</style>
\ No newline at end of file
...@@ -21,7 +21,7 @@ export let STBoxRoute = [ ...@@ -21,7 +21,7 @@ export let STBoxRoute = [
{ {
path: '/interactive', path: '/interactive',
name: '互动内容', name: '互动内容',
component: () => import('@/page/content/interactive/index'), component: () => import('@/page/STB/interactive/index'),
meta: { meta: {
showBreadcrumb: true, showBreadcrumb: true,
title: '互动内容', title: '互动内容',
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment