Skip to content

N
national_museum_vod
Commit f9ecf430 authored by Your Name's avatar Your Name
Browse files
Options

账户管理

parent 1bb1a26a
Hide whitespace changes
Inline Side-by-side
Showing with 2676 additions and 2645 deletions
config/index.js
View file @ f9ecf430
'use strict'
// Template version: 1.3.1
// see http://vuejs-templates.github.io/webpack for documentation.
const path = require('path')
module.exports = {
dev: {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {
'/mall': {
target: "http://111.203.232.175:8088/mall",
// target: "http://192.168.110.67/mall",
// target: "http://192.168.204.66:8088/mall",
changeOrigin: true,
pathRewrite: {
'^/mall': '/' // 重写接口
}
},
'/aa': {
target: "http://111.203.232.175:8085",
changeOrigin: true,
pathRewrite: {
'^/aa': '/' // 重写接口
}
}
},
// Various Dev Server settings
// host: 'localhost', // can be overwritten by process.env.HOST
host: '0.0.0.0', // can be overwritten by process.env.HOST
port: 3000, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
notifyOnErrors: true,
poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
/**
* Source Maps
*/
// https://webpack.js.org/configuration/devtool/#development
devtool: 'cheap-module-eval-source-map',
// If you have problems debugging vue-files in devtools,
// set this to false - it *may* help
// https://vue-loader.vuejs.org/en/options.html#cachebusting
cacheBusting: true,
cssSourceMap: true
},
build: {
// Template for index.html
index: path.resolve(__dirname, '../plat/index.html'),
// Paths
assetsRoot: path.resolve(__dirname, '../plat'),
assetsSubDirectory: 'static',
assetsPublicPath: './',
/**
* Source Maps
*/
productionSourceMap: false,
// https://webpack.js.org/configuration/devtool/#production
devtool: '#source-map',
// Gzip off by default as many popular static hosts such as
// Surge or Netlify already gzip all static assets for you.
// Before setting to `true`, make sure to:
// npm install --save-dev compression-webpack-plugin
productionGzip: false,
productionGzipExtensions: ['js', 'css'],
// Run the build command with an extra argument to
// View the bundle analyzer report after build finishes:
// `npm run build --report`
// Set to `true` or `false` to always turn it on or off
bundleAnalyzerReport: process.env.npm_config_report
}
}
'use strict'
// Template version: 1.3.1
// see http://vuejs-templates.github.io/webpack for documentation.
const path = require('path')
module.exports = {
dev: {
// Paths
assetsSubDirectory: 'static',
assetsPublicPath: '/',
proxyTable: {
'/mall': {
target: "http://111.203.232.175:8088/mall",
// target: "http://192.168.110.67/mall",
// target: "http://192.168.204.66:8088/mall",
changeOrigin: true,
pathRewrite: {
'^/mall': '/' // 重写接口
}
},
'/aa': {
target: "http://111.203.232.175:8085",
changeOrigin: true,
pathRewrite: {
'^/aa': '/' // 重写接口
}
}
},
// Various Dev Server settings
// host: 'localhost', // can be overwritten by process.env.HOST
host: '0.0.0.0', // can be overwritten by process.env.HOST
port: 3000, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
autoOpenBrowser: false,
errorOverlay: true,
notifyOnErrors: true,
poll: false, // https://webpack.js.org/configuration/dev-server/#devserver-watchoptions-
/**
* Source Maps
*/
// https://webpack.js.org/configuration/devtool/#development
devtool: 'cheap-module-eval-source-map',
// If you have problems debugging vue-files in devtools,
// set this to false - it *may* help
// https://vue-loader.vuejs.org/en/options.html#cachebusting
cacheBusting: true,
cssSourceMap: true
},
build: {
// Template for index.html
index: path.resolve(__dirname, '../plat/index.html'),
// Paths
assetsRoot: path.resolve(__dirname, '../plat'),
assetsSubDirectory: 'static',
assetsPublicPath: './',
/**
* Source Maps
*/
productionSourceMap: false,
// https://webpack.js.org/configuration/devtool/#production
devtool: '#source-map',
// Gzip off by default as many popular static hosts such as
// Surge or Netlify already gzip all static assets for you.
// Before setting to `true`, make sure to:
// npm install --save-dev compression-webpack-plugin
productionGzip: false,
productionGzipExtensions: ['js', 'css'],
// Run the build command with an extra argument to
// View the bundle analyzer report after build finishes:
// `npm run build --report`
// Set to `true` or `false` to always turn it on or off
bundleAnalyzerReport: process.env.npm_config_report
}
}
package.json
View file @ f9ecf430
{
"name": "hall",
"version": "1.0.0",
"description": "manage",
"author": "yuyan <yuyan@wisenergy.com.cn>",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},
"dependencies": {
"animate.css": "^4.1.1",
"axios": "^0.18.0",
"crypto-js": "^4.0.0",
"echarts": "^4.2.0-rc.2",
"element-ui": "^2.7.2",
"file-saver": "^2.0.0-rc.3",
"html2canvas": "^1.0.0-rc.7",
"js-base64": "^3.6.0",
"jspdf": "^2.3.1",
"moment": "^2.22.2",
"qrcode.vue": "^1.6.1",
"qs": "^6.5.2",
"qs-stringify": "^1.1.0",
"swiper": "^5.4.5",
"video.js": "^7.11.4",
"vue": "^2.5.2",
"vue-awesome-swiper": "^4.1.1",
"vue-qr": "^1.5.2",
"vue-router": "^3.0.1",
"vuex": "^3.0.1",
"xlsx": "^0.14.0"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-core": "^6.22.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.1",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-preset-env": "^1.3.2",
"babel-preset-stage-2": "^6.22.0",
"chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.11",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^1.1.11",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1",
"jquery": "^3.3.1",
"less": "^3.8.1",
"less-loader": "^4.1.0",
"node-notifier": "^5.1.2",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0",
"portfinder": "^1.0.13",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.0.8",
"postcss-url": "^7.2.1",
"rimraf": "^2.6.0",
"sass-resources-loader": "^2.1.1",
"semver": "^5.3.0",
"shelljs": "^0.7.6",
"style-loader": "^0.23.0",
"uglifyjs-webpack-plugin": "^1.1.1",
"url-loader": "^1.1.2",
"vue-loader": "^13.3.0",
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.5.2",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.1.0"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
{
"name": "hall",
"version": "1.0.0",
"description": "manage",
"author": "yuyan <yuyan@wisenergy.com.cn>",
"private": true,
"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},
"dependencies": {
"animate.css": "^4.1.1",
"axios": "^0.18.0",
"crypto-js": "^4.0.0",
"echarts": "^4.2.0-rc.2",
"element-ui": "^2.7.2",
"file-saver": "^2.0.0-rc.3",
"html2canvas": "^1.0.0-rc.7",
"js-base64": "^3.6.0",
"jspdf": "^2.3.1",
"moment": "^2.22.2",
"qrcode.vue": "^1.6.1",
"qs": "^6.5.2",
"qs-stringify": "^1.1.0",
"swiper": "^5.4.5",
"video.js": "^7.11.4",
"vue": "^2.5.2",
"vue-awesome-swiper": "^4.1.1",
"vue-qr": "^1.5.2",
"vue-router": "^3.0.1",
"vuex": "^3.0.1",
"xlsx": "^0.14.0"
},
"devDependencies": {
"autoprefixer": "^7.1.2",
"babel-core": "^6.22.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.1",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-preset-env": "^1.3.2",
"babel-preset-stage-2": "^6.22.0",
"chalk": "^2.0.1",
"copy-webpack-plugin": "^4.0.1",
"css-loader": "^0.28.11",
"extract-text-webpack-plugin": "^3.0.0",
"file-loader": "^1.1.11",
"friendly-errors-webpack-plugin": "^1.6.1",
"html-webpack-plugin": "^2.30.1",
"jquery": "^3.3.1",
"less": "^3.8.1",
"less-loader": "^4.1.0",
"node-notifier": "^5.1.2",
"optimize-css-assets-webpack-plugin": "^3.2.0",
"ora": "^1.2.0",
"portfinder": "^1.0.13",
"postcss-import": "^11.0.0",
"postcss-loader": "^2.0.8",
"postcss-url": "^7.2.1",
"rimraf": "^2.6.0",
"sass-resources-loader": "^2.1.1",
"semver": "^5.3.0",
"shelljs": "^0.7.6",
"style-loader": "^0.23.0",
"uglifyjs-webpack-plugin": "^1.1.1",
"url-loader": "^1.1.2",
"vue-loader": "^13.3.0",
"vue-style-loader": "^3.0.1",
"vue-template-compiler": "^2.5.2",
"webpack": "^3.6.0",
"webpack-bundle-analyzer": "^2.9.0",
"webpack-dev-server": "^2.9.1",
"webpack-merge": "^4.1.0"
},
"engines": {
"node": ">= 6.0.0",
"npm": ">= 3.0.0"
},
"browserslist": [
"> 1%",
"last 2 versions",
"not ie <= 8"
]
}
src/page/STB/appversion/components/addDialog.vue
View file @ f9ecf430
<template>
<el-dialog
class="custom-dialog"
custom-class="party-dialog"
title="上传新版安装包"
width="468px"
:visible.sync="formVisible"
:before-close="close"
>
<div class="dialog-content">
<el-form
:model="formItem"
class="party-form version-add"
ref="formItem"
label-position="top"
:rules="rules"
>
<el-form-item label="版本号：" prop="appVersion">
<el-input
maxlength="20"
v-model="formItem.appVersion"
clearable
placeholder="请输入版本号"
></el-input>
</el-form-item>
<el-form-item label="版本信息：" prop="versionInfo">
<el-input
maxlength="100"
type="textarea"
v-model="formItem.versionInfo"
></el-input>
</el-form-item>
<el-form-item label="更新内容：" prop="updateLog">
<el-input
maxlength="100"
type="textarea"
v-model="formItem.updateLog"
></el-input>
</el-form-item>
<el-upload
class="text-center"
drag
:action="uploadUrl"
:headers ="headers"
:on-success="handleAvatarSuccess"
:before-upload="handleBeforeUpload"
:file-list="fileList"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将安装包拖到此处，或<em>点击上传安装包</em>
</div>
<div class="el-upload__tip" slot="tip">只能上传apk文件</div>
</el-upload>
</el-form>
</div>
<div slot="footer" class="dialog-footer btn-group">
<el-button size="mini" @click="close">取 消</el-button>
<el-button size="mini" type="primary" @click="submitForm('formItem')">确定</el-button>
</div>
</el-dialog>
</template>
<script>
export default {
data() {
return {
uploadUrl:'http://111.203.232.175:8088/mall/file/upload/allType',
formVisible: false,
headers:{Authorization: localStorage.getItem('backToken')},
formItem: {},
fileList: [],
rules: {
appVersion: [
{ required: true, message: "请输入版本号", trigger: "blur" },
],
versionInfo: [
{ required: true, message: "请输入版本信息", trigger: "blur" },
],
updateLog: [
{ required: true, message: "请输入更新内容", trigger: "blur" },
],
},
};
},
methods: {
backFn() {
this.formVisible = true
this.formItem = {}
this.fileList = []
this.$nextTick(() => {
this.$refs.formItem.clearValidate()
});
},
// 关闭
close() {
this.formVisible = false;
for (let key in this.formItem) {
this.formItem[key] = null
}
this.$refs["formItem"].resetFields()
},
// 格式控制
handleBeforeUpload(file) {
if (file.type !== "application/vnd.android.package-archive") {
this.$message.error("只能上传apk文件")
return false
}
return true
},
// 上传数据操作
handleAvatarSuccess(res, file) {
if(res.resultCode==='200'){
this.formItem.apkUrl = res.data.url
}else{
this.$message.error(res.message)
}
},
// 保存编辑信息
submitForm() {
let _this = this
_this.$refs.formItem.validate((valid) => {
if (valid) {
if (!this.formItem.apkUrl) {
this.$message.info("请先选取文件!")
return false
}
let param = {
appVersion: this.formItem.appVersion,
versionInfo: this.formItem.versionInfo,
updateLog: this.formItem.updateLog,
apkUrl: this.formItem.apkUrl,
}
_this
.$https(
{
url: "tAppVersion/save",
method: "post",
authType: this.backToken,
},
_this.$qs.stringify(param)
)
.then(
(res) => {
if (res.data.resultCode === "200") {
_this.$message.success(res.data.message)
_this.formVisible = false
_this.$emit("refreshFn")
} else {
_this.$message.error(res.data.message)
}
},
(error) => {
console.log(error)
}
)
}
})
},
},
};
</script>
<style lang="less">
.version-add {
.el-upload-dragger {
height: 120px;
.el-icon-upload {
margin-top: 10px;
}
}
.text-center {
text-align: center;
}
}
</style>
<template>
<el-dialog
class="custom-dialog"
custom-class="party-dialog"
title="上传新版安装包"
width="468px"
:visible.sync="formVisible"
:before-close="close"
>
<div class="dialog-content">
<el-form
:model="formItem"
class="party-form version-add"
ref="formItem"
label-position="top"
:rules="rules"
>
<el-form-item label="版本号：" prop="appVersion">
<el-input
maxlength="20"
v-model="formItem.appVersion"
clearable
placeholder="请输入版本号"
></el-input>
</el-form-item>
<el-form-item label="版本信息：" prop="versionInfo">
<el-input
maxlength="100"
type="textarea"
v-model="formItem.versionInfo"
></el-input>
</el-form-item>
<el-form-item label="更新内容：" prop="updateLog">
<el-input
maxlength="100"
type="textarea"
v-model="formItem.updateLog"
></el-input>
</el-form-item>
<el-upload
class="text-center"
drag
:action="uploadUrl"
:headers ="headers"
:on-success="handleAvatarSuccess"
:before-upload="handleBeforeUpload"
:file-list="fileList"
>
<i class="el-icon-upload"></i>
<div class="el-upload__text">
将安装包拖到此处，或<em>点击上传安装包</em>
</div>
<div class="el-upload__tip" slot="tip">只能上传apk文件</div>
</el-upload>
</el-form>
</div>
<div slot="footer" class="dialog-footer btn-group">
<el-button size="mini" @click="close">取 消</el-button>
<el-button size="mini" type="primary" @click="submitForm('formItem')">确定</el-button>
</div>
</el-dialog>
</template>
<script>
export default {
data() {
return {
uploadUrl:'http://111.203.232.175:8088/mall/file/upload/allType',
formVisible: false,
headers:{Authorization: localStorage.getItem('backToken')},
formItem: {},
fileList: [],
rules: {
appVersion: [
{ required: true, message: "请输入版本号", trigger: "blur" },
],
versionInfo: [
{ required: true, message: "请输入版本信息", trigger: "blur" },
],
updateLog: [
{ required: true, message: "请输入更新内容", trigger: "blur" },
],
},
};
},
methods: {
backFn() {
this.formVisible = true
this.formItem = {}
this.fileList = []
this.$nextTick(() => {
this.$refs.formItem.clearValidate()
});
},
// 关闭
close() {
this.formVisible = false;
for (let key in this.formItem) {
this.formItem[key] = null
}
this.$refs["formItem"].resetFields()
},
// 格式控制
handleBeforeUpload(file) {
if (file.type !== "application/vnd.android.package-archive") {
this.$message.error("只能上传apk文件")
return false
}
return true
},
// 上传数据操作
handleAvatarSuccess(res, file) {
if(res.resultCode==='200'){
this.formItem.apkUrl = res.data.url
}else{
this.$message.error(res.message)
}
},
// 保存编辑信息
submitForm() {
let _this = this
_this.$refs.formItem.validate((valid) => {
if (valid) {
if (!this.formItem.apkUrl) {
this.$message.info("请先选取文件!")
return false
}
let param = {
appVersion: this.formItem.appVersion,
versionInfo: this.formItem.versionInfo,
updateLog: this.formItem.updateLog,
apkUrl: this.formItem.apkUrl,
}
_this
.$https(
{
url: "tAppVersion/save",
method: "post",
authType: this.backToken,
},
_this.$qs.stringify(param)
)
.then(
(res) => {
if (res.data.resultCode === "200") {
_this.$message.success(res.data.message)
_this.formVisible = false
_this.$emit("refreshFn")
} else {
_this.$message.error(res.data.message)
}
},
(error) => {
console.log(error)
}
)
}
})
},
},
};
</script>
<style lang="less">
.version-add {
.el-upload-dragger {
height: 120px;
.el-icon-upload {
margin-top: 10px;
}
}
.text-center {
text-align: center;
}
}
</style>
src/page/STB/base/index.vue
View file @ f9ecf430
<template>
<div class="STBbase-wrapper height100">
<div class="search-container">
<el-form :inline="true" :model="form">
<el-form-item>
<el-select v-model="form.orgId" placeholder="请选择所属单位">
<el-option
v-for="item in orgOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-cascader
placeholder="请选择区域"
v-model="form.areaId"
:options="areaOptions"
:props="defaultProps"
change-on-select
></el-cascader>
</el-form-item>
<el-form-item>
<el-date-picker
v-model="form.date"
type="daterange"
value-format="yyyy-MM-dd"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item>
<div class="btn-group">
<el-button type="primary" @click="onSearch">查询</el-button>
<el-button @click="handleReset">重置</el-button>
</div>
</el-form-item>
</el-form>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips"
>机顶盒账号为机顶盒所属单位名称，新建后生成6位数字及字母的随机密码，作为机顶盒的登录密码。</span
>
</div>
</div>
<div class="table-content">
<div class="btn-group">
<el-button type="primary" @click="addBox">新建机顶盒账号</el-button>
<el-button class="export" type="primary" @click="handleExport"
>导出</el-button
>
</div>
<stb-table
:currentPage="page._index"
:feildList="feildList"
:list="tableData"
@action="handleAction"
/>
<party-pagination :page="page" @changePage="handleCurrentChange" />
</div>
<add-dialog ref="formItem" @refreshFn="onSearch" />
<edit-dialog ref="editform" @refreshFn="onSearch" />
</div>
</template>
<script>
import { partyPagination } from "@/components/index";
import { addDialog, editDialog, stbTable } from "./components/index";
import { getAreas } from "@/config/area.js";
import { getOrgListWithOutPage } from "@/config/organ.js";
export default {
components: { partyPagination, addDialog, editDialog, stbTable },
data() {
return {
page: {
_index: 1,
_size: 10,
total: 0,
},
feildList: [
{ prop: "mac", label: "MAC地址" },
{ prop: "organName", label: "所属单位" },
{ prop: "num", label: "展板播放次数" },
{ prop: "exiredDate", label: "到期时间" },
{ prop: "", label: "操作", isEdit: true, width: 180 },
],
orgOptions: [], // 单位信息
areaOptions: [], //区域信息
defaultProps: {
label: "name",
value: "id",
checkStrictly: true,
},
form: {
orgId: "",
areaId: [],
},
tableData: [], // 表格信息
};
},
mounted() {
this.getAreas();
this.onSearch();
this.getOrgList();
},
methods: {
// 获取单位信息
async getOrgList() {
this.orgOptions = await getOrgListWithOutPage();
},
// 获取区域信息
async getAreas() {
this.areaOptions = await getAreas();
},
// 查询
onSearch() {
this.page._index = 1;
this.requestForm = JSON.parse(JSON.stringify(this.form));
this.getTableData();
},
// 获得数据接口
getTableData() {
let vm = this;
let dates = {};
if (this.form.date) {
dates.beginDate = this.form.date[0];
dates.endDate = this.form.date[1];
}
let param = {
_index: this.page._index,
_size: this.page._size,
areaId: this.requestForm.areaId.length
? this.requestForm.areaId[this.requestForm.areaId.length - 1]
: "",
organId: this.requestForm.orgId,
...dates,
};
vm.$https(
{
url: "boxOperation/selectPageList",
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;
} else {
this.$message.error(res.data.message);
}
})
.catch(function (err) {
console.log(err);
});
},
// 新增弹框打开
addBox() {
this.$refs.formItem.backFn(this.orgOptions);
},
// 重置
handleReset() {
this.form = {
orgId: "",
areaId: [],
};
this.onSearch();
},
// 分页
handleCurrentChange(val) {
this.page._index = val;
this.getTableData();
},
handleAction(params) {
this.activeRow = params.row;
switch (params.type) {
case "detail":
this.handleDetail();
break;
case "edit":
this.handleEdit();
break;
default:
break;
}
},
// 编辑
handleEdit() {
this.$refs.editform.backFn(this.activeRow);
},
// 导出
handleExport() {
let dates = {};
if (this.form.date) {
dates.beginDate = this.requestForm.date[0];
dates.endDate = this.requestForm.date[1];
}
let param = {
areaId: this.requestForm.areaId.length
? this.requestForm.areaId[this.requestForm.areaId.length - 1]
: "",
organId: this.requestForm.orgId,
...dates,
};
this.$https(
{
url: "/boxOperation/export",
method: "post",
authType: this.backToken,
responseType: "blob",
},
this.$qs.stringify(param)
).then((res) => {
let blobUrl = window.URL.createObjectURL(res.data);
const aElement = document.createElement("a");
aElement.href = blobUrl;
aElement.download = "机顶盒基础信息.xls";
aElement.click();
window.URL.revokeObjectURL(blobUrl);
});
},
},
};
</script>
<style lang="less">
<template>
<div class="STBbase-wrapper height100">
<div class="search-container">
<el-form :inline="true" :model="form">
<el-form-item>
<el-select v-model="form.orgId" placeholder="请选择所属单位">
<el-option
v-for="item in orgOptions"
:key="item.id"
:label="item.name"
:value="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-cascader
placeholder="请选择区域"
v-model="form.areaId"
:options="areaOptions"
:props="defaultProps"
change-on-select
></el-cascader>
</el-form-item>
<el-form-item>
<el-date-picker
v-model="form.date"
type="daterange"
value-format="yyyy-MM-dd"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</el-form-item>
<el-form-item>
<div class="btn-group">
<el-button type="primary" @click="onSearch">查询</el-button>
<el-button @click="handleReset">重置</el-button>
</div>
</el-form-item>
</el-form>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips"
>机顶盒账号为机顶盒所属单位名称，新建后生成6位数字及字母的随机密码，作为机顶盒的登录密码。</span
>
</div>
</div>
<div class="table-content">
<div class="btn-group">
<el-button type="primary" @click="addBox">新建机顶盒账号</el-button>
<el-button class="export" type="primary" @click="handleExport"
>导出</el-button
>
</div>
<stb-table
:currentPage="page._index"
:feildList="feildList"
:list="tableData"
@action="handleAction"
/>
<party-pagination :page="page" @changePage="handleCurrentChange" />
</div>
<add-dialog ref="formItem" @refreshFn="onSearch" />
<edit-dialog ref="editform" @refreshFn="onSearch" />
</div>
</template>
<script>
import { partyPagination } from "@/components/index";
import { addDialog, editDialog, stbTable } from "./components/index";
import { getAreas } from "@/config/area.js";
import { getOrgListWithOutPage } from "@/config/organ.js";
export default {
components: { partyPagination, addDialog, editDialog, stbTable },
data() {
return {
page: {
_index: 1,
_size: 10,
total: 0,
},
feildList: [
{ prop: "mac", label: "MAC地址" },
{ prop: "organName", label: "所属单位" },
{ prop: "num", label: "展板播放次数" },
{ prop: "exiredDate", label: "到期时间" },
{ prop: "", label: "操作", isEdit: true, width: 180 },
],
orgOptions: [], // 单位信息
areaOptions: [], //区域信息
defaultProps: {
label: "name",
value: "id",
checkStrictly: true,
},
form: {
orgId: "",
areaId: [],
},
tableData: [], // 表格信息
};
},
mounted() {
this.getAreas();
this.onSearch();
this.getOrgList();
},
methods: {
// 获取单位信息
async getOrgList() {
this.orgOptions = await getOrgListWithOutPage();
},
// 获取区域信息
async getAreas() {
this.areaOptions = await getAreas();
},
// 查询
onSearch() {
this.page._index = 1;
this.requestForm = JSON.parse(JSON.stringify(this.form));
this.getTableData();
},
// 获得数据接口
getTableData() {
let vm = this;
let dates = {};
if (this.form.date) {
dates.beginDate = this.form.date[0];
dates.endDate = this.form.date[1];
}
let param = {
_index: this.page._index,
_size: this.page._size,
areaId: this.requestForm.areaId.length
? this.requestForm.areaId[this.requestForm.areaId.length - 1]
: "",
organId: this.requestForm.orgId,
...dates,
};
vm.$https(
{
url: "boxOperation/selectPageList",
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;
} else {
this.$message.error(res.data.message);
}
})
.catch(function (err) {
console.log(err);
});
},
// 新增弹框打开
addBox() {
this.$refs.formItem.backFn(this.orgOptions);
},
// 重置
handleReset() {
this.form = {
orgId: "",
areaId: [],
};
this.onSearch();
},
// 分页
handleCurrentChange(val) {
this.page._index = val;
this.getTableData();
},
handleAction(params) {
this.activeRow = params.row;
switch (params.type) {
case "detail":
this.handleDetail();
break;
case "edit":
this.handleEdit();
break;
default:
break;
}
},
// 编辑
handleEdit() {
this.$refs.editform.backFn(this.activeRow);
},
// 导出
handleExport() {
let dates = {};
if (this.form.date) {
dates.beginDate = this.requestForm.date[0];
dates.endDate = this.requestForm.date[1];
}
let param = {
areaId: this.requestForm.areaId.length
? this.requestForm.areaId[this.requestForm.areaId.length - 1]
: "",
organId: this.requestForm.orgId,
...dates,
};
this.$https(
{
url: "/boxOperation/export",
method: "post",
authType: this.backToken,
responseType: "blob",
},
this.$qs.stringify(param)
).then((res) => {
let blobUrl = window.URL.createObjectURL(res.data);
const aElement = document.createElement("a");
aElement.href = blobUrl;
aElement.download = "机顶盒基础信息.xls";
aElement.click();
window.URL.revokeObjectURL(blobUrl);
});
},
},
};
</script>
<style lang="less">
</style>
\ No newline at end of file
src/page/STB/pageCustom/index.vue
View file @ f9ecf430
<template>
<div class="custom-page height100">
<el-card class="height100">
<div class="page-content">
<div class="page-tip">
<span class="tip-title">页面说明：</span>
<span>可更换app目录界面及运行界面的背景图，可新增背景图，可预览背景图</span>
</div>
<div class="top-content">
<div class="content-title">
<div class="title">app目录界面设置</div>
<div class="btn-group">
<el-upload
action="http://111.203.232.175:8088/mall/file/image/upload"
:on-success="uploadPageImg"
:before-upload="handleBeforeUpload"
:headers ="headers"
:file-list="dirList"
>
<el-button type="default">上传背景图</el-button>
</el-upload>
</div>
</div>
<div class="swiper-content top">
<swiper class="swiper" data-title="page" :options="swiperOption">
<swiper-slide v-for="(item, index) in pageList" :key="index">
<div class="swiper-item">
<el-radio v-model="radioPage" :label="item.id"></el-radio>
<img :src="item.appDirPic" alt />
</div>
</swiper-slide>
<div class="swiper-button-prev" slot="button-prev">
<i class="iconfont icon-arrow-left"></i>
</div>
<div class="swiper-button-next" slot="button-next">
<i class="iconfont icon-arrow-right"></i>
</div>
</swiper>
</div>
</div>
<div class="down-content">
<div class="content-title">
<div class="title">app运行画面设置</div>
<div class="btn-group">
<el-upload
action="http://111.203.232.175:8088/mall/file/image/upload"
:on-success="uploadRunImg"
:before-upload="handleBeforeUpload"
:headers ="headers"
:file-list="fileRunList"
>
<el-button type="default">上传背景图</el-button>
</el-upload>
</div>
</div>
<div class="swiper-content bottom">
<swiper class="swiper" :options="swiperOption">
<swiper-slide v-for="(item, index) in runList" :key="index">
<div class="swiper-item">
<el-radio v-model="radioRun" :label="item.id"></el-radio>
<img :src="item.appRunPic" alt />
</div>
</swiper-slide>
<div class="swiper-button-prev" slot="button-prev">
<i class="iconfont icon-arrow-left"></i>
</div>
<div class="swiper-button-next" slot="button-next">
<i class="iconfont icon-arrow-right"></i>
</div>
</swiper>
</div>
</div>
</div>
<div class="btn-group footer-btn">
<el-button @click="close">取 消</el-button>
<el-button type="primary" @click="submitForm('editform')"
>确定</el-button
>
</div>
</el-card>
</div>
</template>
<script>
import { Swiper, SwiperSlide } from "vue-awesome-swiper";
import "swiper/css/swiper.css";
var vm = {};
export default {
components: { Swiper, SwiperSlide },
data() {
return {
headers:{Authorization: localStorage.getItem('backToken')},
radioPage: "", // 选中项
radioRun: "",
dirList: [], // 上传列表
fileRunList: [],
swiperOption: {
slideToClickedSlide: true, //点击后居中展示
slidesPerView: 5,
spaceBetween: 30,
centeredSlides: true,
observer: true,
observerParents: true,
// centerInsufficientSlides: true, //不够5个时居中显示
// loop: true, // 不能同上一个属性同用
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
on: {
click: function () {
if (this.$el[0].parentNode.className.indexOf("top") > 0) {
vm.radioPage = this.realIndex;
}
if (this.$el[0].parentNode.className.indexOf("bottom") > 0) {
vm.radioRun = this.realIndex;
}
},
},
},
pageList: [], // 数据列表
runList: [],
};
},
created() {},
mounted() {
this.getDirPicList();
this.getAppRunList();
},
methods: {
// 查询目录列表
getDirPicList() {
let _this = this;
_this
.$https({
url: "tAppDirPic/getList",
method: "get",
authType: this.backToken,
})
.then((res) => {
if (res.data.resultCode === "200") {
_this.pageList = res.data.data;
_this.pageList.forEach((item) => {
if (item.isCurrent) {
this.radioPage = item.id;
}
});
} else {
this.$message.error(res.data.message);
}
})
.catch(function (err) {
console.log(err);
});
},
// 查询运行列表
getAppRunList() {
let _this = this;
_this
.$https({
url: "tAppRunPic/getList",
method: "get",
authType: this.backToken,
})
.then((res) => {
if (res.data.resultCode === "200") {
_this.runList = res.data.data;
_this.runList.forEach((item) => {
if (item.isCurrent) {
this.radioRun = item.id;
}
});
} else {
this.$message.error(res.data.message);
}
})
.catch(function (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) {
if (res.resultCode === "200") {
this.saveItem(
{ appDirPic: res.data.url, isCurrent: 1 },
"tAppDirPic/save"
);
} else {
this.$message.error(res.message);
}
},
// 新增运行图片
uploadRunImg(res, file) {
if (res.resultCode === "200") {
this.saveItem(
{ appRunPic: res.data.url, isCurrent: 1 },
"tAppRunPic/save"
);
} else {
this.$message.error(res.message);
}
},
// 新增接口
saveItem(param, url) {
let _this = this;
_this
.$https(
{
url: url,
method: "post",
authType: this.backToken,
},
_this.$qs.stringify(param)
)
.then(
(res) => {
if (res.data.resultCode === "200") {
_this.$message.success(res.data.message);
this.getDirPicList();
this.getAppRunList();
} else {
_this.$message.error(res.data.message);
}
},
(error) => {
console.log(error);
}
);
},
// 修改当前项
submitForm() {
if(vm.radioPage !== undefined){
this.updateCurrent(this.pageList[vm.radioPage].id, "tAppDirPic/update");
}
if(vm.radioRun!== undefined){
this.updateCurrent(this.runList[vm.radioRun].id, "tAppRunPic/update");
}
},
updateCurrent(id, url) {
let vm = this;
let param = {
id: id,
isCurrent: 1,
};
vm.$https(
{
url: url,
method: "put",
authType: this.backToken,
},
vm.$qs.stringify(param)
)
.then((res) => {
if (res.data.resultCode === "200") {
this.$message.success("操作成功");
this.getDirPicList();
this.getAppRunList();
} else {
this.$message.error(res.data.message);
}
})
.catch(function (err) {
console.log(err);
});
},
// 取消
close() {
this.$router.go(-1);
},
},
};
</script>
<style lang="less" scoped>
.custom-page {
position: relative;
.page-title {
font-size: 20px;
color: #333333;
text-align: center;
padding-bottom: 20px;
border-bottom: 1px solid #eee;
}
.page-tip {
background: #f7f5f2;
border-radius: 8px;
padding: 16px 20px;
margin: 20px 0;
font-size: 14px;
color: #333333;
.tip-title {
font-weight: 700;
margin-right: 5px;
}
}
.page-content {
width: 800px;
margin: 0 auto;
.content-title {
display: flex;
justify-content: space-between;
padding: 20px;
.title {
position: relative;
font-size: 18px;
color: #333333;
&::before {
content: "";
position: absolute;
top: 6px;
left: -20px;
width: 4px;
height: 18px;
background: #000;
}
}
.el-button {
padding: 0 20px;
}
}
.swiper-content {
.swiper-item {
position: relative;
width: 100%;
height: 128px;
background-color: #99a9bf;
border-radius: 10px;
/deep/.el-radio {
position: absolute;
right: 12px;
top: 12px;
.el-radio__label {
display: none;
}
.el-radio__inner {
width: 24px;
height: 24px;
}
.el-radio__input.is-checked .el-radio__inner {
border-color: #ac9374;
background: #ac9374;
}
.el-radio__inner:hover {
border-color: #ac9374;
}
}
img {
width: 100%;
height: 100%;
}
}
.swiper-button-next {
right: 0;
}
.swiper-button-prev {
left: 0;
}
.swiper-button-prev,
.swiper-button-next {
background: #ac9374;
width: 36px;
height: 36px;
border-radius: 50%;
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-size: 14px;
font-weight: 700;
color: #fff;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
transition: 300ms;
transform: scale(0.8);
}
.swiper-slide-active,
.swiper-slide-duplicate-active {
transform: scale(1);
}
}
}
/deep/.el-upload-list {
display: none;
}
.footer-btn {
position: absolute;
bottom: 20px;
left: 0;
right: 0;
text-align: center;
padding-top: 20px;
border-top: 1px solid #eee;
.el-button {
width: 160px;
}
}
}
</style>
<template>
<div class="custom-page height100">
<el-card class="height100">
<div class="page-content">
<div class="page-tip">
<span class="tip-title">页面说明：</span>
<span>可更换app目录界面及运行界面的背景图，可新增背景图，可预览背景图</span>
</div>
<div class="top-content">
<div class="content-title">
<div class="title">app目录界面设置</div>
<div class="btn-group">
<el-upload
action="http://111.203.232.175:8088/mall/file/image/upload"
:on-success="uploadPageImg"
:before-upload="handleBeforeUpload"
:headers ="headers"
:file-list="dirList"
>
<el-button type="default">上传背景图</el-button>
</el-upload>
</div>
</div>
<div class="swiper-content top">
<swiper class="swiper" data-title="page" :options="swiperOption">
<swiper-slide v-for="(item, index) in pageList" :key="index">
<div class="swiper-item">
<el-radio v-model="radioPage" :label="item.id"></el-radio>
<img :src="item.appDirPic" alt />
</div>
</swiper-slide>
<div class="swiper-button-prev" slot="button-prev">
<i class="iconfont icon-arrow-left"></i>
</div>
<div class="swiper-button-next" slot="button-next">
<i class="iconfont icon-arrow-right"></i>
</div>
</swiper>
</div>
</div>
<div class="down-content">
<div class="content-title">
<div class="title">app运行画面设置</div>
<div class="btn-group">
<el-upload
action="http://111.203.232.175:8088/mall/file/image/upload"
:on-success="uploadRunImg"
:before-upload="handleBeforeUpload"
:headers ="headers"
:file-list="fileRunList"
>
<el-button type="default">上传背景图</el-button>
</el-upload>
</div>
</div>
<div class="swiper-content bottom">
<swiper class="swiper" :options="swiperOption">
<swiper-slide v-for="(item, index) in runList" :key="index">
<div class="swiper-item">
<el-radio v-model="radioRun" :label="item.id"></el-radio>
<img :src="item.appRunPic" alt />
</div>
</swiper-slide>
<div class="swiper-button-prev" slot="button-prev">
<i class="iconfont icon-arrow-left"></i>
</div>
<div class="swiper-button-next" slot="button-next">
<i class="iconfont icon-arrow-right"></i>
</div>
</swiper>
</div>
</div>
</div>
<div class="btn-group footer-btn">
<el-button @click="close">取 消</el-button>
<el-button type="primary" @click="submitForm('editform')"
>确定</el-button
>
</div>
</el-card>
</div>
</template>
<script>
import { Swiper, SwiperSlide } from "vue-awesome-swiper";
import "swiper/css/swiper.css";
var vm = {};
export default {
components: { Swiper, SwiperSlide },
data() {
return {
headers:{Authorization: localStorage.getItem('backToken')},
radioPage: "", // 选中项
radioRun: "",
dirList: [], // 上传列表
fileRunList: [],
swiperOption: {
slideToClickedSlide: true, //点击后居中展示
slidesPerView: 5,
spaceBetween: 30,
centeredSlides: true,
observer: true,
observerParents: true,
// centerInsufficientSlides: true, //不够5个时居中显示
// loop: true, // 不能同上一个属性同用
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
on: {
click: function () {
if (this.$el[0].parentNode.className.indexOf("top") > 0) {
vm.radioPage = this.realIndex;
}
if (this.$el[0].parentNode.className.indexOf("bottom") > 0) {
vm.radioRun = this.realIndex;
}
},
},
},
pageList: [], // 数据列表
runList: [],
};
},
created() {},
mounted() {
this.getDirPicList();
this.getAppRunList();
},
methods: {
// 查询目录列表
getDirPicList() {
let _this = this;
_this
.$https({
url: "tAppDirPic/getList",
method: "get",
authType: this.backToken,
})
.then((res) => {
if (res.data.resultCode === "200") {
_this.pageList = res.data.data;
_this.pageList.forEach((item) => {
if (item.isCurrent) {
this.radioPage = item.id;
}
});
} else {
this.$message.error(res.data.message);
}
})
.catch(function (err) {
console.log(err);
});
},
// 查询运行列表
getAppRunList() {
let _this = this;
_this
.$https({
url: "tAppRunPic/getList",
method: "get",
authType: this.backToken,
})
.then((res) => {
if (res.data.resultCode === "200") {
_this.runList = res.data.data;
_this.runList.forEach((item) => {
if (item.isCurrent) {
this.radioRun = item.id;
}
});
} else {
this.$message.error(res.data.message);
}
})
.catch(function (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) {
if (res.resultCode === "200") {
this.saveItem(
{ appDirPic: res.data.url, isCurrent: 1 },
"tAppDirPic/save"
);
} else {
this.$message.error(res.message);
}
},
// 新增运行图片
uploadRunImg(res, file) {
if (res.resultCode === "200") {
this.saveItem(
{ appRunPic: res.data.url, isCurrent: 1 },
"tAppRunPic/save"
);
} else {
this.$message.error(res.message);
}
},
// 新增接口
saveItem(param, url) {
let _this = this;
_this
.$https(
{
url: url,
method: "post",
authType: this.backToken,
},
_this.$qs.stringify(param)
)
.then(
(res) => {
if (res.data.resultCode === "200") {
_this.$message.success(res.data.message);
this.getDirPicList();
this.getAppRunList();
} else {
_this.$message.error(res.data.message);
}
},
(error) => {
console.log(error);
}
);
},
// 修改当前项
submitForm() {
if(vm.radioPage !== undefined){
this.updateCurrent(this.pageList[vm.radioPage].id, "tAppDirPic/update");
}
if(vm.radioRun!== undefined){
this.updateCurrent(this.runList[vm.radioRun].id, "tAppRunPic/update");
}
},
updateCurrent(id, url) {
let vm = this;
let param = {
id: id,
isCurrent: 1,
};
vm.$https(
{
url: url,
method: "put",
authType: this.backToken,
},
vm.$qs.stringify(param)
)
.then((res) => {
if (res.data.resultCode === "200") {
this.$message.success("操作成功");
this.getDirPicList();
this.getAppRunList();
} else {
this.$message.error(res.data.message);
}
})
.catch(function (err) {
console.log(err);
});
},
// 取消
close() {
this.$router.go(-1);
},
},
};
</script>
<style lang="less" scoped>
.custom-page {
position: relative;
.page-title {
font-size: 20px;
color: #333333;
text-align: center;
padding-bottom: 20px;
border-bottom: 1px solid #eee;
}
.page-tip {
background: #f7f5f2;
border-radius: 8px;
padding: 16px 20px;
margin: 20px 0;
font-size: 14px;
color: #333333;
.tip-title {
font-weight: 700;
margin-right: 5px;
}
}
.page-content {
width: 800px;
margin: 0 auto;
.content-title {
display: flex;
justify-content: space-between;
padding: 20px;
.title {
position: relative;
font-size: 18px;
color: #333333;
&::before {
content: "";
position: absolute;
top: 6px;
left: -20px;
width: 4px;
height: 18px;
background: #000;
}
}
.el-button {
padding: 0 20px;
}
}
.swiper-content {
.swiper-item {
position: relative;
width: 100%;
height: 128px;
background-color: #99a9bf;
border-radius: 10px;
/deep/.el-radio {
position: absolute;
right: 12px;
top: 12px;
.el-radio__label {
display: none;
}
.el-radio__inner {
width: 24px;
height: 24px;
}
.el-radio__input.is-checked .el-radio__inner {
border-color: #ac9374;
background: #ac9374;
}
.el-radio__inner:hover {
border-color: #ac9374;
}
}
img {
width: 100%;
height: 100%;
}
}
.swiper-button-next {
right: 0;
}
.swiper-button-prev {
left: 0;
}
.swiper-button-prev,
.swiper-button-next {
background: #ac9374;
width: 36px;
height: 36px;
border-radius: 50%;
}
.swiper-button-next:after,
.swiper-button-prev:after {
font-size: 14px;
font-weight: 700;
color: #fff;
}
.swiper-slide {
text-align: center;
font-size: 18px;
background: #fff;
display: -webkit-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
-webkit-align-items: center;
align-items: center;
transition: 300ms;
transform: scale(0.8);
}
.swiper-slide-active,
.swiper-slide-duplicate-active {
transform: scale(1);
}
}
}
/deep/.el-upload-list {
display: none;
}
.footer-btn {
position: absolute;
bottom: 20px;
left: 0;
right: 0;
text-align: center;
padding-top: 20px;
border-top: 1px solid #eee;
.el-button {
width: 160px;
}
}
}
</style>
src/page/accounts/unitAdmin.vue
View file @ f9ecf430
<template>
<!-- 平台用户单位管理员账号管理 -->
<div class="user-wrapper height100">
<div class="search-container">
<el-form :inline="true" :model="form">
<el-form-item>
<el-input
v-model="form.userName"
placeholder="请输入管理员姓名"
suffix-icon="el-icon-search"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-select
v-model="form.orgId"
filterable
placeholder="请选择所属单位"
clearable>
<el-option
v-for="item in organList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-cascader
v-model="form.areaId"
change-on-select
:props="cascaderProps"
:options="areaOptions"
placeholder="请选择区域"
clearable>
</el-cascader>
</el-form-item>
<el-form-item>
<div class="btn-group">
<el-button type="primary" @click="handleSubmit">查询</el-button>
<el-button @click="handleReset">重置</el-button>
</div>
</el-form-item>
</el-form>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips"
>管理员姓名即管理员用户名。可以新增账号，“*”为必填项。可以对账号信息进行修改及重置密码</span
>
</div>
</div>
<div class="table-content">
<div class="btn-group">
<el-button type="primary" @click="handleAdd()">新建账号</el-button>
</div>
<account-table
:feildList="feildList"
:list="list"
@action="handleAction"
:currentPage="page._index"
/>
<party-pagination :page="page" @changePage="handleChangeCurrent" />
</div>
<add-dialog ref="addDialog" @success="getFirstPageList()" />
<edit-dialog ref="editDialog" @success="getFirstPageList()" />
<msg-dialog ref="msgDilaog" :msgInfo="msgInfo" />
</div>
</template>
<script>
import { partyPagination } from "@/components/index";
import accountTable from "./components/accountTable";
import { addDialog, editDialog } from "./unitAdminDialog";
import msgDialog from "./msgDialog.vue";
import { getAreas } from "@/config/area";
import { getOrgListWithOutPage } from "@/config/organ";
export default {
data() {
return {
form: {
userName: "",
orgId:'',
type: 2, //1.用户账号 2.平台单位单位管理员账号 3.机顶盒账号 4.运维账号
areaId:[]
},
feildList: [
{ prop: "userName", label: "管理员姓名" },
// { prop:'typeName', label: '管理员类型' },
{ prop: "phone", label: "手机号码" },
{ prop: "telephone", label: "固定电话" },
{ prop: "weChat", label: "微信号" },
{ prop: "email", label: "邮箱" },
{ prop: "orgName", label: "所属单位" },
{ prop: "exiredDate", label: "到期时间" },
{ prop: "statusName", label: "账号状态" },
{ prop: "", label: "操作", isEdit: true, width: 280 },
],
list: [],
page: {
_index: 1,
_size: 10,
total: 0,
},
activeRow: {},
msgInfo: {},
organList: [],
areaOptions: [],
cascaderProps: {
label: "name",
value: "code",
checkStrictly: true,
},
};
},
components: {
partyPagination,
accountTable,
addDialog,
editDialog,
msgDialog,
},
mounted() {
this.getOrgList();
this.getAreas();
this.getFirstPageList();
},
methods: {
// 获取区域数据
getAreas() {
getAreas().then((res) => {
this.areaOptions = res;
});
},
// 获取机构列表
getOrgList() {
getOrgListWithOutPage().then((res) => {
this.organList = res;
});
},
// 获取第一页数据列表
getFirstPageList() {
this.page._index = 1;
this.getPageList();
},
// 查询数据
handleSubmit() {
this.getFirstPageList();
},
// 重置查询
handleReset() {
this.form = {
userName: "",
orgId:'',
type:2,
areaId:[]
}
this.getFirstPageList();
},
getPageList() {
let requestParams = {};
requestParams._index = this.page._index;
requestParams._size = this.page._size;
requestParams.type = this.form.type;
if (this.form.userName) {
requestParams.userName = this.form.userName;
}
if (this.form.orgId) {
requestParams.orgId = this.form.orgId;
}
if(this.form.areaId.length>0){
requestParams.areaId = [...this.form.areaId].pop();
}
this.$https(
{
method: "get",
url: "tUser/getPageList",
authType: this.backToken,
},
requestParams
)
.then((res) => {
if (res.status != 200) {
this.getResWithOutData();
} else {
if (res.data.resultCode == 200) {
this.list = res.data.data.records;
this.page._size = res.data.data.size;
this.page.total = res.data.data.total;
} else {
this.getResWithOutData();
}
}
})
.catch((err) => {
console.log(err);
});
},
// 页面返回值为空
getResWithOutData(){
this.list = []
this.page = {
_index:1,
_size:10,
total:0
}
},
// 新增账号
handleAdd() {
this.$refs.addDialog.dialogVisible = true;
},
// 编辑
handleEdit() {
this.$refs.editDialog.id = this.activeRow.id;
this.$refs.editDialog.getDetailById();
this.$refs.editDialog.dialogVisible = true;
},
// 重置密码
handleResetPwd() {
let _this = this;
this.$https({
method: "put",
url: `tUser/resetPassword?userId=${this.activeRow.id}`,
authType: this.backToken,
})
.then((res) => {
if (res.status != 200) {
_this.$message.error(res.data.message);
} else {
if (res.data.resultCode == 200) {
_this.msgInfo = {
type: "success",
des: `用户${this.activeRow.userName}密码已重置！`,
};
_this.$refs.msgDilaog.dialogVisible = true;
} else {
_this.$message.error(res.data.message);
}
}
})
.catch((err) => {
console.log(err);
});
},
// 禁用
handleDisable() {
let _this = this;
this.$https({
method: "put",
url: `tUser/disable?userId=${this.activeRow.id}`,
authType: this.backToken,
})
.then((res) => {
if (res.status != 200) {
_this.$message.error(res.data.message);
} else {
if (res.data.resultCode == 200) {
_this.msgInfo = {
type: "wait",
des: `${this.activeRow.userName}账号禁用申请已提交，待审核…`,
};
_this.$refs.msgDilaog.dialogVisible = true;
_this.getPageList();
} else {
_this.$message.error(res.data.message);
}
}
})
.catch((err) => {
console.log(err);
});
},
// 激活
handleActive() {
let _this = this;
this.$https({
method: "put",
url: `tUser/enable?userId=${this.activeRow.id}`,
authType: this.backToken,
})
.then((res) => {
if (res.status != 200) {
_this.$message.error(res.data.message);
} else {
if (res.data.resultCode == 200) {
_this.msgInfo = {
type: "success",
des: `用户${this.activeRow.userName}账号激活成功！`,
};
_this.$refs.msgDilaog.dialogVisible = true;
_this.getPageList();
} else {
this.$message.error(res.data.message);
}
}
})
.catch((err) => {
console.log(err);
});
},
handleAction(params) {
this.activeRow = params.row;
switch (params.type) {
case "enable":
this.handleActive();
break;
case "disable":
this.handleDisable();
break;
case "reset":
this.handleResetPwd();
break;
case "edit":
this.handleEdit();
break;
default:
break;
}
},
// 翻页
handleChangeCurrent(val) {
this.page._index = val;
this.getPageList();
},
},
};
</script>
<style lang="less" scoped>
<template>
<!-- 平台用户单位管理员账号管理 -->
<div class="user-wrapper height100">
<div class="search-container">
<el-form :inline="true" :model="form">
<el-form-item>
<el-input
v-model="form.userName"
placeholder="请输入管理员姓名"
suffix-icon="el-icon-search"
clearable
></el-input>
</el-form-item>
<el-form-item>
<el-select
v-model="form.orgId"
filterable
placeholder="请选择所属单位"
clearable>
<el-option
v-for="item in organList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-cascader
v-model="form.areaId"
change-on-select
:props="cascaderProps"
:options="areaOptions"
placeholder="请选择区域"
clearable>
</el-cascader>
</el-form-item>
<el-form-item>
<div class="btn-group">
<el-button type="primary" @click="handleSubmit">查询</el-button>
<el-button @click="handleReset">重置</el-button>
</div>
</el-form-item>
</el-form>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips"
>管理员姓名即管理员用户名。可以新增账号，“*”为必填项。可以对账号信息进行修改及重置密码</span
>
</div>
</div>
<div class="table-content">
<div class="btn-group">
<el-button type="primary" @click="handleAdd()">新建账号</el-button>
</div>
<account-table
:feildList="feildList"
:list="list"
@action="handleAction"
:currentPage="page._index"
/>
<party-pagination :page="page" @changePage="handleChangeCurrent" />
</div>
<add-dialog ref="addDialog" @success="getFirstPageList()" />
<edit-dialog ref="editDialog" @success="getFirstPageList()" />
<msg-dialog ref="msgDilaog" :msgInfo="msgInfo" />
</div>
</template>
<script>
import { partyPagination } from "@/components/index";
import accountTable from "./components/accountTable";
import { addDialog, editDialog } from "./unitAdminDialog";
import msgDialog from "./msgDialog.vue";
import { getAreas } from "@/config/area";
import { getOrgListWithOutPage } from "@/config/organ";
export default {
data() {
return {
form: {
userName: "",
orgId:'',
type: 2, //1.用户账号 2.平台单位单位管理员账号 3.机顶盒账号 4.运维账号
areaId:[]
},
feildList: [
{ prop: "userName", label: "管理员姓名" },
{ prop:'roleName', label: '管理员类型' },
{ prop: "phone", label: "手机号码" },
{ prop: "telephone", label: "固定电话" },
{ prop: "weChat", label: "微信号" },
{ prop: "email", label: "邮箱" },
{ prop: "orgName", label: "所属单位" },
{ prop: "exiredDate", label: "到期时间" },
{ prop: "statusName", label: "账号状态" },
{ prop: "", label: "操作", isEdit: true, width: 280 },
],
list: [],
page: {
_index: 1,
_size: 10,
total: 0,
},
activeRow: {},
msgInfo: {},
organList: [],
areaOptions: [],
cascaderProps: {
label: "name",
value: "code",
checkStrictly: true,
},
};
},
components: {
partyPagination,
accountTable,
addDialog,
editDialog,
msgDialog,
},
mounted() {
this.getOrgList();
this.getAreas();
this.getFirstPageList();
},
methods: {
// 获取区域数据
getAreas() {
getAreas().then((res) => {
this.areaOptions = res;
});
},
// 获取机构列表
getOrgList() {
getOrgListWithOutPage().then((res) => {
this.organList = res;
});
},
// 获取第一页数据列表
getFirstPageList() {
this.page._index = 1;
this.getPageList();
},
// 查询数据
handleSubmit() {
this.getFirstPageList();
},
// 重置查询
handleReset() {
this.form = {
userName: "",
orgId:'',
type:2,
areaId:[]
}
this.getFirstPageList();
},
getPageList() {
let requestParams = {};
requestParams._index = this.page._index;
requestParams._size = this.page._size;
requestParams.type = this.form.type;
if (this.form.userName) {
requestParams.userName = this.form.userName;
}
if (this.form.orgId) {
requestParams.orgId = this.form.orgId;
}
if(this.form.areaId.length>0){
requestParams.areaId = [...this.form.areaId].pop();
}
this.$https(
{
method: "get",
url: "tUser/getPageList",
authType: this.backToken,
},
requestParams
)
.then((res) => {
// console.log(res)
if (res.status != 200) {
this.getResWithOutData();
} else {
if (res.data.resultCode == 200) {
this.list = res.data.data.records;
this.page._size = res.data.data.size;
this.page.total = res.data.data.total;
} else {
this.getResWithOutData();
}
}
})
.catch((err) => {
console.log(err);
});
},
// 页面返回值为空
getResWithOutData(){
this.list = []
this.page = {
_index:1,
_size:10,
total:0
}
},
// 新增账号
handleAdd() {
this.$refs.addDialog.dialogVisible = true;
},
// 编辑
handleEdit() {
this.$refs.editDialog.id = this.activeRow.id;
this.$refs.editDialog.getDetailById();
this.$refs.editDialog.dialogVisible = true;
},
// 重置密码
handleResetPwd() {
let _this = this;
this.$https({
method: "put",
url: `tUser/resetPassword?userId=${this.activeRow.id}`,
authType: this.backToken,
})
.then((res) => {
if (res.status != 200) {
_this.$message.error(res.data.message);
} else {
if (res.data.resultCode == 200) {
_this.msgInfo = {
type: "success",
des: `用户${this.activeRow.userName}密码已重置！`,
};
_this.$refs.msgDilaog.dialogVisible = true;
} else {
_this.$message.error(res.data.message);
}
}
})
.catch((err) => {
console.log(err);
});
},
// 禁用
handleDisable() {
let _this = this;
this.$https({
method: "put",
url: `tUser/disable?userId=${this.activeRow.id}`,
authType: this.backToken,
})
.then((res) => {
if (res.status != 200) {
_this.$message.error(res.data.message);
} else {
if (res.data.resultCode == 200) {
_this.msgInfo = {
type: "wait",
des: `${this.activeRow.userName}账号禁用申请已提交，待审核…`,
};
_this.$refs.msgDilaog.dialogVisible = true;
_this.getPageList();
} else {
_this.$message.error(res.data.message);
}
}
})
.catch((err) => {
console.log(err);
});
},
// 激活
handleActive() {
let _this = this;
this.$https({
method: "put",
url: `tUser/enable?userId=${this.activeRow.id}`,
authType: this.backToken,
})
.then((res) => {
if (res.status != 200) {
_this.$message.error(res.data.message);
} else {
if (res.data.resultCode == 200) {
_this.msgInfo = {
type: "success",
des: `用户${this.activeRow.userName}账号激活成功！`,
};
_this.$refs.msgDilaog.dialogVisible = true;
_this.getPageList();
} else {
this.$message.error(res.data.message);
}
}
})
.catch((err) => {
console.log(err);
});
},
handleAction(params) {
this.activeRow = params.row;
switch (params.type) {
case "enable":
this.handleActive();
break;
case "disable":
this.handleDisable();
break;
case "reset":
this.handleResetPwd();
break;
case "edit":
this.handleEdit();
break;
default:
break;
}
},
// 翻页
handleChangeCurrent(val) {
this.page._index = val;
this.getPageList();
},
},
};
</script>
<style lang="less" scoped>
</style>
\ No newline at end of file
src/page/accounts/unitAdminDialog/add.vue
View file @ f9ecf430
<template>
<el-dialog
custom-class="party-dialog"
title="新建账号"
:visible.sync="dialogVisible"
width="720px"
:before-close="handleClose"
>
<div class="dialog-content">
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="80px"
label-position="top"
class="party-form"
>
<div class="form-row">
<div>
<el-form-item label="管理员姓名" prop="userName">
<el-input
v-model="form.userName"
placeholder="请填写管理员姓名"
oninput="value = value.trim()"
></el-input>
</el-form-item>
<!-- <el-form-item label="管理员类型" prop="typeName">
<el-input
v-model="form.typeName"
placeholder="请填写管理员类型"
></el-input>
</el-form-item> -->
<el-form-item label="固定电话" prop="telephone">
<el-input
v-model="form.telephone"
placeholder="请填写固定电话"
></el-input>
</el-form-item>
<el-form-item label="单位名称" prop="orgId">
<el-select v-model="form.orgId" filterable placeholder="请选择">
<el-option
v-for="item in organList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="账号有效期" prop="permanent">
<el-radio-group v-model="form.permanent">
<el-radio :label="true">永久有效</el-radio>
<el-radio :label="false">设置有效期</el-radio>
</el-radio-group>
<div v-if="!form.permanent">
<el-date-picker
class="mt16"
v-model="form.date"
type="daterange"
value-format="yyyy-MM-dd"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</el-form-item>
</div>
<div>
<!-- <el-form-item label="管理员类型" prop="typeName">
<el-input
v-model="form.typeName"
placeholder="请填写管理员类型"
></el-input>
</el-form-item> -->
<el-form-item label="手机号码" prop="phone">
<el-input
v-model="form.phone"
placeholder="请填写手机号码"
></el-input>
</el-form-item>
<el-form-item label="微信" prop="wechat">
<el-input
v-model="form.weChat"
placeholder="请填写微信号"
></el-input>
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input
v-model="form.email"
placeholder="请填写邮箱地址"
></el-input>
</el-form-item>
</div>
</div>
</el-form>
</div>
<div slot="footer" class="dialog-footer btn-group">
<el-button @click="handleClose()">取 消</el-button>
<el-button type="primary" @click="handleSubmit()">确 定</el-button>
</div>
</el-dialog>
</template>
<script>
import { getOrgListWithOutPage } from "@/config/organ";
import { getRoles } from "@/config/roles";
export default {
data() {
var validateMobilePhone = (rule, value, callback) => {
if (value === "") {
callback(new Error("手机号不可为空"));
} else {
if (value !== "") {
var reg = /^1[3456789]\d{9}$/;
if (!reg.test(value)) {
callback(new Error("请输入有效的手机号码"));
}
}
callback();
}
};
return {
dialogVisible: false,
organList: [],
form: {
userName: "",
telephone: "",
orgId: "",
permanent: true,
date: "",
phone: "",
weChat: "",
email: "",
type: 2, //1.用户账号 2.平台单位管理员账号 3.机顶盒账号 4.运维账号
},
rules: {
userName: [
{ required: true, message: "请填写管理员姓名", trigger: "change" },
{ min: 1, max: 20, message: "请输入1到20个字" }
],
orgId: [
{ required: true, message: "请输入所在机构", trigger: "change" },
],
permanent: [
{ required: true, message: "请选择账号有效期", trigger: "change" },
],
phone: [
{ required: true, validator: validateMobilePhone, trigger: "change" },
],
},
};
},
mounted() {
this.getOrgList();
},
methods: {
// 获取机构列表
getOrgList() {
getOrgListWithOutPage().then((res) => {
this.organList = res;
});
},
// 弹窗关闭
handleClose() {
this.$confirm("确认关闭？")
.then((_) => {
this.handleReset();
})
.catch((_) => {});
},
handleReset() {
this.dialogVisible = false;
this.$refs.form.resetFields();
this.form = {
userName: "",
orgId: "",
permanent: true,
date: "",
roleList: [],
type: 2,
};
},
// 提交
handleSubmit() {
// 校验用户输入值
let _this = this;
this.$refs.form.validate((valid) => {
if (valid) {
let user = {};
if (!this.form.permanent && !this.form.date) {
this.$message.error("请选择有效期");
return false;
}
if (!this.form.permanent) {
user.effectiveDate = this.form.date[0];
user.exiredDate = this.form.date[1];
}
user.telephone = this.form.telephone || "";
user.email = this.form.email || "";
user.weChat = this.form.weChat || "";
user.phone = this.form.phone;
user.permanent = this.form.permanent;
user.userName = this.form.userName;
user.orgId = this.form.orgId;
user.type = this.form.type;
user.phone = this.form.phone;
this.$https(
{
method: "post",
url: "tUser/add",
authType: this.backToken,
},
user
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
this.$message({
type: "success",
message: res.data.message,
});
this.handleReset();
this.$emit("success", true);
} else {
this.$message.error(res.data.message);
}
} else {
this.$message.error(res.data);
}
})
.catch((err) => {
console.log(err);
});
} else {
console.log("error submit!!");
return false;
}
});
},
},
};
</script>
<style lang="less" scoped>
.form-row {
display: flex;
justify-content: space-between;
}
<template>
<el-dialog
custom-class="party-dialog"
title="新建账号"
:visible.sync="dialogVisible"
width="720px"
:before-close="handleClose"
>
<div class="dialog-content">
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="80px"
label-position="top"
class="party-form"
>
<div class="form-row">
<div>
<el-form-item label="管理员姓名" prop="userName">
<el-input
v-model="form.userName"
placeholder="请填写管理员姓名"
oninput="value = value.trim()"
></el-input>
</el-form-item>
<!-- <el-form-item label="管理员类型" prop="typeName">
<el-input
v-model="form.typeName"
placeholder="请填写管理员类型"
></el-input>
</el-form-item> -->
<el-form-item label="固定电话" prop="telephone">
<el-input
v-model="form.telephone"
placeholder="请填写固定电话"
></el-input>
</el-form-item>
<el-form-item label="单位名称" prop="orgId">
<el-select v-model="form.orgId" filterable placeholder="请选择">
<el-option
v-for="item in organList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="账号有效期" prop="permanent">
<el-radio-group v-model="form.permanent">
<el-radio :label="true">永久有效</el-radio>
<el-radio :label="false">设置有效期</el-radio>
</el-radio-group>
<div v-if="!form.permanent">
<el-date-picker
class="mt16"
v-model="form.date"
type="daterange"
value-format="yyyy-MM-dd"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</el-form-item>
</div>
<div>
<el-form-item label="管理员类型" prop="roleId">
<el-select v-model="form.roleId" placeholder="请选择管理员类型">
<el-option
v-for="item in typeList"
:key="item.id"
:label="item.value"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="手机号码" prop="phone">
<el-input
v-model="form.phone"
placeholder="请填写手机号码"
></el-input>
</el-form-item>
<el-form-item label="微信" prop="wechat">
<el-input
v-model="form.weChat"
placeholder="请填写微信号"
></el-input>
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input
v-model="form.email"
placeholder="请填写邮箱地址"
></el-input>
</el-form-item>
</div>
</div>
</el-form>
</div>
<div slot="footer" class="dialog-footer btn-group">
<el-button @click="handleClose()">取 消</el-button>
<el-button type="primary" @click="handleSubmit()">确 定</el-button>
</div>
</el-dialog>
</template>
<script>
import { getOrgListWithOutPage } from "@/config/organ";
import { getRoles } from "@/config/roles";
export default {
data() {
var validateMobilePhone = (rule, value, callback) => {
if (value === "") {
callback(new Error("手机号不可为空"));
} else {
if (value !== "") {
var reg = /^1[3456789]\d{9}$/;
if (!reg.test(value)) {
callback(new Error("请输入有效的手机号码"));
}
}
callback();
}
};
return {
dialogVisible: false,
organList: [],
typeList: [{id:2, value:'单位管理员'},{id:17, value: '互动审核员'}],
form: {
userName: "",
telephone: "",
orgId: "",
permanent: true,
date: "",
phone: "",
weChat: "",
email: "",
type: 2, //1.用户账号 2.平台单位管理员账号 3.机顶盒账号 4.运维账号
roleId: ''
},
rules: {
roleId: [
{ required: true, message: "请选择管理员类型", trigger: "change" },
],
userName: [
{ required: true, message: "请填写管理员姓名", trigger: "change" },
{ min: 1, max: 20, message: "请输入1到20个字" }
],
orgId: [
{ required: true, message: "请输入所在机构", trigger: "change" },
],
permanent: [
{ required: true, message: "请选择账号有效期", trigger: "change" },
],
phone: [
{ required: true, validator: validateMobilePhone, trigger: "change" },
],
},
};
},
mounted() {
this.getOrgList();
},
methods: {
// 获取机构列表
getOrgList() {
getOrgListWithOutPage().then((res) => {
this.organList = res;
});
},
// 弹窗关闭
handleClose() {
this.$confirm("确认关闭？")
.then((_) => {
this.handleReset();
})
.catch((_) => {});
},
handleReset() {
this.dialogVisible = false;
this.$refs.form.resetFields();
this.form = {
userName: "",
orgId: "",
permanent: true,
date: "",
roleList: [],
type: 2,
roleId:''
};
},
// 提交
handleSubmit() {
// 校验用户输入值
let _this = this;
this.$refs.form.validate((valid) => {
if (valid) {
let user = {};
if (!this.form.permanent && !this.form.date) {
this.$message.error("请选择有效期");
return false;
}
if (!this.form.permanent) {
user.effectiveDate = this.form.date[0];
user.exiredDate = this.form.date[1];
}
user.telephone = this.form.telephone || "";
user.email = this.form.email || "";
user.weChat = this.form.weChat || "";
user.phone = this.form.phone;
user.permanent = this.form.permanent;
user.userName = this.form.userName;
user.orgId = this.form.orgId;
user.type = this.form.type;
user.phone = this.form.phone;
user.roleId = this.form.roleId
this.$https(
{
method: "post",
url: "tUser/add",
authType: this.backToken,
},
user
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
this.$message({
type: "success",
message: res.data.message,
});
this.handleReset();
this.$emit("success", true);
} else {
this.$message.error(res.data.message);
}
} else {
this.$message.error(res.data);
}
})
.catch((err) => {
console.log(err);
});
} else {
console.log("error submit!!");
return false;
}
});
},
},
};
</script>
<style lang="less" scoped>
.form-row {
display: flex;
justify-content: space-between;
}
</style>
\ No newline at end of file
src/page/accounts/unitAdminDialog/edit.vue
View file @ f9ecf430
<template>
<el-dialog
custom-class="party-dialog"
title="编辑账号"
:visible.sync="dialogVisible"
width="720px"
:before-close="handleClose"
>
<div class="dialog-content">
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="80px"
label-position="top"
class="party-form"
>
<div class="form-row">
<div>
<el-form-item label="管理员姓名" prop="userName">
<el-input
v-model="form.userName"
placeholder="请填写管理员姓名"
oninput="value = value.trim()"
></el-input>
</el-form-item>
<!-- <el-form-item label="管理员类型" prop="typeName">
<el-input
v-model="form.typeName"
placeholder="请填写管理员类型"
></el-input>
</el-form-item> -->
<el-form-item label="固定电话" prop="telephone">
<el-input
v-model="form.telephone"
placeholder="请填写固定电话"
></el-input>
</el-form-item>
<el-form-item label="单位名称" prop="orgId">
<el-select v-model="form.orgId" filterable placeholder="请选择">
<el-option
v-for="item in organList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="账号有效期" prop="permanent">
<el-radio-group v-model="form.permanent">
<el-radio :label="true">永久有效</el-radio>
<el-radio :label="false">设置有效期</el-radio>
</el-radio-group>
<div v-if="!form.permanent">
<el-date-picker
class="mt16"
v-model="form.date"
type="daterange"
value-format="yyyy-MM-dd"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</el-form-item>
</div>
<div>
<el-form-item label="手机号码" prop="phone">
<el-input
v-model="form.phone"
placeholder="请填写手机号码"
></el-input>
</el-form-item>
<el-form-item label="微信" prop="wechat">
<el-input
v-model="form.weChat"
placeholder="请填写微信号"
></el-input>
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input
v-model="form.email"
placeholder="请填写邮箱地址"
></el-input>
</el-form-item>
</div>
</div>
</el-form>
</div>
<div slot="footer" class="dialog-footer btn-group">
<el-button @click="handleClose()">取 消</el-button>
<el-button type="primary" @click="handleSubmit()">确 定</el-button>
</div>
</el-dialog>
</template>
<script>
import { getOrgListWithOutPage } from "@/config/organ";
export default {
data() {
var validateMobilePhone = (rule, value, callback) => {
if (value === "") {
callback(new Error("手机号不可为空"));
} else {
if (value !== "") {
var reg = /^1[3456789]\d{9}$/;
if (!reg.test(value)) {
callback(new Error("请输入有效的手机号码"));
}
}
callback();
}
};
return {
dialogVisible: false,
organList: [],
rolesList: [],
id: "",
form: {
id: "",
userName: "",
telephone: "",
orgId: "",
permanent: true,
date: "",
phone: "",
weChat: "",
email: "",
roleList: [],
type: 2, //1.用户账号 2.平台单位管理员账号 3.机顶盒账号 4.运维账号
},
rules: {
userName: [
{ required: true, message: "请选择系统用户名", trigger: "change" },
{ min: 1, max: 20, message: "请输入1到20个字" },
],
orgId: [
{ required: true, message: "请输入所在机构", trigger: "change" },
],
permanent: [
{ required: true, message: "请选择账号有效期", trigger: "change" },
],
roleList: [
{
type: "array",
required: true,
message: "请选择账号类型",
trigger: "change",
},
],
},
};
},
mounted() {
this.getOrgList();
},
methods: {
// 获取机构列表
getOrgList() {
getOrgListWithOutPage().then((res) => {
this.organList = res;
});
},
// 根据id获取获取详情内容
getDetailById() {
let _this = this;
this.$https(
{
method: "get",
url: "tUser/getById",
authType: this.backToken,
},
{ id: _this.id }
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
let resData = res.data.data;
for (let key in _this.form) {
this.form[key] = resData[key];
}
if (!this.form.permanent) {
this.form.date = [resData.effectiveDate, resData.exiredDate];
}
} else {
_this.$message.error(res.data.message);
}
} else {
_this.$message.error(res.data);
}
})
.catch((err) => {
console.log(err);
});
},
// 弹窗关闭
handleClose() {
this.$confirm("确认关闭？")
.then((_) => {
this.handleReset();
})
.catch((_) => {});
},
handleReset() {
this.dialogVisible = false;
this.$refs.form.resetFields();
this.form = {
userName: "",
orgId: "",
phone: "",
permanent: true,
date: "",
roleList: [],
type: 2,
};
},
// 提交
handleSubmit() {
// 校验用户输入值
let _this = this;
_this.$refs.form.validate((valid) => {
if (valid) {
let user = {};
if (!_this.form.permanent && !_this.form.date) {
_this.$message.error("请选择有效期");
return false;
}
if (!_this.form.permanent) {
user.effectiveDate = _this.form.date[0];
user.exiredDate = _this.form.date[1];
}
user.id = _this.id;
user.telephone = this.form.telephone || "";
user.email = this.form.email || "";
user.weChat = this.form.weChat || "";
user.phone = this.form.phone;
user.permanent = this.form.permanent;
user.userName = this.form.userName;
user.orgId = this.form.orgId;
user.type = this.form.type;
this.$https(
{
method: "put",
url: "tUser/update",
authType: _this.backToken,
},
user
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
this.$message({
type: "success",
message: res.data.message,
});
_this.dialogVisible = false;
this.$emit("success", true);
} else {
this.$message.error(res.data.message);
this.$emit("success", false);
}
} else {
this.$message.error(res.data);
this.$emit("success", false);
}
})
.catch((err) => {
console.log(err);
});
} else {
console.log("error submit!!");
return false;
}
});
},
},
};
</script>
<style lang="less" scoped>
.form-row {
display: flex;
justify-content: space-between;
}
<template>
<el-dialog
custom-class="party-dialog"
title="编辑账号"
:visible.sync="dialogVisible"
width="720px"
:before-close="handleClose"
>
<div class="dialog-content">
<el-form
ref="form"
:model="form"
:rules="rules"
label-width="80px"
label-position="top"
class="party-form"
>
<div class="form-row">
<div>
<el-form-item label="管理员姓名" prop="userName">
<el-input
v-model="form.userName"
placeholder="请填写管理员姓名"
oninput="value = value.trim()"
></el-input>
</el-form-item>
<el-form-item label="固定电话" prop="telephone">
<el-input
v-model="form.telephone"
placeholder="请填写固定电话"
></el-input>
</el-form-item>
<el-form-item label="单位名称" prop="orgId">
<el-select v-model="form.orgId" filterable placeholder="请选择">
<el-option
v-for="item in organList"
:key="item.id"
:label="item.name"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="账号有效期" prop="permanent">
<el-radio-group v-model="form.permanent">
<el-radio :label="true">永久有效</el-radio>
<el-radio :label="false">设置有效期</el-radio>
</el-radio-group>
<div v-if="!form.permanent">
<el-date-picker
class="mt16"
v-model="form.date"
type="daterange"
value-format="yyyy-MM-dd"
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
>
</el-date-picker>
</div>
</el-form-item>
</div>
<div>
<el-form-item label="管理员类型" prop="roleId">
<el-select v-model="form.roleId" placeholder="请选择管理员类型">
<el-option
v-for="item in typeList"
:key="item.id"
:label="item.value"
:value="item.id"
>
</el-option>
</el-select>
</el-form-item>
<el-form-item label="手机号码" prop="phone">
<el-input
v-model="form.phone"
placeholder="请填写手机号码"
></el-input>
</el-form-item>
<el-form-item label="微信" prop="wechat">
<el-input
v-model="form.weChat"
placeholder="请填写微信号"
></el-input>
</el-form-item>
<el-form-item label="邮箱" prop="email">
<el-input
v-model="form.email"
placeholder="请填写邮箱地址"
></el-input>
</el-form-item>
</div>
</div>
</el-form>
</div>
<div slot="footer" class="dialog-footer btn-group">
<el-button @click="handleClose()">取 消</el-button>
<el-button type="primary" @click="handleSubmit()">确 定</el-button>
</div>
</el-dialog>
</template>
<script>
import { getOrgListWithOutPage } from "@/config/organ";
export default {
data() {
var validateMobilePhone = (rule, value, callback) => {
if (value === "") {
callback(new Error("手机号不可为空"));
} else {
if (value !== "") {
var reg = /^1[3456789]\d{9}$/;
if (!reg.test(value)) {
callback(new Error("请输入有效的手机号码"));
}
}
callback();
}
};
return {
dialogVisible: false,
organList: [],
rolesList: [],
id: "",
form: {
id: "",
userName: "",
telephone: "",
orgId: "",
permanent: true,
date: "",
phone: "",
weChat: "",
email: "",
roleId:null,
// roleList: [],
type: 2, //1.用户账号 2.平台单位管理员账号 3.机顶盒账号 4.运维账号
},
typeList: [{id:2, value:'单位管理员'},{id:17, value: '互动审核员'}],
rules: {
roleId: [
{ required: true, message: "请选择管理员类型", trigger: "change" },
],
userName: [
{ required: true, message: "请输入管理员姓名", trigger: "change" },
{ min: 1, max: 20, message: "请输入1到20个字" },
],
orgId: [
{ required: true, message: "请输入所在机构", trigger: "change" },
],
permanent: [
{ required: true, message: "请选择账号有效期", trigger: "change" },
],
phone: [
{ required: true, validator: validateMobilePhone, trigger: "change" },
],
roleList: [
{
type: "array",
required: true,
message: "请选择账号类型",
trigger: "change",
},
],
},
};
},
mounted() {
this.getOrgList();
},
methods: {
// 获取机构列表
getOrgList() {
getOrgListWithOutPage().then((res) => {
this.organList = res;
});
},
// 根据id获取获取详情内容
getDetailById() {
let _this = this;
this.$https(
{
method: "get",
url: "tUser/getById",
authType: this.backToken,
},
{ id: _this.id }
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
// console.log(1111,+res.data.data.roleList[0])
// this.form.roleId = +res.data.data.roleList[0]
let resData = res.data.data;
for (let key in _this.form) {
this.form[key] = resData[key];
}
if (!this.form.permanent) {
this.form.date = [resData.effectiveDate, resData.exiredDate];
}
} else {
_this.$message.error(res.data.message);
}
this.form.roleId = +res.data.data.roleList[0]
} else {
_this.$message.error(res.data);
}
})
.catch((err) => {
console.log(err);
});
},
// 弹窗关闭
handleClose() {
this.$confirm("确认关闭？")
.then((_) => {
this.handleReset();
})
.catch((_) => {});
},
handleReset() {
this.dialogVisible = false;
this.$refs.form.resetFields();
this.form = {
userName: "",
orgId: "",
phone: "",
permanent: true,
date: "",
roleList: [],
roleId:null,
type: 2,
};
},
// 提交
handleSubmit() {
// 校验用户输入值
let _this = this;
_this.$refs.form.validate((valid) => {
if (valid) {
let user = {};
if (!_this.form.permanent && !_this.form.date) {
_this.$message.error("请选择有效期");
return false;
}
if (!_this.form.permanent) {
user.effectiveDate = _this.form.date[0];
user.exiredDate = _this.form.date[1];
}
user.id = _this.id;
user.telephone = this.form.telephone || "";
user.email = this.form.email || "";
user.weChat = this.form.weChat || "";
user.phone = this.form.phone;
user.permanent = this.form.permanent;
user.userName = this.form.userName;
user.orgId = this.form.orgId;
user.type = this.form.type;
user.roleId = this.form.roleId
this.$https(
{
method: "put",
url: "tUser/update",
authType: _this.backToken,
},
user
)
.then((res) => {
if (res.status == 200) {
if (res.data.resultCode == 200) {
this.$message({
type: "success",
message: res.data.message,
});
_this.dialogVisible = false;
this.$emit("success", true);
} else {
this.$message.error(res.data.message);
this.$emit("success", false);
}
} else {
this.$message.error(res.data);
this.$emit("success", false);
}
})
.catch((err) => {
console.log(err);
});
} else {
console.log("error submit!!");
return false;
}
});
},
},
};
</script>
<style lang="less" scoped>
.form-row {
display: flex;
justify-content: space-between;
}
</style>
\ No newline at end of file
src/page/content/components/uploadVue/uploadImg.vue
View file @ f9ecf430
<template>
<div>
<el-upload
accept=".jpg,.jpeg,.png.JPG,.JPEG,.PNG"
:class="{disabled:uploadDisabled}"
action="http://111.203.232.175:8088/mall/file/image/upload"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:on-success="handleAvatarSuccess"
:headers="headers"
:file-list="fileList"
:limit="1"
:multiple ="false"
>
<i class="el-icon-plus"></i>
<div slot="tip" class="el-upload__tip color_red">只能上传.jpg/.jpeg/.png文件</div>
</el-upload>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt />
</el-dialog>
</div>
</template>
<script>
export default {
props:{
fileList:{
type:Array,
default:[]
},
},
data() {
return {
dialogImageUrl: "",
dialogVisible: false,
imageUrl:""
};
},
computed: {
headers() {
return {
Authorization: localStorage.getItem("backToken") || "",
};
},
uploadDisabled:function() {
return (this.fileList.length>0)||this.imageUrl
},
},
methods: {
// 图片上传成功的返回值
handleAvatarSuccess(res, file) {
if (res.resultCode == 200) {
this.$emit("imgUrl", res.data.url);
this.imageUrl = res.data.url;
} else {
this.$message.error(res.message);
}
},
handleRemove(file, fileList) {
this.$emit("imgUrl", "");
this.imageUrl=""
this.fileList=[]
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
showImg(cover) {
let file = {
name: "",
url: cover,
};
this.fileList = [file]
},
},
};
</script>
<style lang="less">
.avatar {
width: 100%;
height: 100%;
}
.color_red{
color:red;
}
.disabled .el-upload--picture-card {
display: none;
}
</style>
<template>
<div>
<el-upload
accept=".jpg,.jpeg,.png.JPG,.JPEG,.PNG"
:class="{disabled:uploadDisabled}"
action="http://111.203.232.175:8088/mall/file/image/upload"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:on-success="handleAvatarSuccess"
:headers="headers"
:file-list="fileList"
:limit="1"
:multiple ="false"
>
<i class="el-icon-plus"></i>
<div slot="tip" class="el-upload__tip color_red">只能上传.jpg/.jpeg/.png文件</div>
</el-upload>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt />
</el-dialog>
</div>
</template>
<script>
export default {
props:{
fileList:{
type:Array,
default:[]
},
},
data() {
return {
dialogImageUrl: "",
dialogVisible: false,
imageUrl:""
};
},
computed: {
headers() {
return {
Authorization: localStorage.getItem("backToken") || "",
};
},
uploadDisabled:function() {
return (this.fileList.length>0)||this.imageUrl
},
},
methods: {
// 图片上传成功的返回值
handleAvatarSuccess(res, file) {
if (res.resultCode == 200) {
this.$emit("imgUrl", res.data.url);
this.imageUrl = res.data.url;
} else {
this.$message.error(res.message);
}
},
handleRemove(file, fileList) {
this.$emit("imgUrl", "");
this.imageUrl=""
this.fileList=[]
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
},
showImg(cover) {
let file = {
name: "",
url: cover,
};
this.fileList = [file]
},
},
};
</script>
<style lang="less">
.avatar {
width: 100%;
height: 100%;
}
.color_red{
color:red;
}
.disabled .el-upload--picture-card {
display: none;
}
</style>
src/page/content/components/uploadVue/uploadQrcode.vue
View file @ f9ecf430
<template>
<div>
<el-upload
accept=".jpg,.jpeg,.png,.JPG,.JPEG,.PBG"
:class="{disabled:uploadDisabled}"
action="http://111.203.232.175:8088/mall/file/image/upload"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:on-success="handleAvatarSuccess"
:headers="headers"
:file-list="fileList"
:limit="1"
:multiple ="false"
>
<i class="el-icon-plus"></i>
<div slot="tip" class="el-upload__tip color_red">只能上传.jpg/.jpeg/.png文件</div>
</el-upload>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt />
</el-dialog>
</div>
</template>
<script>
export default {
props:{
fileList:{
type:Array,
default:[
{
name: "",
url: "",
},
]
},
},
data() {
return {
dialogImageUrl: "",
dialogVisible: false,
imageUrl:""
};
},
computed: {
headers() {
// return { 'token': this.backToken }
return {'Authorization':localStorage.getItem('backToken')}
},
uploadDisabled:function() {
return (this.fileList.length>0)||this.imageUrl
},
},
methods: {
// 图片上传成功的返回值
handleAvatarSuccess(res, file) {
// this.$emit('qrcodeUrl', res.data.url)
if (res.resultCode == 200) {
this.$emit('qrcodeUrl', res.data.url)
this.imageUrl = res.data.url;
} else {
this.$message.error(res.message);
}
},
handleRemove(file, fileList) {
console.log(file, fileList);
this.$emit("qrcodeUrl", "");
this.imageUrl=""
this.fileList=[]
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
}
}
};
</script>
<style>
.color_red{
color:red;
}
.disabled .el-upload--picture-card {
display: none;
}
</style>
<template>
<div>
<el-upload
accept=".jpg,.jpeg,.png,.JPG,.JPEG,.PBG"
:class="{disabled:uploadDisabled}"
action="http://111.203.232.175:8088/mall/file/image/upload"
list-type="picture-card"
:on-preview="handlePictureCardPreview"
:on-remove="handleRemove"
:on-success="handleAvatarSuccess"
:headers="headers"
:file-list="fileList"
:limit="1"
:multiple ="false"
>
<i class="el-icon-plus"></i>
<div slot="tip" class="el-upload__tip color_red">只能上传.jpg/.jpeg/.png文件</div>
</el-upload>
<el-dialog :visible.sync="dialogVisible">
<img width="100%" :src="dialogImageUrl" alt />
</el-dialog>
</div>
</template>
<script>
export default {
props:{
fileList:{
type:Array,
default:[
{
name: "",
url: "",
},
]
},
},
data() {
return {
dialogImageUrl: "",
dialogVisible: false,
imageUrl:""
};
},
computed: {
headers() {
// return { 'token': this.backToken }
return {'Authorization':localStorage.getItem('backToken')}
},
uploadDisabled:function() {
return (this.fileList.length>0)||this.imageUrl
},
},
methods: {
// 图片上传成功的返回值
handleAvatarSuccess(res, file) {
// this.$emit('qrcodeUrl', res.data.url)
if (res.resultCode == 200) {
this.$emit('qrcodeUrl', res.data.url)
this.imageUrl = res.data.url;
} else {
this.$message.error(res.message);
}
},
handleRemove(file, fileList) {
console.log(file, fileList);
this.$emit("qrcodeUrl", "");
this.imageUrl=""
this.fileList=[]
},
handlePictureCardPreview(file) {
this.dialogImageUrl = file.url;
this.dialogVisible = true;
}
}
};
</script>
<style>
.color_red{
color:red;
}
.disabled .el-upload--picture-card {
display: none;
}
</style>
src/page/content/video/remit/index.vue
View file @ f9ecf430
<template>
<div class="listPage H100">
<div class="search-container">
<el-form :inline="true" :model="form" class="search-form" onsubmit="return false;">
<el-form-item label="">
<el-input
placeholder="请输入视频名称"
v-model="form.nameOrCode"
@keyup.enter.native="Search"
clearable
></el-input>
</el-form-item>
<el-form-item label="">
<el-select
placeholder="请选择视频版权方"
@focus="getAssetCopyrightData"
v-model="form.videoContentCopyrightOwnerId"
clearable
>
<el-option
v-for="item in copyrightOwner"
:label="item.name"
:value="item.id"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-select
placeholder="请选择预设视频分类"
@focus="getAssetTypeData"
v-model="form.videoContentCatId"
clearable
>
<el-option
v-for="item in videoContentCat"
:label="item.name"
:value="item.id"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<div class="btn-group">
<el-button size="mini" type="primary" class="btn_form_search" @click="Search">查询</el-button>
<el-button size="mini" class="btn_form_search" @click="Reset">重置</el-button>
</div>
</el-form-item>
</el-form>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips">可使用版权方、视频分类、视频名称模糊搜索对需要汇出的视频进行快速检索，下载至本地。</span>
</div>
</div>
<div class="table-content">
<div class="btn-group">
<el-button type="primary" @click="downloadCipher()">导出加密文件</el-button>
<el-button type="primary" @click="multipleRemitGet()">汇出</el-button>
<!-- <el-button type="primary" @click="multipleRemit()">汇出</el-button> -->
</div>
<div class="party-table">
<el-table
border
style="width: 100%;height:100%"
height="100%"
ref="multipleTable"
:data="tableData"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" width="120" label="序号">
<template slot-scope="scope">
<span>{{ (page.currentPage - 1) * 10 + scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="视频名称" prop="fileName"></el-table-column>
<el-table-column label="版权方" prop="videoContentCopyrightOwnerName"></el-table-column>
<el-table-column label="视频类别" prop="videoContentCatName"></el-table-column>
</el-table>
</div>
<div class="partyt-pagination">
<el-pagination
@current-change="handleCurrentChange"
:current-page="page.currentPage"
:page-size="page.pageSize"
layout="prev, pager, next, jumper"
:total="page.total"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
import axios from 'axios'
export default {
data() {
var checkIsNull = (rule, value, callback) => {
if (value) {
if (value.trim() == "") {
callback(new Error("不允许只输入空格"));
} else {
callback();
}
}
};
return {
nowDate: "", // 当前日期
fullscreenLoading: false,
copyrightOwner:[],
videoContentCat:[],
type: true,
value1: "",
page: { currentPage: 1, pageSize: 10, total: 0 },
tableData: [],
FormVisible: false,
FormVisible1: false,
formLabelWidth: "100px",
form: {
nameOrCode: ""
},
editform: {
menuName: "",
menuUrl: "",
parentId: "",
sort: "",
id: ""
},
classForm: {
menuName: "",
menuUrl: "",
parentId: "",
sort: ""
},
typeList: [],
rules: {
sort: [
{ required: true, message: "请输入顺序值", trigger: "change" },
{ pattern: /^(\d{1,5})?$/, message: "排序值为低于5位数的纯数字" }
],
menuName: [
{ required: true, message: "请输入菜单名称", trigger: "change" },
{ max: 20, message: "不能超过20个字符", trigger: "change" },
{ validator: checkIsNull, trigger: "blur" }
],
menuUrl: [
{ required: true, message: "请输入菜单地址", trigger: "change" },
{ validator: checkIsNull, trigger: "blur" }
],
parentId: [
{ required: true, message: "请输入父级菜单", trigger: "change" }
]
},
value: "",
name: ""
};
},
computed: {},
mounted() {
this.onSearch();
// this.getPermis();
},
components: {},
methods: {
formatDate() {
let date = new Date();
let year = date.getFullYear(); // 年
let month = date.getMonth() + 1; // 月
let day = date.getDate(); // 日
let week = date.getDay(); // 星期
let weekArr = [ "星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六" ];
let hour = date.getHours(); // 时
hour = hour < 10 ? "0" + hour : hour; // 如果只有一位，则前面补零
let minute = date.getMinutes(); // 分
minute = minute < 10 ? "0" + minute : minute; // 如果只有一位，则前面补零
let second = date.getSeconds(); // 秒
second = second < 10 ? "0" + second : second; // 如果只有一位，则前面补零
this.nowDate = `${year}${month}${day}}`;
},
// 获取展板分类列表
getAssetCopyrightData(){
let vm = this;
vm.$https({
url: "copyrightOwner/getList",
method: "get",
authType: this.backToken
},
{copyrightOwnerType:'VIDEO_CONTENT'})
.then(res => {
let data = res.data.data;
this.copyrightOwner = data;
})
.catch(function(err) {
console.log(err);
});
},
// 获取视频分类列表
getAssetTypeData() {
let vm = this;
vm.$https({
url: "videoContentCat/getList",
method: "get",
authType: this.backToken
})
.then(res => {
let data = res.data.data;
this.videoContentCat = data;
})
.catch(function(err) {
console.log(err);
});
},
// 渲染父级权限
getPermis() {
let vm = this;
vm.$https({
method: "get",
url: "menu/getRoleMenu?roleId=" + sessionStorage.getItem("roleId"),
authType: this.backToken
}).then(
res => {
let data = res.data;
vm.typeList = data.map((e, i) => {
return {
id: e.id,
name:
e.menuName.indexOf("-") == -1
? e.menuName
: e.menuName.split("-")[1]
};
});
},
error => {
console.log(error);
}
);
},
// 获得数据接口
getTableData(param) {
let vm = this;
vm.$https(
{
url: "asset/getPageList",
method: "post",
authType: this.backToken
},
vm.$qs.stringify(param)
// param
)
.then(res => {
let data = res.data.data;
vm.page.pageSize = data.size;
vm.page.total = data.total;
vm.tableData = data.records;
})
.catch(function(err) {
console.log(err);
});
},
// 分页
handleCurrentChange(val) {
let _this = this;
_this.page.currentPage = val;
_this.onSearch();
},
onSearch() {
let _this = this;
let param = _this.getSearchQuery();
_this.getTableData(param);
},
// 重置
Reset(){
this.form = {}
this.Search()
},
Search() {
let _this = this;
_this.page.currentPage = 1;
let searchObj = {
_index: 1,
_size: _this.page.pageSize,
nameOrCode: _this.form.nameOrCode,
videoContentCatId:_this.form.videoContentCatId,
videoContentCopyrightOwnerId:_this.form.videoContentCopyrightOwnerId
};
this.getTableData(searchObj);
},
// // 获取当前查询参数
getSearchQuery() {
let _this = this;
let searchObj = {
_index: _this.page.currentPage,
_size: _this.page.pageSize
};
for (let key in _this.form) {
if (_this.form[key]) {
searchObj[key] = _this.form[key];
}
}
return searchObj;
},
// 批量操作
handleSelectionChange(selection) {
let _this = this;
_this.selection = selection;
},
getMultipleSelect() {
let _this = this;
let arr = [];
let str = "";
if (_this.selection) {
_this.selection.forEach(function(e) {
arr.push(e.id);
});
str = arr.join(",");
// str = arr;
} else {
str = "";
// str = [];
}
return str;
},
// 汇出
multipleRemit() {
let _this = this;
let str = _this.getMultipleSelect();
// console.log(str)
if (str.length > 0) {
console.log(str);
_this.$https({
url: "asset/download",
method: "post",
authType: this.backToken
},
// {idList:str}
_this.$qs.stringify({idList:str})
)
.then(
res => {
const blob = new Blob([res.data], {
type:
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'"
})
const downloadElement = document.createElement('a')
const contentDisposition = res.headers['content-disposition']
const patt = new RegExp('filename=([^;]+\\.[^\\.;]+);*')
const result = patt.exec(contentDisposition)
const filename = decodeURI(result[1])
const href = window.URL.createObjectURL(blob) // 创建下载的链接
downloadElement.href = href
downloadElement.download = filename // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click() // 点击下载
document.body.removeChild(downloadElement) // 下载完成移除元素
window.URL.revokeObjectURL(href) // 释放blob对象
},
error => {}
);
} else {
this.$message({
type: "info",
message: "请至少选择一个选项！"
});
}
},
openFullScreen2() {
this.formatDate()
const loading = this.$loading({
lock: true,
text: '下载中，请稍候。。。',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
// setTimeout(() => {
// loading.close();
// }, 2000);
},
// 导出机顶盒文件加密秘钥
downloadCipher(){
const loading = this.$loading({
lock: true,
text: '下载中，请稍候。。。',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
axios({
method: "get",
url: 'http://111.203.232.175:8088/mall/asset/downloadCipher',
params: {
// idList:str
},
headers: {
"Authorization": localStorage.getItem("backToken") || "",
},
responseType: "blob",
}).then(res => {
console.log(res)
loading.close();
let blobUrl = window.URL.createObjectURL(res.data);
const aElement = document.createElement("a");
aElement.href = blobUrl;
// aElement.download = res.data.fileName;
aElement.download = '密钥.zip';
aElement.click();
window.URL.revokeObjectURL(blobUrl);
})
},
// get测试
multipleRemitGet() {
let _this = this;
let str = _this.getMultipleSelect();
if(str){
const loading = this.$loading({
lock: true,
text: '下载中，请稍候。。。',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
axios({
method: "get",
url: 'http://111.203.232.175:8088/mall/asset/download',
params: {
// idList: "1382697227765313538"
idList:str
},
headers: {
"Authorization": localStorage.getItem("backToken") || "",
},
responseType: "blob",
}).then(res => {
console.log(res)
loading.close();
let blobUrl = window.URL.createObjectURL(res.data);
const aElement = document.createElement("a");
aElement.href = blobUrl;
// aElement.download = res.data.fileName;
aElement.download = _this.nowDate + '视频集.zip';
aElement.click();
window.URL.revokeObjectURL(blobUrl);
})
}else{
this.$message({
type: "info",
message: "请至少选择一个选项！"
});
}
// let _this = this;
// let str = _this.getMultipleSelect();
// console.log(str);
// _this.$https({
// url: "asset/download",
// method: "get",
// authType: this.backToken,
// // dataType: 'json',
// // responseType: 'arraybuffer' // 该条件是重点
// responseType: 'blob'
// },
// {idList:'1382697227765313538'}
// )
// .then(
// res => {
// let blobUrl = window.URL.createObjectURL(res.data);
// const aElement = document.createElement("a");
// aElement.href = blobUrl;
// aElement.download = 'aaaa.zip';
// aElement.click();
// window.URL.revokeObjectURL(blobUrl);
// const content = res
// const blob = new Blob([content])
// const fileName = 'electron-mat.zip'
// if ('download' in document.createElement('a')) { // 非IE下载
// const elink = document.createElement('a')
// elink.download = fileName
// elink.style.display = 'none'
// elink.href = URL.createObjectURL(blob)
// document.body.appendChild(elink)
// elink.click()
// URL.revokeObjectURL(elink.href) // 释放URL 对象
// document.body.removeChild(elink)
// } else { // IE10+下载
// // navigator.msSaveBlob(blob, fileName)
// }
// const blob = new Blob([res.data], { type: 'application/zip' })
// const url = window.URL.createObjectURL(blob)
// window.location.href = url
// if(typeof(res.data) == 'string'){
// var blob = new Blob([res.data], { type: 'application/zip' })
// if (window.navigator.msSaveOrOpenBlob) {//msSaveOrOpenBlob方法返回bool值
// navigator.msSaveBlob(blob, 'fileName');//本地保存
// } else {
// var link = document.createElement('a');//a标签下载
// link.href = window.URL.createObjectURL(blob);
// link.download = 'fileName';
// link.click();
// window.URL.revokeObjectURL(link.href);
// }
// }else{
// }
// console.log(res)
// const blob = new Blob([res.data], { type: 'application/zip' })
// const url = window.URL.createObjectURL(blob)
// const link = document.createElement('a') // 创建a标签
// link.href = url
// // link.download = data.fileName // 设置下载的文件名
// document.body.appendChild(link)
// link.click() //执行下载
// document.body.removeChild(link) //释放标签
// const downloadElement = document.createElement('a')
// const contentDisposition = res.headers['content-disposition']
// const patt = new RegExp('filename=([^;]+\\.[^\\.;]+);*')
// const result = patt.exec(contentDisposition)
// const filename = decodeURI(result[1])
// const href = window.URL.createObjectURL(blob) // 创建下载的链接
// downloadElement.href = href
// downloadElement.download = filename // 下载后文件名
// document.body.appendChild(downloadElement)
// downloadElement.click() // 点击下载
// document.body.removeChild(downloadElement) // 下载完成移除元素
// window.URL.revokeObjectURL(href) // 释放blob对象
// },
// error => {}
// );
// } else {
// this.$message({
// type: "info",
// message: "请至少选择一个选项！"
// });
// }
// if (str) {
// this.$confirm("此操作将删除选中菜单, 是否继续?", "提示", {
// confirmButtonText: "确定",
// cancelButtonText: "取消",
// type: "warning"
// }).then(() => {
// _this
// .$https({
// url: "menu/batchDel?menuIds=" + str,
// method: "DELETE",
// authType: this.backToken
// })
// .then(
// res => {
// if (res.data.status == 201 || res.data.status == 200) {
// this.$message({
// type: "success",
// message: "删除成功!"
// });
// }
// //重新查询数据
// _this.onSearch();
// },
// error => {}
// );
// });
// } else {
// this.$message({
// type: "info",
// message: "请至少选择一个选项！"
// });
// }
}
}
};
</script>
<style lang="less">
// @import "../../../../style/common";
// @import "../../style/list";
@import "../../../../style/dialog.less";
@import "../../../../style/table.less";
@import "../../../../style/pagination.less";
</style>
<template>
<div class="listPage H100">
<div class="search-container">
<el-form :inline="true" :model="form" class="search-form" onsubmit="return false;">
<el-form-item label="">
<el-input
placeholder="请输入视频名称"
v-model="form.nameOrCode"
@keyup.enter.native="Search"
clearable
></el-input>
</el-form-item>
<el-form-item label="">
<el-select
placeholder="请选择视频版权方"
@focus="getAssetCopyrightData"
v-model="form.videoContentCopyrightOwnerId"
clearable
>
<el-option
v-for="item in copyrightOwner"
:label="item.name"
:value="item.id"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item label="">
<el-select
placeholder="请选择预设视频分类"
@focus="getAssetTypeData"
v-model="form.videoContentCatId"
clearable
>
<el-option
v-for="item in videoContentCat"
:label="item.name"
:value="item.id"
:key="item.id"
></el-option>
</el-select>
</el-form-item>
<el-form-item>
<div class="btn-group">
<el-button size="mini" type="primary" class="btn_form_search" @click="Search">查询</el-button>
<el-button size="mini" class="btn_form_search" @click="Reset">重置</el-button>
</div>
</el-form-item>
</el-form>
<div class="page-tip">
<span class="page-tip-title">页面说明:</span>
<span class="page-tips">可使用版权方、视频分类、视频名称模糊搜索对需要汇出的视频进行快速检索，下载至本地。</span>
</div>
</div>
<div class="table-content">
<div class="btn-group">
<el-button type="primary" @click="downloadCipher()">导出加密文件</el-button>
<el-button type="primary" @click="multipleRemitGet()">汇出</el-button>
<!-- <el-button type="primary" @click="multipleRemit()">汇出</el-button> -->
</div>
<div class="party-table">
<el-table
border
style="width: 100%;height:100%"
height="100%"
ref="multipleTable"
:data="tableData"
@selection-change="handleSelectionChange"
>
<el-table-column type="selection" width="55"></el-table-column>
<el-table-column type="index" width="120" label="序号">
<template slot-scope="scope">
<span>{{ (page.currentPage - 1) * 10 + scope.$index + 1 }}</span>
</template>
</el-table-column>
<el-table-column label="视频名称" prop="fileName"></el-table-column>
<el-table-column label="版权方" prop="videoContentCopyrightOwnerName"></el-table-column>
<el-table-column label="视频类别" prop="videoContentCatName"></el-table-column>
</el-table>
</div>
<div class="partyt-pagination">
<el-pagination
@current-change="handleCurrentChange"
:current-page="page.currentPage"
:page-size="page.pageSize"
layout="prev, pager, next, jumper"
:total="page.total"
></el-pagination>
</div>
</div>
</div>
</template>
<script>
import axios from 'axios'
export default {
data() {
var checkIsNull = (rule, value, callback) => {
if (value) {
if (value.trim() == "") {
callback(new Error("不允许只输入空格"));
} else {
callback();
}
}
};
return {
nowDate: "", // 当前日期
fullscreenLoading: false,
copyrightOwner:[],
videoContentCat:[],
type: true,
value1: "",
page: { currentPage: 1, pageSize: 10, total: 0 },
tableData: [],
FormVisible: false,
FormVisible1: false,
formLabelWidth: "100px",
form: {
nameOrCode: ""
},
editform: {
menuName: "",
menuUrl: "",
parentId: "",
sort: "",
id: ""
},
classForm: {
menuName: "",
menuUrl: "",
parentId: "",
sort: ""
},
typeList: [],
rules: {
sort: [
{ required: true, message: "请输入顺序值", trigger: "change" },
{ pattern: /^(\d{1,5})?$/, message: "排序值为低于5位数的纯数字" }
],
menuName: [
{ required: true, message: "请输入菜单名称", trigger: "change" },
{ max: 20, message: "不能超过20个字符", trigger: "change" },
{ validator: checkIsNull, trigger: "blur" }
],
menuUrl: [
{ required: true, message: "请输入菜单地址", trigger: "change" },
{ validator: checkIsNull, trigger: "blur" }
],
parentId: [
{ required: true, message: "请输入父级菜单", trigger: "change" }
]
},
value: "",
name: ""
};
},
computed: {},
mounted() {
this.onSearch();
// this.getPermis();
},
components: {},
methods: {
formatDate() {
let date = new Date();
let year = date.getFullYear(); // 年
let month = date.getMonth() + 1; // 月
let day = date.getDate(); // 日
let week = date.getDay(); // 星期
let weekArr = [ "星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六" ];
let hour = date.getHours(); // 时
hour = hour < 10 ? "0" + hour : hour; // 如果只有一位，则前面补零
let minute = date.getMinutes(); // 分
minute = minute < 10 ? "0" + minute : minute; // 如果只有一位，则前面补零
let second = date.getSeconds(); // 秒
second = second < 10 ? "0" + second : second; // 如果只有一位，则前面补零
this.nowDate = `${year}${month}${day}}`;
},
// 获取展板分类列表
getAssetCopyrightData(){
let vm = this;
vm.$https({
url: "copyrightOwner/getList",
method: "get",
authType: this.backToken
},
{copyrightOwnerType:'VIDEO_CONTENT'})
.then(res => {
let data = res.data.data;
this.copyrightOwner = data;
})
.catch(function(err) {
console.log(err);
});
},
// 获取视频分类列表
getAssetTypeData() {
let vm = this;
vm.$https({
url: "videoContentCat/getList",
method: "get",
authType: this.backToken
})
.then(res => {
let data = res.data.data;
this.videoContentCat = data;
})
.catch(function(err) {
console.log(err);
});
},
// 渲染父级权限
getPermis() {
let vm = this;
vm.$https({
method: "get",
url: "menu/getRoleMenu?roleId=" + sessionStorage.getItem("roleId"),
authType: this.backToken
}).then(
res => {
let data = res.data;
vm.typeList = data.map((e, i) => {
return {
id: e.id,
name:
e.menuName.indexOf("-") == -1
? e.menuName
: e.menuName.split("-")[1]
};
});
},
error => {
console.log(error);
}
);
},
// 获得数据接口
getTableData(param) {
let vm = this;
vm.$https(
{
url: "asset/getPageList",
method: "post",
authType: this.backToken
},
vm.$qs.stringify(param)
// param
)
.then(res => {
let data = res.data.data;
vm.page.pageSize = data.size;
vm.page.total = data.total;
vm.tableData = data.records;
})
.catch(function(err) {
console.log(err);
});
},
// 分页
handleCurrentChange(val) {
let _this = this;
_this.page.currentPage = val;
_this.onSearch();
},
onSearch() {
let _this = this;
let param = _this.getSearchQuery();
_this.getTableData(param);
},
// 重置
Reset(){
this.form = {}
this.Search()
},
Search() {
let _this = this;
_this.page.currentPage = 1;
let searchObj = {
_index: 1,
_size: _this.page.pageSize,
nameOrCode: _this.form.nameOrCode,
videoContentCatId:_this.form.videoContentCatId,
videoContentCopyrightOwnerId:_this.form.videoContentCopyrightOwnerId
};
this.getTableData(searchObj);
},
// // 获取当前查询参数
getSearchQuery() {
let _this = this;
let searchObj = {
_index: _this.page.currentPage,
_size: _this.page.pageSize
};
for (let key in _this.form) {
if (_this.form[key]) {
searchObj[key] = _this.form[key];
}
}
return searchObj;
},
// 批量操作
handleSelectionChange(selection) {
let _this = this;
_this.selection = selection;
},
getMultipleSelect() {
let _this = this;
let arr = [];
let str = "";
if (_this.selection) {
_this.selection.forEach(function(e) {
arr.push(e.id);
});
str = arr.join(",");
// str = arr;
} else {
str = "";
// str = [];
}
return str;
},
// 汇出
multipleRemit() {
let _this = this;
let str = _this.getMultipleSelect();
// console.log(str)
if (str.length > 0) {
console.log(str);
_this.$https({
url: "asset/download",
method: "post",
authType: this.backToken
},
// {idList:str}
_this.$qs.stringify({idList:str})
)
.then(
res => {
const blob = new Blob([res.data], {
type:
"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8'"
})
const downloadElement = document.createElement('a')
const contentDisposition = res.headers['content-disposition']
const patt = new RegExp('filename=([^;]+\\.[^\\.;]+);*')
const result = patt.exec(contentDisposition)
const filename = decodeURI(result[1])
const href = window.URL.createObjectURL(blob) // 创建下载的链接
downloadElement.href = href
downloadElement.download = filename // 下载后文件名
document.body.appendChild(downloadElement)
downloadElement.click() // 点击下载
document.body.removeChild(downloadElement) // 下载完成移除元素
window.URL.revokeObjectURL(href) // 释放blob对象
},
error => {}
);
} else {
this.$message({
type: "info",
message: "请至少选择一个选项！"
});
}
},
openFullScreen2() {
this.formatDate()
const loading = this.$loading({
lock: true,
text: '下载中，请稍候。。。',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
// setTimeout(() => {
// loading.close();
// }, 2000);
},
// 导出机顶盒文件加密秘钥
downloadCipher(){
const loading = this.$loading({
lock: true,
text: '下载中，请稍候。。。',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
axios({
method: "get",
url: 'http://111.203.232.175:8088/mall/asset/downloadCipher',
params: {
// idList:str
},
headers: {
"Authorization": localStorage.getItem("backToken") || "",
},
responseType: "blob",
}).then(res => {
console.log(res)
loading.close();
let blobUrl = window.URL.createObjectURL(res.data);
const aElement = document.createElement("a");
aElement.href = blobUrl;
// aElement.download = res.data.fileName;
aElement.download = '密钥.zip';
aElement.click();
window.URL.revokeObjectURL(blobUrl);
})
},
// get测试
multipleRemitGet() {
let _this = this;
let str = _this.getMultipleSelect();
if(str){
const loading = this.$loading({
lock: true,
text: '下载中，请稍候。。。',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
axios({
method: "get",
url: 'http://111.203.232.175:8088/mall/asset/download',
params: {
// idList: "1382697227765313538"
idList:str
},
headers: {
"Authorization": localStorage.getItem("backToken") || "",
},
responseType: "blob",
}).then(res => {
console.log(res)
loading.close();
let blobUrl = window.URL.createObjectURL(res.data);
const aElement = document.createElement("a");
aElement.href = blobUrl;
// aElement.download = res.data.fileName;
aElement.download = _this.nowDate + '视频集.zip';
aElement.click();
window.URL.revokeObjectURL(blobUrl);
})
}else{
this.$message({
type: "info",
message: "请至少选择一个选项！"
});
}
// let _this = this;
// let str = _this.getMultipleSelect();
// console.log(str);
// _this.$https({
// url: "asset/download",
// method: "get",
// authType: this.backToken,
// // dataType: 'json',
// // responseType: 'arraybuffer' // 该条件是重点
// responseType: 'blob'
// },
// {idList:'1382697227765313538'}
// )
// .then(
// res => {
// let blobUrl = window.URL.createObjectURL(res.data);
// const aElement = document.createElement("a");
// aElement.href = blobUrl;
// aElement.download = 'aaaa.zip';
// aElement.click();
// window.URL.revokeObjectURL(blobUrl);
// const content = res
// const blob = new Blob([content])
// const fileName = 'electron-mat.zip'
// if ('download' in document.createElement('a')) { // 非IE下载
// const elink = document.createElement('a')
// elink.download = fileName
// elink.style.display = 'none'
// elink.href = URL.createObjectURL(blob)
// document.body.appendChild(elink)
// elink.click()
// URL.revokeObjectURL(elink.href) // 释放URL 对象
// document.body.removeChild(elink)
// } else { // IE10+下载
// // navigator.msSaveBlob(blob, fileName)
// }
// const blob = new Blob([res.data], { type: 'application/zip' })
// const url = window.URL.createObjectURL(blob)
// window.location.href = url
// if(typeof(res.data) == 'string'){
// var blob = new Blob([res.data], { type: 'application/zip' })
// if (window.navigator.msSaveOrOpenBlob) {//msSaveOrOpenBlob方法返回bool值
// navigator.msSaveBlob(blob, 'fileName');//本地保存
// } else {
// var link = document.createElement('a');//a标签下载
// link.href = window.URL.createObjectURL(blob);
// link.download = 'fileName';
// link.click();
// window.URL.revokeObjectURL(link.href);
// }
// }else{
// }
// console.log(res)
// const blob = new Blob([res.data], { type: 'application/zip' })
// const url = window.URL.createObjectURL(blob)
// const link = document.createElement('a') // 创建a标签
// link.href = url
// // link.download = data.fileName // 设置下载的文件名
// document.body.appendChild(link)
// link.click() //执行下载
// document.body.removeChild(link) //释放标签
// const downloadElement = document.createElement('a')
// const contentDisposition = res.headers['content-disposition']
// const patt = new RegExp('filename=([^;]+\\.[^\\.;]+);*')
// const result = patt.exec(contentDisposition)
// const filename = decodeURI(result[1])
// const href = window.URL.createObjectURL(blob) // 创建下载的链接
// downloadElement.href = href
// downloadElement.download = filename // 下载后文件名
// document.body.appendChild(downloadElement)
// downloadElement.click() // 点击下载
// document.body.removeChild(downloadElement) // 下载完成移除元素
// window.URL.revokeObjectURL(href) // 释放blob对象
// },
// error => {}
// );
// } else {
// this.$message({
// type: "info",
// message: "请至少选择一个选项！"
// });
// }
// if (str) {
// this.$confirm("此操作将删除选中菜单, 是否继续?", "提示", {
// confirmButtonText: "确定",
// cancelButtonText: "取消",
// type: "warning"
// }).then(() => {
// _this
// .$https({
// url: "menu/batchDel?menuIds=" + str,
// method: "DELETE",
// authType: this.backToken
// })
// .then(
// res => {
// if (res.data.status == 201 || res.data.status == 200) {
// this.$message({
// type: "success",
// message: "删除成功!"
// });
// }
// //重新查询数据
// _this.onSearch();
// },
// error => {}
// );
// });
// } else {
// this.$message({
// type: "info",
// message: "请至少选择一个选项！"
// });
// }
}
}
};
</script>
<style lang="less">
// @import "../../../../style/common";
// @import "../../style/list";
@import "../../../../style/dialog.less";
@import "../../../../style/table.less";
@import "../../../../style/pagination.less";
</style>
static/json/api.json
View file @ f9ecf430
{
"baseUrl_backUp": "/mall/",
"baseUrl": "/mall/",
"directory": "/plat"
}
{
"baseUrl_backUp": "/mall/",
"baseUrl": "/mall/",
"directory": "/plat"
}
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