Skip to content

N
national_museum_vod-H5
Commit 71a3fdcb authored by 乐宝呗666's avatar 乐宝呗666
Browse files
Options

添加功能

parent 187e0ddc
Hide whitespace changes
Inline Side-by-side
Showing with 1620 additions and 681 deletions
package.json
View file @ 71a3fdcb
...@@ -8,8 +8,10 @@ ...@@ -8,8 +8,10 @@
"lint": "vue-cli-service lint" "lint": "vue-cli-service lint"
}, },
"dependencies": { "dependencies": {
"axios": "^0.21.1",
"core-js": "^3.6.5", "core-js": "^3.6.5",
"echarts": "^4.8.0", "echarts": "^4.8.0",
"qs": "^6.10.1",
"vant": "^2.12.6", "vant": "^2.12.6",
"vue": "^2.6.11", "vue": "^2.6.11",
"vue-router": "^3.5.1" "vue-router": "^3.5.1"
......
public/index.html
View file @ 71a3fdcb
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
<head> <head>
<meta charset="utf-8"> <meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico"> <link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title>国博建党百年展点播院线统计平台</title> <title>国博建党百年展点播院线统计平台</title>
</head> </head>
......
src/components/tabbar/index.vue
View file @ 71a3fdcb
...@@ -79,5 +79,12 @@ export default { ...@@ -79,5 +79,12 @@ export default {
}; };
</script> </script>
<style lang="scss" scoped> <style scoped>
.my-tabbar {
height: 50px;
position: fixed;
bottom: 0;
left: 0;
right: 0;
}
</style> </style>
\ No newline at end of file
src/config/env.js 0 → 100644
View file @ 71a3fdcb
let baseUrl="/mall/";
let routerMode='history';
let backToken = "back";
let frontToken = "front";
export {
baseUrl,
backToken,
frontToken,
routerMode
}
\ No newline at end of file
src/config/request.js 0 → 100644
View file @ 71a3fdcb
/**
* Created by supervisor on 2017/11/3.
*/
import axios from 'axios'
import router from '../router'
import {baseUrl} from './env'
import {
Toast
} from 'vant';
// Vue.use($msg)
//axios 拦截器 请求时的拦截
axios.interceptors.request.use(config => {
// 发送请求之前做一些处理
Toast.loading({
message: '加载中...',
forbidClick: true,
duration: 0,
});
return config
}, error => {
// 当请求异常时做一些处理
return new Promise.reject(error)
})
// 响应时拦截
axios.interceptors.response.use(response => {
// 返回响应时做一些处理
return response
}, error => {
// 当响应异常时做一些处理
return Promise.resolve(error.response)
})
function errorState(status, data) {
Toast.clear() // 关闭 loading
if (status === 500 && data.message.indexOf("token invalid") !== -1) {
Toast({
message: '您的登录过期，将重新登录!',
onClose: () => {
//清除用户信息
localStorage.removeItem('backToken')
localStorage.removeItem('userId')
router.push({
path: '/',
query: {
redirect: router.history.current.fullPath
}
})
}
});
} else if (status === 401) {
Toast({
message: '您的用户权限已被禁用，请联系管理员!',
onClose: () => {
//这个时候点击确定后清除用户信息
localStorage.removeItem('backToken')
localStorage.removeItem('userId')
router.push({
path: '/',
query: {
redirect: router.history.current.fullPath
}
})
}
});
} else if (status === 500 && data.message.indexOf("not have permission") !== -1) {
Toast.fail("抱歉，你无权访问该页面!")
} else if (!data) {
Toast.fail("网络出小差咯~")
}
}
function successState() {
Toast.clear() //隐藏loading
}
const httpServer = (opts, data, file, timeout) => {
//如果是不需要登录就可以访问的接口 需要设置opts.open
let Public = {} //公共参数
let httpDefaultOpts = {
method: opts.method,
url: baseUrl + opts.url,
timeout: timeout ? timeout : 20000,
params: Object.assign(Public, data),
data: data,
headers: opts.headers || {},
};
httpDefaultOpts.headers["Access-control-Allow-Origin"] = "*";
httpDefaultOpts.headers["Access-Control-Allow-Headers"] = "content-type,x-requested-with";
let authToken = "";
if (opts.authType && opts.authType != "") {
if (opts.authType === "back") {
authToken =localStorage.getItem('token') || "eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzUxMiJ9.eyJzdWIiOiJhZG1pbiIsInVzZXJfaWQiOiIxIiwiaXNzIjoiSUFUQSIsImV4cCI6MTYxNjY2NTkzOCwiaWF0IjoxNjE2NjUxNTM4fQ._nqZq0LMwkurIBKJtfX-imXLCxQSNwJ-ueGZ8iwW-0oAW880gY7PjNEfroYYQZ91v0u5yQb73Alzvy6EIp6GGg"
} else if (opts.authType === "front") {
authToken = localStorage.getItem("token");
}
httpDefaultOpts.headers["Authorization"] = authToken
}
if (opts.method === 'get') {
delete httpDefaultOpts.data
httpDefaultOpts.params.timestamp_static = new Date().getTime();
} else {
delete httpDefaultOpts.params
if (file) {
httpDefaultOpts.data = data;
}
}
let promise = new Promise(function (resolve, reject) {
Toast.loading({
message: '加载中...',
forbidClick: true,
duration: 0,
});
let markIndex = setTimeout(function () {
Toast.clear()
}, 10000)
axios(httpDefaultOpts).then((res) => {
Toast.clear()
clearTimeout(markIndex)
successState(res)
if (res) {
resolve(res)
errorState(res.status, res.data)
}
}).catch((response) => {
Toast.clear()
clearTimeout(markIndex)
if (response && response.response && response.response.status && response.response.data) {
errorState(response.response.status, response.response.data)
}
reject(response)
if (response.response.data) {
if (response.response.data.message) {
Toast.fail(response.response.data.message)
} else {
Toast.fail("操作失败!")
}
}
})
})
return promise
}
export default httpServer
\ No newline at end of file
src/main.js
View file @ 71a3fdcb
...@@ -3,7 +3,9 @@ import App from './App.vue' ...@@ -3,7 +3,9 @@ import App from './App.vue'
import router from './router' import router from './router'
import './assets/style/public.scss' import './assets/style/public.scss'
import echarts from "echarts" import echarts from "echarts"
import qs from 'qs'
import http from '@/config/request'
import {baseUrl,backToken,frontToken} from './config/env'
import Vant from 'vant'; import Vant from 'vant';
import 'vant/lib/index.css'; import 'vant/lib/index.css';
// 自定义tabbar // 自定义tabbar
...@@ -12,6 +14,13 @@ Vue.component('my-tabbar',Mytabbar) ...@@ -12,6 +14,13 @@ Vue.component('my-tabbar',Mytabbar)
Vue.use(Vant); Vue.use(Vant);
Vue.prototype.$echarts = echarts Vue.prototype.$echarts = echarts
Vue.prototype.$qs = qs
Vue.prototype.$https = http
Vue.prototype.$baseUrl=baseUrl
Vue.prototype.backToken=backToken
Vue.prototype.frontToken=frontToken
Vue.config.productionTip = false Vue.config.productionTip = false
new Vue({ new Vue({
......
src/router/index.js
View file @ 71a3fdcb
...@@ -22,6 +22,14 @@ const routes= [ ...@@ -22,6 +22,14 @@ const routes= [
}, },
component: () => import('@/views/setTopBoxManage/login') component: () => import('@/views/setTopBoxManage/login')
}, },
{
path: '/success',
name: 'success',
meta: {
title: '操作成功'
},
component: () => import('@/views/setTopBoxManage/success')
},
{ {
path: '/opt', path: '/opt',
name: 'opt', name: 'opt',
...@@ -71,4 +79,14 @@ const router = new VueRouter({ ...@@ -71,4 +79,14 @@ const router = new VueRouter({
routes: routes, routes: routes,
mode: "history" mode: "history"
}) })
router.beforeEach((to, from, next) => {
let user = localStorage.getItem("token");
if (!user && to.path !=='/login') { // 通过vuex state获取当前的token是否存在
next({
path: '/login',
})
}else {
next();
}
})
export default router export default router
src/views/setTopBoxManage/components/form.vue
View file @ 71a3fdcb
<template> <template>
<div class="form-container"> <div class="form-container">
<van-form @submit="onSubmit"> <van-form @submit="onSubmit">
<van-field <van-field
class="field-form-item" class="field-form-item"
readonly readonly
clickable clickable
name="orgName" name="organName"
:value="boxInfo.orgName" :value="boxInfo.organName"
label="机顶盒所属单位" label="机顶盒所属单位"
placeholder="请选择组织单位" placeholder="请选择组织单位"
:right-icon="showOrg? 'arrow-up':'arrow-down'" :right-icon="showOrg ? 'arrow-up' : 'arrow-down'"
@click="showOrg = true" @click="showOrg = true"
:rules="[{ required: true}]"/> :rules="[{ required: true }]"
<van-popup v-model="showOrg" position="bottom"> />
<van-picker <van-popup v-model="showOrg" position="bottom">
show-toolbar <van-picker
:columns="orgList" show-toolbar
@confirm="onConfirmOrg" :columns="orgNameList"
@cancel="showOrg = false" @confirm="onConfirmOrg"
/> @cancel="showOrg = false"
</van-popup> />
<van-field </van-popup>
class="field-form-item" <van-field
v-model="boxInfo.macURL" class="field-form-item"
name="macURL" v-model="boxInfo.macURL"
label="机顶盒Mac地址" name="macURL"
placeholder="请填写机顶盒Mac地址" label="机顶盒Mac地址"
:rules="[{ required: true }]" placeholder="请填写机顶盒Mac地址"
/> :rules="[{ required: true }]"
<div class="form-page-button"> />
<van-button type="default" native-type="submit" v-if="actived==='1'">激活</van-button> <div class="form-page-button">
<van-button type="default" native-type="submit" v-if="actived==='2'">上报</van-button> <van-button type="default" native-type="submit" v-if="actived === '1'"
</div> >激活</van-button
</van-form> >
</div> <van-button type="default" native-type="submit" v-if="actived === '2'"
>上报</van-button
>
</div>
</van-form>
</div>
</template> </template>
<script> <script>
export default { export default {
props:['actived'], props: ["actived"],
data(){ data() {
return { return {
boxInfo:{}, boxInfo: {},
orgList: ['杭州', '宁波', '温州', '嘉兴', '湖州'], orgNameList: [],
showOrg: false, orgList: [],
showUser: false, showOrg: false,
} showUser: false,
};
},
watch: {},
mounted() {
this.getorganName();
},
methods: {
// 获取所属单位
getorganName() {
let vm = this;
vm.$https({
url: "boxOperation/getList",
method: "get",
authType: this.backToken,
})
.then((res) => {
if (res.data.resultCode === "200") {
vm.orgList = res.data.data;
vm.orgNameList = res.data.data.map((item) => item.organName);
}
})
.catch(function (err) {
console.log(err);
});
},
onConfirmOrg(value, index) {
this.boxInfo.organName = value;
this.boxInfo.organId = this.orgList[index].organId;
this.boxInfo.id = this.orgList[index].id;
this.showOrg = false;
},
onSubmit() {
if (this.actived === "1") {
// 激活
this.submitData("2");
} else {
// 上报
this.submitData("3");
}
},
submitData(status) {
let vm = this;
const param = {
organName: this.boxInfo.organName,
organId: this.boxInfo.organId,
id: this.boxInfo.id,
mac: this.boxInfo.macURL,
status: status,
};
vm.$https(
{
url: "boxOperation/update",
method: "put",
authType: this.backToken,
}, },
methods:{ vm.$qs.stringify(param)
onConfirmOrg(value) { )
this.boxInfo.orgName = value; .then((res) => {
this.showOrg = false; if (res.data.resultCode === "200") {
}, // 调用激活接口
onSubmit(values) { this.$router.replace("/success");
console.log('submit', values,this.boxInfo); } else {
if(this.actived==='1'){ this.$toast(res.data.message);
// 调用激活接口 }
this.$toast.success('提交成功'); })
}else{ .catch(function (err) {
// 调用上报接口 console.log(err);
this.$toast.success('提交成功'); });
} },
}, },
} };
}
</script> </script>
<style lang="scss"> <style lang="scss">
.form-container{ .form-container {
.van-form { .van-form {
padding: 24px; padding: 24px;
background: #FFFFFF; background: #ffffff;
border-radius: 0 0 4px 4px; border-radius: 0 0 4px 4px;
.van-field { .van-field {
background: #F5F5F5; background: #f5f5f5;
border-radius: 4px; border-radius: 4px;
.van-field__left-icon { .van-field__left-icon {
margin-right: 12px; margin-right: 12px;
} }
}
} }
.form-page-button{ }
text-align: center; .form-page-button {
background: #A4151D; text-align: center;
border-radius: 4px; background: #a4151d;
position: absolute; border-radius: 4px;
bottom: 40px; position: absolute;
left: 24px; bottom: 40px;
right: 24px; left: 24px;
box-sizing: border-box; right: 24px;
.van-button { box-sizing: border-box;
font-size: 16px; .van-button {
color: #fff; font-size: 16px;
background-color: transparent; color: #fff;
border: none; background-color: transparent;
} border: none;
} }
.field-form-item.van-cell{ }
display: block; .field-form-item.van-cell {
padding: 8px 0 16px 0; display: block;
background-color: transparent; padding: 8px 0 16px 0;
border-bottom: none; background-color: transparent;
.van-field__label{ border-bottom: none;
width: 100%; .van-field__label {
color: #333; width: 100%;
font-size: 14px; color: #333;
font-weight: normal; font-size: 14px;
margin-bottom: 16px; font-weight: normal;
} margin-bottom: 16px;
.van-field__value{
background: #F5F5F5;
border-radius: 4px;
padding: 8px 20px;
}
&::after {
border: none;
}
.van-field__control{
color: #333;
font-size: 14px;
font-weight: normal;
}
}
.van-tabs__nav--card {
margin: 0;
} }
} .van-field__value {
background: #f5f5f5;
border-radius: 4px;
padding: 8px 20px;
}
&::after {
border: none;
}
.van-field__control {
color: #333;
font-size: 14px;
font-weight: normal;
}
}
.van-tabs__nav--card {
margin: 0;
}
}
</style> </style>
src/views/setTopBoxManage/login.vue
View file @ 71a3fdcb
<template> <template>
<div class="login-container"> <div class="login-container">
<div class="login-bg"></div> <div class="login-bg"></div>
<div class="login-page"> <div class="login-page">
<div class="login-page-body"> <div class="login-page-body">
<div class="login-page-title">机顶盒运维客户端</div> <div class="login-page-title">客户端登录</div>
<div class="login-page-form"> <div class="login-page-form">
<van-form @submit="onSubmit"> <van-form @submit="onSubmit">
<van-field <van-field
v-model="userInfo.username" v-model="userInfo.username"
name="用户名" name="用户名"
left-icon="manager" left-icon="manager"
placeholder="请输入用户名" placeholder="请输入用户名"
:rules="[{ required: true, message: '用户名不能为空' }]" :rules="[{ required: true, message: '用户名不能为空' }]"
/> />
<van-field <van-field
v-model="userInfo.password" v-model="userInfo.password"
type="password" type="password"
name="密码" name="密码"
left-icon="lock" left-icon="lock"
placeholder="请输入密码" placeholder="请输入密码"
:rules="[{ required: true, message: '密码不能为空' }]" :rules="[{ required: true, message: '密码不能为空' }]"
/> />
<div class="login-page-button"> <div class="login-page-button">
<van-button type="default" native-type="submit">登录</van-button> <van-button type="default" native-type="submit">登录</van-button>
</div>
</van-form>
</div>
</div> </div>
</van-form>
</div> </div>
</div>
</div> </div>
</div>
</template> </template>
<script> <script>
export default { export default {
data(){ data() {
return { return {
userInfo:{} userInfo: {},
} };
}, },
methods:{ mounted() {},
onSubmit(values) { methods: {
console.log('submit', values); onSubmit() {
const isOpt = 2 let vm = this;
if(isOpt==2){ let param = {
this.$router.push('/opt') password: this.userInfo.password,
}else{ username: this.userInfo.username,
this.$router.push('/commit') };
} vm.$https(
{
url: "ajaxLogin",
method: "post",
authType: this.backToken,
}, },
} vm.$qs.stringify(param)
} )
</script> .then((res) => {
<style lang="scss"> if (res.data.resultCode === "200") {
.login-container{ let data = res.data;
width: 100%; const isOpt = data.user.type;
height: 100%; localStorage.setItem("token", data.token);
max-width: 1024px; localStorage.setItem("userInfo", JSON.stringify(data.user));
.login-bg{ if (isOpt == "4") {
width: 100%; this.$router.push("/opt");
height: 100%;
margin: 0 auto;
background: #a4171d;
&:before{
display: inline-block;
content: "";
width: 100%;
height: 106px;
background: url('/images/topBox/bg-bottom.png') no-repeat;
background-size: 100% 100%;
position: absolute;
bottom: 0;
left: 0;
}
&:after{
display: inline-block;
content: "";
width: 100%;
height: 421px;
background: url('/images/topBox/bg-top.png') no-repeat;
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
}
}
.login-page{
height: 350px;
position: absolute;
bottom: 58px;
left: 24px;
right: 24px;
padding: 24px;
background: #FFFFFF;
box-shadow: 0 8px 20px 0 rgba(0,0,0,0.20);
border-radius: 8px;
.login-page-form {
padding-top: 24px;
.van-field {
background: #F5F5F5;
border-radius: 4px;
margin-bottom: 32px;
.van-field__left-icon {
margin-right: 12px;
}
} }
} if (isOpt == "2") {
.login-page-title{ this.$router.push("/commit");
font-size: 18px;
color: #333;
text-align: center;
margin: 24px 0;
}
.login-page-button{
text-align: center;
background: #A4151D;
border-radius: 4px;
position: absolute;
bottom: 40px;
left: 24px;
right: 24px;
box-sizing: border-box;
.van-button {
font-size: 16px;
color: #fff;
background-color: transparent;
border: none;
} }
} else {
this.$toast.fail(res.data.message);
}
})
.catch(function (err) {
console.log(err);
});
},
},
};
</script>
<style lang="scss">
.login-container {
width: 100%;
height: 100%;
max-width: 1024px;
.login-bg {
width: 100%;
height: 100%;
margin: 0 auto;
background: #a4171d;
&:before {
display: inline-block;
content: "";
width: 100%;
height: 106px;
background: url("/images/topBox/bg-bottom.png") no-repeat;
background-size: 100% 100%;
position: absolute;
bottom: 0;
left: 0;
}
&:after {
display: inline-block;
content: "";
width: 100%;
height: 421px;
background: url("/images/topBox/bg-top.png") no-repeat;
background-size: 100% 100%;
position: absolute;
top: 0;
left: 0;
}
}
.login-page {
height: 350px;
position: absolute;
bottom: 58px;
left: 24px;
right: 24px;
padding: 24px;
background: #ffffff;
box-shadow: 0 8px 20px 0 rgba(0, 0, 0, 0.2);
border-radius: 8px;
.login-page-form {
padding-top: 24px;
.van-field {
background: #f5f5f5;
border-radius: 4px;
margin-bottom: 32px;
.van-field__left-icon {
margin-right: 12px;
} }
} }
}
} .login-page-title {
font-size: 18px;
color: #333;
text-align: center;
margin: 24px 0;
}
.login-page-button {
text-align: center;
background: #a4151d;
border-radius: 4px;
position: absolute;
bottom: 40px;
left: 24px;
right: 24px;
box-sizing: border-box;
.van-button {
font-size: 16px;
color: #fff;
background-color: transparent;
border: none;
}
}
}
}
</style> </style>
src/views/setTopBoxManage/opt.vue
View file @ 71a3fdcb
<template> <template>
<div class="opt-container"> <div class="opt-container">
<div class="opt-page"> <div class="opt-page">
<van-tabs type="card" v-model="activeName"> <van-tabs type="card" v-model="activeName">
<van-tab title="机顶盒激活" name="1"> <van-tab title="机顶盒激活" name="1">
<custom-form actived="1"></custom-form> <custom-form actived="1"></custom-form>
</van-tab> </van-tab>
<van-tab title="故障上报" name="2"> <van-tab title="故障上报" name="2">
<custom-form actived="2"></custom-form> <custom-form actived="2"></custom-form>
</van-tab> </van-tab>
</van-tabs> </van-tabs>
</div>
</div> </div>
</div>
</template> </template>
<script> <script>
import CustomForm from './components/form' import CustomForm from "./components/form";
export default { export default {
components:{ components: {
CustomForm CustomForm,
}, },
data(){ data() {
return { return {
activeName:'1', activeName: "1",
} };
} },
} };
</script> </script>
<style lang="scss"> <style lang="scss">
.opt-container{ .opt-container {
position: absolute; position: absolute;
top: 16px; top: 16px;
bottom: 16px; bottom: 16px;
left: 16px; left: 16px;
right: 16px; right: 16px;
border-top-left-radius: 8px; border-top-left-radius: 8px;
border-top-right-radius: 8px; border-top-right-radius: 8px;
box-shadow: 0 2px 4px 0 rgba(0,0,0,0.20); box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2);
.opt-page{ .opt-page {
width: 100%; width: 100%;
height: 100%; height: 100%;
} }
.van-tabs__nav--card {
margin: 0;
}
.van-tabs {
width: 100%;
height: 100%;
}
.van-tabs--card>.van-tabs__wrap {
height: 40px;
}
.van-tabs__nav--card .van-tab {
color: #333;
font-size: 16px;
border-right: none;
}
.van-tabs__nav--card {
height: 40px;
background: #EEEEEE;
border-radius: 8px 8px 0 0;
border: none;
}
.van-tabs__nav--card .van-tab.van-tab--active {
color:#fff;
background-color: #A4151D;
}
.van-tabs__nav--card .van-tab.van-tab--active:last-child {
border-top-right-radius: 8px;
}
.van-tabs__nav--card .van-tab.van-tab--active:first-child {
border-top-left-radius: 8px;
}
}
.van-tabs__nav--card {
margin: 0;
}
.van-tabs {
width: 100%;
height: 100%;
}
.van-tabs--card > .van-tabs__wrap {
height: 40px;
}
.van-tabs__nav--card .van-tab {
color: #333;
font-size: 16px;
border-right: none;
}
.van-tabs__nav--card {
height: 40px;
background: #eeeeee;
border-radius: 8px 8px 0 0;
border: none;
}
.van-tabs__nav--card .van-tab.van-tab--active {
color: #fff;
background-color: #a4151d;
}
.van-tabs__nav--card .van-tab.van-tab--active:last-child {
border-top-right-radius: 8px;
}
.van-tabs__nav--card .van-tab.van-tab--active:first-child {
border-top-left-radius: 8px;
}
}
</style> </style>
src/views/setTopBoxManage/success.vue 0 → 100644
View file @ 71a3fdcb
<template>
<div class="success-container">
<img src="images/applets/success.png" alt="" />
<p>操作成功</p>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.success-container {
display: flex;
justify-content: center;
flex-direction: column;
align-items: center;
img {
width: 50%;
margin-top: 200px;
}
p {
margin-top: 30px;
font-size: 18px;
color: #333;
}
}
</style>
src/views/user/admin.vue
View file @ 71a3fdcb
<template> <template>
<div class="admin-conatiner"> <div class="admin-conatiner">
<Header title="管理员信息"/> <Header title="管理员信息" />
<ul> <ul>
<li v-for="(item,index) in list" :key="index" @click="goDetail(item)"> <li v-for="(item,index) in list" :key="index" @click="goDetail(item)">
<span>{{item.name}}</span> <span>{{item.userName}}</span>
<img v-if="item.name==='丁大大'" src="/images/applets/edit.png" alt /> <img v-if="item.id===currentUserId" src="/images/applets/edit.png" alt />
<img v-if="item.name!=='丁大大'" src="/images/applets/detail.png" alt /> <img v-if="item.id!==currentUserId" src="/images/applets/detail.png" alt />
</li> </li>
</ul> </ul>
<my-tabbar active="2"></my-tabbar> <my-tabbar active="2"></my-tabbar>
...@@ -13,32 +13,58 @@ ...@@ -13,32 +13,58 @@
</template> </template>
<script> <script>
import Header from '@/components/Header/index.vue' import Header from "@/components/Header/index.vue";
export default { export default {
components:{Header}, components: { Header },
data() { data() {
return { return {
list:[ list: [],
{name:"丁大大"}, currentUserId: JSON.parse(localStorage.getItem("userInfo")).id
{name:"丁尔尔1"},
{name:"丁二二2"},
{name:"丁三三3"},
]
}; };
}, },
mounted(){ mounted() {
this.getList();
}, },
methods:{ methods: {
goDetail(item){ // 获取管理员列表
if(item.name==='丁大大'){ getList() {
// 修改页面 let vm = this;
this.$router.push({path:'/adminInfo',query:{id:item.name,disabled:false}}) let param = {
}else{ _index: 1,
// 详情页面 _size: 10,
this.$router.push({path:'/adminInfo',query:{id:item.name,disabled:true}}) type: JSON.parse(localStorage.getItem("userInfo")).type
} };
vm.$https(
{
url: "tUser/getPageList",
method: "get",
authType: this.backToken
},
param
)
.then(res => {
let data = res.data.data;
vm.list = data.records;
})
.catch(function(err) {
console.log(err);
});
},
goDetail(item) {
if (item.id === this.currentUserId) {
// 修改页面
this.$router.push({
path: "/adminInfo",
query: { id: item.id, disabled: false }
});
} else {
// 详情页面
this.$router.push({
path: "/adminInfo",
query: { id: item.id, disabled: true }
});
} }
}
} }
}; };
</script> </script>
...@@ -47,11 +73,12 @@ export default { ...@@ -47,11 +73,12 @@ export default {
.admin-conatiner { .admin-conatiner {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
padding: 16px; padding: 50px 16px 60px;
display: flex;
flex-direction: column;
box-sizing: border-box; box-sizing: border-box;
ul { ul {
list-style: none; list-style: none;
margin-top: 44px;
} }
li { li {
display: flex; display: flex;
...@@ -63,8 +90,8 @@ export default { ...@@ -63,8 +90,8 @@ export default {
color: #333333; color: #333333;
margin-top: 20px; margin-top: 20px;
img { img {
width: 24px; width: 24px;
height: 24px; height: 24px;
} }
} }
} }
......
src/views/user/commit.vue
View file @ 71a3fdcb
...@@ -79,10 +79,12 @@ export default { ...@@ -79,10 +79,12 @@ export default {
.home { .home {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
padding: 16px; padding: 50px 16px 60px;
display: flex;
flex-direction: column;
box-sizing: border-box; box-sizing: border-box;
.commit-container { .commit-container {
margin-top: 44px; height: 100%;
/deep/.van-tabs--card>.van-tabs__wrap { /deep/.van-tabs--card>.van-tabs__wrap {
height: 40px; height: 40px;
.van-tabs__nav--card { .van-tabs__nav--card {
......
src/views/user/components/adminInfo.vue
View file @ 71a3fdcb
...@@ -5,7 +5,7 @@ ...@@ -5,7 +5,7 @@
<van-field <van-field
label="管理员姓名" label="管理员姓名"
:disabled="disabled" :disabled="disabled"
v-model="form.adminName" v-model="form.userName"
placeholder="请输入管理员姓名" placeholder="请输入管理员姓名"
input-align="right" input-align="right"
/> />
...@@ -19,21 +19,21 @@ ...@@ -19,21 +19,21 @@
<van-field <van-field
label="固定电话" label="固定电话"
:disabled="disabled" :disabled="disabled"
v-model="form.tel" v-model="form.telephone"
placeholder="请输入固定电话" placeholder="请输入固定电话"
input-align="right" input-align="right"
/> />
<van-field <van-field
label="微信" label="微信"
:disabled="disabled" :disabled="disabled"
v-model="form.wechat" v-model="form.weChat"
placeholder="请输入微信" placeholder="请输入微信"
input-align="right" input-align="right"
/> />
<van-field <van-field
label="邮箱" label="邮箱"
:disabled="disabled" :disabled="disabled"
v-model="form.mail" v-model="form.email"
placeholder="请输入邮箱" placeholder="请输入邮箱"
input-align="right" input-align="right"
/> />
...@@ -70,16 +70,64 @@ export default { ...@@ -70,16 +70,64 @@ export default {
console.log("修改"); console.log("修改");
this.disabled = false; this.disabled = false;
} }
this.getUserInfo()
}, },
methods: { methods: {
getUserInfo(){
let vm = this;
let param = {
id:this.adminId
};
vm.$https(
{
url: "tUser/getById",
method: "get",
authType: this.backToken
},param)
.then(res => {
if(res.data.resultCode==='200'){
this.form = res.data.data;
console.log(this.form)
}else{
this.$toast(res.data.message)
}
})
.catch(function(err) {
console.log(err);
});
},
onCancel() { onCancel() {
this.$router.go(-1); this.$router.go(-1);
}, },
// 提交数据 // 提交数据
onSubmit() { onSubmit() {
console.log(this.form); console.log(this.form);
this.$toast.success("信息修改成功"); let vm = this;
this.$router.replace('/admin') let param = {};
for (let key in this.form) {
if (this.form[key]) {
param[key] = this.form[key];
}
}
console.log(param)
vm.$https(
{
url: "tUser/update",
method: "put",
authType: this.backToken
},param)
.then(res => {
if(res.data.resultCode==='200'){
this.form = res.data.data;
this.$toast.success("信息修改成功");
this.$router.replace('/admin')
}else{
this.$toast(res.data.message)
}
})
.catch(function(err) {
console.log(err);
});
} }
} }
}; };
...@@ -87,11 +135,10 @@ export default { ...@@ -87,11 +135,10 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.admin-detail-content { .admin-detail-content {
padding: 24px 12px; padding: 50px 16px 0;
height: calc(100% - 150px); // height: calc(100% - 150px);
overflow-y: auto; overflow-y: auto;
.input-box { .input-box {
margin-top: 44px;
padding-bottom: 32px; padding-bottom: 32px;
.van-cell { .van-cell {
line-height: 40px; line-height: 40px;
......
src/views/user/components/commitTab.vue
View file @ 71a3fdcb
...@@ -4,7 +4,27 @@ ...@@ -4,7 +4,27 @@
<span>基本信息</span> <span>基本信息</span>
</div> </div>
<div class="input-box"> <div class="input-box">
<van-field label="展板名称" v-model="form.banName" placeholder="请输入展板名称" input-align="right" /> <van-field
class="field-form-item"
readonly
clickable
name="boardName"
input-align="right"
:value="form.boardName"
label="展板名称"
placeholder="请选择"
:right-icon="showBoard ? 'arrow-up' : 'arrow-down'"
@click="showBoard = true"
:rules="[{ required: true }]"
/>
<van-popup v-model="showBoard" position="bottom">
<van-picker
show-toolbar
:columns="boardNameList"
@confirm="onConfirmBoard"
@cancel="showBoard = false"
/>
</van-popup>
<van-field <van-field
label="账户名" label="账户名"
v-model="form.username" v-model="form.username"
...@@ -15,13 +35,32 @@ ...@@ -15,13 +35,32 @@
<van-cell <van-cell
class="calendar-icon" class="calendar-icon"
title="学习时间" title="学习时间"
:value="form.studyTime|| ''" :value="form.studyTime || ''"
@click="onDisplay" @click="onDisplay"
:icon="form.studyTime || cellIcon" :icon="form.studyTime || cellIcon"
/> />
<van-calendar v-model="show" @close="onClose" @confirm="onConfirm" /> <van-popup v-model="show" position="bottom">
<van-field label="观影人数" v-model="form.num" placeholder="请输入观影人数" input-align="right" /> <van-datetime-picker
<van-field label="管理员账号" v-model="form.name" placeholder="请输入管理员账号" input-align="right" /> v-model="currentDate"
type="datetime"
title="选择学习时间"
:formatter="formatter"
@confirm="onConfirm"
@cancel="onClose"
/>
</van-popup>
<van-field
label="观影人数"
v-model="form.num"
placeholder="请输入观影人数"
input-align="right"
/>
<van-field
label="管理员账号"
v-model="form.name"
placeholder="请输入管理员账号"
input-align="right"
/>
<van-field <van-field
type="password" type="password"
label="管理员密码" label="管理员密码"
...@@ -42,6 +81,7 @@ ...@@ -42,6 +81,7 @@
@oversize="onOversize" @oversize="onOversize"
v-model="fileList" v-model="fileList"
accept="video/*" accept="video/*"
:after-read="uploadVideo"
multiple multiple
> >
<div class="avatar-plus"> <div class="avatar-plus">
...@@ -53,8 +93,7 @@ ...@@ -53,8 +93,7 @@
<img src="/images/applets/tip.png" alt /> <img src="/images/applets/tip.png" alt />
<span> <span>
最多支持上传 最多支持上传
<b>3</b> 段视频,每段时长 <b>3</b> 段视频,每段时长 <b>20s</b>。
<b>20s</b>。
</span> </span>
</div> </div>
</div> </div>
...@@ -70,6 +109,7 @@ ...@@ -70,6 +109,7 @@
accept="image/png, image/jpeg" accept="image/png, image/jpeg"
v-model="imgFileList" v-model="imgFileList"
multiple multiple
:after-read="uploadImg"
> >
<div class="avatar-plus"> <div class="avatar-plus">
<span>+</span> <span>+</span>
...@@ -86,7 +126,7 @@ ...@@ -86,7 +126,7 @@
</div> </div>
</div> </div>
<div class="field-title"> <div class="field-title">
<span>上传资料简介</span> <span>有话对党说</span>
</div> </div>
<div class="field-content"> <div class="field-content">
<van-field <van-field
...@@ -107,15 +147,50 @@ ...@@ -107,15 +147,50 @@
export default { export default {
data() { data() {
return { return {
form: {}, form: {
username: JSON.parse(localStorage.getItem("userInfo")).orgName,
organId: JSON.parse(localStorage.getItem("userInfo")).orgId,
images: [],
videos: [],
},
currentDate: new Date(),
boardList: [],
boardNameList: [],
showBoard: false,
cellIcon: "/images/applets/date.png", cellIcon: "/images/applets/date.png",
show: false, show: false,
fileList: [], fileList: [],
imgFileList: [] imgFileList: [],
}; };
}, },
mounted() {}, mounted() {
this.getBoardList();
},
methods: { methods: {
// 获取所属单位
getBoardList() {
let vm = this;
vm.$https({
url: "exhibitionBoard/getList",
method: "get",
authType: this.backToken,
})
.then((res) => {
if (res.data.resultCode === "200") {
console.log(res.data.data);
vm.boardList = res.data.data;
vm.boardNameList = res.data.data.map((item) => item.name);
}
})
.catch(function (err) {
console.log(err);
});
},
onConfirmBoard(value, index) {
this.form.boardName = value;
this.form.boardId = this.boardList[index].id;
this.showBoard = false;
},
onOversize(file) { onOversize(file) {
console.log(file); console.log(file);
this.$toast("文件大小不能超过 500kb"); this.$toast("文件大小不能超过 500kb");
...@@ -131,37 +206,147 @@ export default { ...@@ -131,37 +206,147 @@ export default {
// 确认日历 // 确认日历
onConfirm(event) { onConfirm(event) {
this.show = false; this.show = false;
this.form.studyTime = this.formatDate(event); this.form.studyTime = this.timeStamp2String(event);
},
// 格式转化
timeStamp2String(time) {
var datetime = new Date();
datetime.setTime(time);
var year = datetime.getFullYear();
var month =
datetime.getMonth() + 1 < 10
? "0" + (datetime.getMonth() + 1)
: datetime.getMonth() + 1;
var date =
datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
var hour =
datetime.getHours() < 10
? "0" + datetime.getHours()
: datetime.getHours();
var minute =
datetime.getMinutes() < 10
? "0" + datetime.getMinutes()
: datetime.getMinutes();
var second =
datetime.getSeconds() < 10
? "0" + datetime.getSeconds()
: datetime.getSeconds();
return (
year +
"-" +
month +
"-" +
date +
" " +
hour +
":" +
minute +
":" +
second
);
}, },
// 格式化日历 formatter(type, value) {
formatDate(date) { if (type === "year") {
date = new Date(date); return `${value}年`;
return `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}`; } else if (type === "month") {
return `${value}月`;
} else if (type === "day") {
return `${value}日`;
} else if (type === "hour") {
return `${value}时`;
}
return `${value}分`;
},
uploadImg(file) {
let vm = this;
const param = new FormData();
param.append("file", file.file);
vm.$https(
{
url: "file/image/upload",
method: "post",
authType: this.backToken,
},
param
)
.then((res) => {
this.form.images.push(res.data.url);
})
.catch(function (err) {
console.log(err);
});
},
uploadVideo(file) {
let vm = this;
const param = new FormData();
param.append("file", file.file);
vm.$https(
{
url: "file/video/upload",
method: "post",
authType: this.backToken,
},
param
)
.then((res) => {
this.form.videos.push(...res.data.urlList);
})
.catch(function (err) {
console.log(err);
});
}, },
// 提交数据 // 提交数据
onSubmit() { onSubmit() {
console.log(this.form); let vm = this;
this.$toast.success("提交成功"); let param = {};
this.$emit('updateActive',1) for (let key in this.form) {
} if (this.form[key]) {
} param[key] = this.form[key];
}
}
param.images = [...param.images, ...param.videos];
param.images = param.images.join(",");
delete param.videos;
console.log(param);
vm.$https(
{
url: "interaction/add",
method: "post",
authType: this.backToken,
},
vm.$qs.stringify(param)
)
.then((res) => {
if (res.data.resultCode === "200") {
this.$toast.success("提交成功");
// this.$emit('updateActive',1)
this.$router.replace("/success");
} else {
this.$toast(res.data.message);
}
})
.catch(function (err) {
console.log(err);
});
},
},
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.commit-page-content { .commit-page-content {
padding: 24px 12px; padding: 24px 12px;
height: calc(100% - 200px); height: calc(100% - 200px);
overflow-y: auto; overflow-y: auto;
.field-title { .field-title {
position: relative; position: relative;
padding-bottom: 20px; padding-bottom: 20px;
span { span {
color: #333; color: #333;
font-size: 16px; font-size: 16px;
line-height: 20px; line-height: 20px;
padding-left: 16px; padding-left: 16px;
&:before { &:before {
content: ""; content: "";
height: 16px; height: 16px;
width: 4px; width: 4px;
...@@ -171,88 +356,88 @@ export default { ...@@ -171,88 +356,88 @@ export default {
position: absolute; position: absolute;
left: 0; left: 0;
top: 2px; top: 2px;
} }
} }
} }
.field-content { .field-content {
padding-bottom: 32px; padding-bottom: 32px;
} }
.input-box { .input-box {
padding-bottom: 32px; padding-bottom: 32px;
.van-cell { .van-cell {
line-height: 40px; line-height: 40px;
padding-left: 0; padding-left: 0;
padding-right: 0; padding-right: 0;
border-bottom: 1px solid #eee; border-bottom: 1px solid #eee;
} }
.van-cell:after { .van-cell:after {
display: none; display: none;
}
} }
.calendar-icon { }
.calendar-icon {
.van-icon { .van-icon {
position: absolute; position: absolute;
width: 20px; width: 20px;
height: 20px; height: 20px;
right: 0; right: 0;
bottom: 22px; bottom: 22px;
z-index: 2; z-index: 2;
}
} }
.commit-page-button { }
.commit-page-button {
padding: 0 40px; padding: 0 40px;
box-sizing: border-box; box-sizing: border-box;
width: 100%; width: 100%;
.van-button--normal { .van-button--normal {
background: #a4151d; background: #a4151d;
border-radius: 4px; border-radius: 4px;
height: 40px; height: 40px;
width: 100%; width: 100%;
color: #fff; color: #fff;
border: none; border: none;
font-size: 16px; font-size: 16px;
}
} }
.van-field__control, }
.van-cell__value { .van-field__control,
.van-cell__value {
color: #333; color: #333;
} }
/deep/.field-textarea { /deep/.field-textarea {
min-height: 80px; min-height: 80px;
.van-field__value { .van-field__value {
background-color: #f5f5f5; background-color: #f5f5f5;
} }
.van-cell { .van-cell {
padding: 0; padding: 0;
}
} }
}
.upload-content { .upload-content {
.avatar-plus { .avatar-plus {
width: 48px; width: 48px;
height: 48px; height: 48px;
line-height: 48px; line-height: 48px;
text-align: center; text-align: center;
background-color: #f5f5f5; background-color: #f5f5f5;
border-radius: 1px; border-radius: 1px;
font-size: 25px; font-size: 25px;
color: #999; color: #999;
margin-bottom: 12px; margin-bottom: 12px;
} }
.tips { .tips {
img { img {
width: 12px; width: 12px;
height: 12px; height: 12px;
vertical-align: middle; vertical-align: middle;
} }
span { span {
margin-left: 4px; margin-left: 4px;
color: #666; color: #666;
font-size: 12px; font-size: 12px;
vertical-align: middle; vertical-align: middle;
} }
}
} }
}
} }
</style> </style>
\ No newline at end of file
src/views/user/components/contentTab.vue 0 → 100644
View file @ 71a3fdcb
<template>
<div class="learn-detail-content">
<div class="page-wrapper">
<form action="javascript:return true">
<van-search
type="search"
v-model="searchVal"
shape="round"
right-icon="search"
left-icon
placeholder="请输入学习内容名称"
@search="onRefresh"
/>
</form>
<div class="detail-body">
<van-pull-refresh v-model="refreshing" @refresh="onRefresh">
<van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
offset="50"
>
<van-cell v-for="(item,index) in tableData" :key="index">
<van-swipe-cell :stop-propagation="true">
<van-card :title="item.name" :thumb="item.cover" @click="goDetail(item)"/>
<template #right>
<van-button
@click="optFn(item)"
square
:text="active?'启用':'删除'"
type="danger"
:class="{'delete-button':active===0,'enable-button':active===1}"
/>
</template>
</van-swipe-cell>
</van-cell>
</van-list>
</van-pull-refresh>
</div>
</div>
</div>
</template>
<script>
export default {
props: ["active","proId"],
data() {
return {
searchVal:"",
pageNum: 1,
pageSize: 8,
tableData:[],
loading: false,
finished: false,
refreshing: false,
flag:true,
};
},
watch:{
"active"(val,oldVal){
this.onRefresh()
}
},
mounted() {
this.getList()
},
methods: {
// 获得数据接口
getList() {
let vm = this;
let param = {
_index:this.pageNum,
_size:this.pageSize,
isPublished: this.active!==1,
learningProjectId:this.proId,
nameOrCode: this.searchVal
};
vm.$https(
{
url: "learningContent/getPageList",
method: "post",
authType: this.backToken
},
vm.$qs.stringify(param)
).then(res => {
if(res.data.resultCode==='200'){
vm.loading = false
let data = res.data.data;
vm.tableData = vm.flag ? data.records :vm.tableData.concat(data.records)
vm.flag = false
vm.refreshing = false;
vm.pageNum = vm.pageNum + 1
vm.finished = data.records.length < vm.pageSize ? true : false
vm.tableData = [...vm.tableData]
}else{
vm.$message({type:'error',message:res.data.message})
}
})
.catch(function(err) {
console.log(err);
})
},
// 列表的load上拉加载事件
onLoad() {
if(!this.flag){
console.log("加载数据");
this.loading = true;
this.flag = false;
this.getList();
}
},
onRefresh() {
// 清空列表数据
this.finished = false;
this.flag = true;
this.loading = true;
this.pageNum = 1;
this.getList();
},
optFn(item) {
if (this.active === 1) {
this.changeStatus(true,item.id)
} else {
this.changeStatus(false,item.id)
}
},
// 启用 禁用
changeStatus(flag,id){
let vm = this;
let param = {
id:id,
isPublish:flag
};
vm.$https(
{
url: `learningContent/enable/${id}`,
method: "put",
authType: this.backToken
},vm.$qs.stringify(param))
.then(res => {
if(res.data.resultCode==='200'){
this.$toast(res.data.message)
this.onRefresh()
}else{
this.$toast(res.data.message)
}
})
.catch(function(err) {
console.log(err);
});
},
goDetail(item) {
this.$router.push({path:'/learnDetail',query:{id:item.id}})
}
}
};
</script>
<style lang="scss" scoped>
.learn-detail-content {
height: calc(100vh - 100px);
.page-wrapper{
height: 100%;
}
.van-search {
padding: 20px 0;
.van-cell {
line-height: 30px;
}
}
/deep/.van-field__right-icon {
color: #ac9374;
.van-icon {
font-size: 20px;
}
}
.detail-body {
height: calc(100% - 80px);
overflow-y: auto;
.van-pull-refresh {
height: 100%;
}
.van-cell {
padding: 0;
}
.van-cell::after {
border-bottom: none;
}
}
.delete-button {
height: 100%;
background: #a4151d;
font-size: 16px;
}
.enable-button {
height: 100%;
background: #6bc20b;
font-size: 16px;
}
.van-button--danger {
border: none;
}
.van-card {
padding: 16px;
background-color: transparent;
border-bottom: 1px solid #eee;
.van-card__thumb {
width: 64px;
height: 40px;
}
.van-card__content {
min-height: 40px;
.van-card__title {
line-height: 40px;
font-size: 16px;
color: #333;
}
}
}
}
</style>
\ No newline at end of file
src/views/user/components/detailTab.vue deleted 100644 → 0
View file @ 187e0ddc
<template>
<div class="learn-detail-content">
<div class="page-wrapper">
<van-search
v-model="searchVal"
shape="round"
right-icon="search"
left-icon
placeholder="请输入搜索关键词"
/>
<div class="detail-body">
<van-swipe-cell v-for="(item,index) in list" :key="index" :stop-propagation="true">
<van-card :title="item.title" :thumb="item.image" @click="goDetail(item)"/>
<template #right>
<van-button
@click="optFn(item)"
square
:text="active?'启用':'删除'"
type="danger"
:class="{'delete-button':active===0,'enable-button':active===1}"
/>
</template>
</van-swipe-cell>
</div>
</div>
</div>
</template>
<script>
export default {
props: ["active"],
data() {
return {
searchVal:"",
list: [
{ image: "https://img01.yzcdn.cn/vant/cat.jpeg", title: "学习内容1" },
{ image: "https://img01.yzcdn.cn/vant/cat.jpeg", title: "学习内容2" },
{ image: "https://img01.yzcdn.cn/vant/cat.jpeg", title: "学习内容3" },
{ image: "https://img01.yzcdn.cn/vant/cat.jpeg", title: "学习内容4" }
]
};
},
mounted() {},
methods: {
optFn(item) {
if (this.active === 1) {
console.log("启用", item);
} else {
console.log("删除", item);
}
},
goDetail(item) {
console.log('12121',item);
this.$router.push({path:'/learnDetail',query:{id:item.title}})
}
}
};
</script>
<style lang="scss" scoped>
.learn-detail-content {
height: calc(100% - 150px);
overflow-y: auto;
.van-search {
padding: 20px 0;
.van-cell {
line-height: 30px;
}
}
/deep/.van-field__right-icon {
color: #ac9374;
.van-icon {
font-size: 20px;
}
}
.delete-button {
height: 100%;
background: #a4151d;
font-size: 16px;
}
.enable-button {
height: 100%;
background: #6bc20b;
font-size: 16px;
}
.van-button--danger {
border: none;
}
.van-card {
padding: 16px;
background-color: transparent;
border-bottom: 1px solid #eee;
.van-card__thumb {
width: 64px;
height: 40px;
}
.van-card__content {
min-height: 40px;
.van-card__title {
line-height: 40px;
font-size: 16px;
color: #333;
}
}
}
}
</style>
\ No newline at end of file
src/views/user/components/historyTab.vue
View file @ 71a3fdcb
<template> <template>
<div class="history-page-content"> <div class="history-page-content">
<div class="page-wrapper"> <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
<div class="field-title"> <van-list
<span>2021/03/05</span> v-model="loading"
</div> :finished="finished"
<van-collapse v-model="activeNames"> finished-text="没有更多了"
<van-collapse-item name="1"> @load="onLoad"
<template #title> offset="50"
<div>建档伟业<span class="author">丁一一</span> >
</div> <van-cell v-for="(item,index) in tableData" :key="index">
</template> <div class="field-title">
<div class="content"> <span>{{item.createTime}}</span>
<!-- <div class="learnvideo"> </div>
<div class="learn-title">学习视频</div> <van-collapse v-model="activeNames">
<div class="learn-body"> <van-collapse-item :name="item.id">
<video src=""></video> <template #title>
<video src=""></video> <div>{{item.name||'妹纸'}}<span class="author">{{item.username}}</span>
<video src=""></video> </div>
</template>
<div class="content">
<div class="learnvideo">
<div class="learn-title">学习视频</div>
<div class="learn-body">
<span v-for="(s,i) in item.videos" :key="i">
<video controls width='100%' height='100%' poster="images/applets/video.png">
<source :src="s" />
</video>
<!-- autoplay="autoplay"
x5-playsinline='true'
webkit-playsinline='true'
playsinline='true'
x-webkit-airplay='true'
x5-video-player-type='h5-page'
x5-video-player-fullscreen='true'
x5-video-ignore-metadata='true' -->
</span>
</div>
</div> </div>
</div> --> <div class="learnphoto">
<div class="learnphoto"> <div class="learn-title">学习照片</div>
<div class="learn-title">学习照片</div> <div class="learn-body">
<div class="learn-body"> <img :src="s" v-for="(s,i) in item.images" :key="i" alt="" @click="sceneImg(item.images,i)">
<img src="https://img01.yzcdn.cn/vant/apple-1.jpg" alt=""> </div>
<img src="https://img01.yzcdn.cn/vant/apple-1.jpg" alt="">
<img src="https://img01.yzcdn.cn/vant/apple-1.jpg" alt="">
</div> </div>
</div> <div class="learntextarea">
<div class="learntextarea"> <div class="learn-title">有话对党说</div>
<div class="learn-title">有话对党说</div> <div class="learn-body">{{item.content}}</div>
<div class="learn-body">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet.
</div> </div>
</div> </div>
<!-- <van-image-preview :images="images"/> --> </van-collapse-item>
</div> </van-collapse>
</van-collapse-item> </van-cell>
<van-collapse-item title="伟大成就" name="2">内容</van-collapse-item> </van-list>
</van-collapse> </van-pull-refresh>
</div>
</div> </div>
</template> </template>
<script> <script>
import { ImagePreview } from "vant"; // 引入Vant图片预览组件
export default { export default {
data() { data() {
return { return {
activeNames: ['1'], activeNames: ['1'],
images: [ pageNum: 1,
'https://img01.yzcdn.cn/vant/apple-1.jpg', pageSize: 8,
'https://img01.yzcdn.cn/vant/apple-2.jpg', tableData:[],
], loading: false,
finished: false,
refreshing: false,
flag:true,
}; };
}, },
mounted() {}, mounted() {
methods: {} this.getList()
},
methods: {
// 图片预览
sceneImg(images,index) {
ImagePreview({
images:images, //需要预览的图片 URL 数组
showIndex:true, //是否显示页码
loop:false, //是否开启循环播放
startPosition:index //图片预览起始位置索引
})
},
// 获得数据接口
getList() {
let vm = this;
let param = {
_index:this.pageNum,
_size:this.pageSize,
orgId: JSON.parse(localStorage.getItem("userInfo")).orgId
};
vm.$https(
{
url: "interaction/getList",
method: "post",
authType: this.backToken
},
vm.$qs.stringify(param)
).then(res => {
if(res.data.resultCode==='200'){
vm.loading = false
let data = res.data.data;
let arr=[]
data.records.forEach(item=>{
arr= item.images.split(',')
item.videos =[]
item.images =[]
item.audio =[]
arr.forEach((result)=>{
if (/\.(MP4|mp4)/.test(result)){
item.videos.push(result)
}else if (/\.(MP3|mp3)/.test(result)){
item.audio.push(result)
}else {
item.images.push(result)
}
})
})
vm.tableData = vm.flag ? data.records :vm.tableData.concat(data.records)
vm.flag = false
vm.refreshing = false;
vm.pageNum = vm.pageNum + 1
vm.finished = data.records.length < vm.pageSize ? true : false
vm.tableData = [...vm.tableData]
}else{
vm.$message({type:'error',message:res.data.message})
}
})
.catch(function(err) {
console.log(err);
})
},
// 列表的load上拉加载事件
onLoad() {
if(!this.flag){
console.log("加载数据");
this.loading = true;
this.flag = false;
this.getList();
}
},
onRefresh() {
// 清空列表数据
this.finished = false;
this.flag = true;
this.loading = true;
this.pageNum =1;
this.getList();
},
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.history-page-content { .history-page-content {
padding: 24px 12px; padding: 24px 12px;
height: calc(100% - 150px); height: calc(100% - 200px);
overflow-y: auto; overflow-y: auto;
.van-pull-refresh {
overflow-y:auto;
}
.van-cell {
padding-left: 0;
padding-right: 0;
}
.van-hairline--top-bottom::after {
border-width: 0;
}
.field-title { .field-title {
position: relative; position: relative;
padding-bottom: 20px; // padding-bottom: 20px;
span { span {
color: #333; color: #333;
font-size: 16px; font-size: 16px;
......
src/views/user/components/learnContent.vue
View file @ 71a3fdcb
...@@ -4,10 +4,10 @@ ...@@ -4,10 +4,10 @@
<div class="content"> <div class="content">
<van-tabs type="card" v-model="activeTab"> <van-tabs type="card" v-model="activeTab">
<van-tab title="启用列表"> <van-tab title="启用列表">
<detail-tab :active="activeTab"/> <content-tab :active="activeTab" :proId="proId"/>
</van-tab> </van-tab>
<van-tab title="禁用列表"> <van-tab title="禁用列表">
<detail-tab :active="activeTab"/> <content-tab :active="activeTab" :proId="proId"/>
</van-tab> </van-tab>
</van-tabs> </van-tabs>
</div> </div>
...@@ -16,17 +16,21 @@ ...@@ -16,17 +16,21 @@
</template> </template>
<script> <script>
import detailTab from './detailTab.vue' import contentTab from './contentTab.vue'
import Header from '@/components/Header/index.vue' import Header from '@/components/Header/index.vue'
export default { export default {
components:{Header,detailTab}, components:{Header,contentTab},
data() { data() {
return { return {
activeTab: 0, activeTab: 0,
proId:''
}; };
}, },
mounted() {}, mounted() {
methods: {} this.proId = this.$route.query.id;
},
methods: {
}
}; };
</script> </script>
...@@ -34,10 +38,10 @@ export default { ...@@ -34,10 +38,10 @@ export default {
.learn-content-container { .learn-content-container {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
padding: 16px; padding: 50px 16px 16px;
box-sizing: border-box; box-sizing: border-box;
.content { .content {
margin-top: 44px; height: calc(100vh - 66px);
} }
/deep/.van-tabs--card > .van-tabs__wrap { /deep/.van-tabs--card > .van-tabs__wrap {
height: 40px; height: 40px;
......
src/views/user/components/learnDetail.vue
View file @ 71a3fdcb
<template> <template>
<div class="learn-detail-page-content"> <div class="learn-detail-page-content">
<Header title="管理员详情"/> <Header title="学习内容详情"/>
<div class="page-wrapper"> <div class="page-wrapper">
<div class="title-content"> <div class="title-content">
<div class="row-body"> <div class="row-body">
<div class="title-label">学习内容名称</div> <div class="title-label">学习内容名称</div>
<div class="title-body">建党伟业</div> <div class="title-body">{{list.name}}</div>
</div> </div>
<div class="row-body"> <div class="row-body">
<div class="title-label">学习内容宣传图</div> <div class="title-label">学习内容宣传图</div>
<div class="title-body"> <div class="title-body">
<img src="images/applets/bg_top.png" alt=""> <img :src="list.cover" alt="">
</div> </div>
</div> </div>
</div> </div>
<van-collapse v-model="activeNames" accordion> <van-collapse v-model="activeNames" accordion>
<van-collapse-item name="1" title="建党伟业"> <van-collapse-item :name="item.id" :title="item.name" v-for="(item,index) in list.exhibitionBoardList" :key="index">
<div class="content"> <div class="content">
<div class="row-body"> <div class="row-body">
<div class="title-label">展板版权方</div> <div class="title-label">展板版权方</div>
<div class="title-body">中国国家博物馆</div> <div class="title-body">{{item.assetCopyrightOwnerName}}</div>
</div> </div>
<div class="row-body"> <div class="row-body">
<div class="title-label">展板宣传图</div> <div class="title-label">展板宣传图</div>
<div class="title-body"> <div class="title-body">
<img src="images/applets/bg_top.png" alt=""> <img :src="item.cover" alt="">
</div> </div>
</div> </div>
<div class="detail-body"> <div class="detail-body">
<div class="learn-title">展板简介</div> <div class="learn-title">展板简介</div>
<div class="learn-body textarea"> <div class="learn-body textarea">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aenean euismod bibendum laoreet. {{item.remarks}}
</div> </div>
</div> </div>
<div class="detail-body"> <div class="detail-body">
<div class="learn-title">展板视频</div> <div class="learn-title">展板视频</div>
<div class="learn-body"> <div class="learn-body">
<img src="images/applets/video.png" alt=""> <span class="file-box" v-for="(s,i) in item.videoUrl" :key="i">
<span>建党伟业-中文.mp4</span> <video controls width='100%' height='100%' poster="images/applets/video.png">
<source :src="s.fileUrl" />
</video>
<span>{{s.fileName}}</span>
</span>
</div> </div>
</div> </div>
<div class="detail-body"> <div class="detail-body">
<div class="learn-title">展板音频</div> <div class="learn-title">展板音频</div>
<div class="learn-body"> <div class="learn-body">
<img src="images/applets/audio.png" alt=""> <span class="file-box" v-for="(s,i) in item.guideAudioUrl" :key="i">
中文.mp3 <audio controls width='100%' height='100%' poster="images/applets/audio.png">
<img src="images/applets/audio.png" alt=""> <source :src="s.fileUrl" />
英文.mp3 </audio>
<span>{{s.fileName}}</span>
</span>
</div> </div>
</div> </div>
</div> </div>
</van-collapse-item> </van-collapse-item>
<van-collapse-item title="伟大成就" name="2">内容</van-collapse-item>
</van-collapse> </van-collapse>
</div> </div>
</div> </div>
...@@ -64,28 +70,60 @@ export default { ...@@ -64,28 +70,60 @@ export default {
components:{Header}, components:{Header},
data() { data() {
return { return {
activeNames: ['1'], activeNames: [],
images: [ list:[]
'https://img01.yzcdn.cn/vant/apple-1.jpg',
'https://img01.yzcdn.cn/vant/apple-2.jpg',
],
}; };
}, },
mounted() {}, mounted() {
methods: {} this.id = this.$route.query.id;
this.getContentInfo()
},
methods: {
// 获取详情
getContentInfo(){
let vm = this;
let param = {
id:this.id
};
vm.$https(
{
url: `learningContent/get/${this.id}`,
method: "get",
authType: this.backToken
},param)
.then(res => {
if(res.data.resultCode==='200'){
this.list = res.data.data;
this.activeNames = this.list.exhibitionBoardList[0].id
this.list.exhibitionBoardList.forEach(item=>{
item.videoUrl =JSON.parse(item.videoUrl)
item.guideAudioUrl =JSON.parse(item.guideAudioUrl)
})
}else{
this.$toast(res.data.message)
}
})
.catch(function(err) {
console.log(err);
});
},
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.learn-detail-page-content { .learn-detail-page-content {
padding: 24px; padding: 50px 16px 16px;
overflow-y: auto; box-sizing: border-box;
.page-wrapper { .page-wrapper {
margin-top: 44px; padding-top: 20px;
width: 100%; width: 100%;
height: calc(100vh - 100px); height: calc(100vh - 80px);
overflow-y: auto; overflow-y: auto;
} }
.title-content {
padding: 0 10px;
}
.row-body { .row-body {
margin-bottom: 30px; margin-bottom: 30px;
display: flex; display: flex;
...@@ -124,7 +162,14 @@ export default { ...@@ -124,7 +162,14 @@ export default {
.detail-body { .detail-body {
margin-bottom: 20px; margin-bottom: 20px;
.learn-body{ .learn-body{
display: flex;
flex-wrap: wrap;
padding-bottom: 12px; padding-bottom: 12px;
.file-box {
width: 50%;
padding: 10px;
box-sizing: border-box;
}
img { img {
width: 32px; width: 32px;
height: auto; height: auto;
......
src/views/user/editPsd.vue
View file @ 71a3fdcb
...@@ -2,38 +2,44 @@ ...@@ -2,38 +2,44 @@
<div class="edit-psd-conatiner"> <div class="edit-psd-conatiner">
<Header title="修改密码"/> <Header title="修改密码"/>
<div class="edit-container"> <div class="edit-container">
<div class="input-box"> <van-form @submit="onSubmit">
<van-field <div class="input-box">
label="当前账号" <van-field
v-model="form.username" label="当前账号"
placeholder="请输入当前账号" readonly
input-align="right" v-model="form.username"
/> placeholder="请输入当前账号"
<van-field input-align="right"
label="当前密码" />
type="password" <van-field
v-model="form.password" label="当前密码"
placeholder="请输入当前密码" type="password"
input-align="right" v-model="form.oldPassWord"
/> placeholder="请输入当前密码"
<van-field input-align="right"
label="新密码" :rules="[{ required: true}]"
type="password" />
v-model="form.newPsd" <van-field
placeholder="请输入新密码" label="新密码"
input-align="right" type="password"
/> v-model="form.password"
<van-field placeholder="请输入新密码"
label="再次输入新密码" input-align="right"
v-model="form.againPsd" :rules="[{ required: true}]"
placeholder="请再次输入新密码" />
input-align="right" <van-field
/> label="再次输入新密码"
</div> v-model="form.againPsd"
<div class="admin-detail-button"> placeholder="请再次输入新密码"
<van-button type="default" plain @click="onCancle">取消</van-button> input-align="right"
<van-button type="default" @click="onSubmit">提交</van-button> :rules="[{ required: true}]"
</div> />
</div>
<div class="admin-detail-button">
<van-button type="default" plain native-type="button" @click="onCancle">取消</van-button>
<van-button type="default" native-type="submit">提交</van-button>
</div>
</van-form>
</div> </div>
<my-tabbar active="3"></my-tabbar> <my-tabbar active="3"></my-tabbar>
</div> </div>
...@@ -45,7 +51,9 @@ export default { ...@@ -45,7 +51,9 @@ export default {
components:{Header}, components:{Header},
data() { data() {
return { return {
form: {} form: {
username:JSON.parse(localStorage.getItem('userInfo')).userName
}
}; };
}, },
mounted() { mounted() {
...@@ -53,13 +61,45 @@ export default { ...@@ -53,13 +61,45 @@ export default {
}, },
methods: { methods: {
onCancle() { onCancle() {
this.form ={} this.form ={
username:JSON.parse(localStorage.getItem('userInfo')).userName
}
}, },
// 提交数据 // 提交数据
onSubmit() { onSubmit() {
console.log(this.form); if(this.form.password !== this.form.againPsd){
this.$toast.success("密码已修改,请用新密码重新登录系统"); this.$toast('两次输入的密码不一致')
this.$router.replace('/login') return false
}
let vm = this;
let param = {
password: this.form.password,
oldPassWord: this.form.oldPassWord,
};
vm.$https(
{
url: "tUser/editPwd",
method: "put",
authType: this.backToken
},
vm.$qs.stringify(param)
)
.then(res => {
if(res.data.resultCode==='200'){
localStorage.removeItem('token')
localStorage.removeItem('userInfo')
this.$toast.success("密码已修改,请用新密码重新登录系统");
this.$router.replace('/login')
}else{
this.$toast(res.data.message);
}
})
.catch(function(err) {
console.log(err);
});
} }
} }
}; };
...@@ -69,10 +109,12 @@ export default { ...@@ -69,10 +109,12 @@ export default {
.edit-psd-conatiner { .edit-psd-conatiner {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
padding: 16px; padding: 50px 16px 60px;
display: flex;
flex-direction: column;
box-sizing: border-box; box-sizing: border-box;
.edit-container { .edit-container {
margin-top: 44px;
} }
.input-box { .input-box {
......
src/views/user/learn.vue
View file @ 71a3fdcb
<template> <template>
<div class="learn-conatiner"> <div class="learn-conatiner">
<Header title="学习项目"/> <Header title="学习项目" />
<ul> <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
<li v-for="(item,index) in list" :key="index" @click="goDetail(item)"> <van-list
v-model="loading"
:finished="finished"
finished-text="没有更多了"
@load="onLoad"
offset="5"
>
<van-cell v-for="(item,index) in list" :key="index" @click="goDetail(item)">
<span>{{item.name}}</span> <span>{{item.name}}</span>
<img src="/images/applets/coming.png" alt /> <img src="/images/applets/coming.png" alt />
</li> </van-cell>
</ul> </van-list>
</van-pull-refresh>
<my-tabbar active="1"></my-tabbar> <my-tabbar active="1"></my-tabbar>
</div> </div>
</template> </template>
<script> <script>
import Header from '@/components/Header/index.vue' import Header from "@/components/Header/index.vue";
export default { export default {
components:{Header}, components: { Header },
data() { data() {
return { return {
list:[ loading: false,
{name:"十四大学习"}, finished: false,
{name:"十四大学习1"}, pageNum: 1,
{name:"十四大学习2"}, pageSize: 10,
{name:"十四大学习3"}, flag:true,
] list: [],
refreshing: false,
}; };
}, },
mounted(){ mounted() {
this.getList();
}, },
methods:{ methods: {
goDetail(item){ // 获取管理员列表
this.$router.push({path:'/learnContent',query:{id:item.name}}) getList() {
let vm = this;
let param = {
_index: this.pageNum,
_size: this.pageSize,
type: JSON.parse(localStorage.getItem("userInfo")).type
};
vm.$https(
{
url: "learningProject/getPageList",
method: "post",
authType: this.backToken
},
vm.$qs.stringify(param)
)
.then(res => {
let data = res.data.data;
this.loading = false
vm.list = this.flag ? data.records : vm.list.concat(data.records)
this.pageNum = this.pageNum + 1
this.finished = data.records.length < this.pageSize ? true : false
this.flag = false;
this.refreshing = false;
})
.catch(function(err) {
console.log(err);
});
},
// 列表的load上拉加载事件
onLoad() {
if(!this.flag){
console.log("加载数据");
this.loading = true;
this.flag = false;
this.getList();
} }
},
onRefresh() {
// 清空列表数据
this.finished = false;
this.flag = true;
this.loading = true;
this.pageNum =1;
this.getList();
},
goDetail(item) {
this.$router.push({ path: "/learnContent", query: { id: item.id } });
}
} }
}; };
</script> </script>
...@@ -40,13 +95,17 @@ export default { ...@@ -40,13 +95,17 @@ export default {
.learn-conatiner { .learn-conatiner {
width: 100%; width: 100%;
height: 100vh; height: 100vh;
padding: 16px; padding: 50px 16px 60px;
display: flex;
flex-direction: column;
box-sizing: border-box; box-sizing: border-box;
ul { .van-pull-refresh {
margin-top: 44px; overflow-y:auto;
list-style: none; }
.van-cell {
padding: 0;
} }
li { .van-cell__value {
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
background: #f8f8f8; background: #f8f8f8;
...@@ -56,8 +115,8 @@ export default { ...@@ -56,8 +115,8 @@ export default {
color: #333333; color: #333333;
margin-top: 20px; margin-top: 20px;
img { img {
width: 24px; width: 24px;
height: 24px; height: 24px;
} }
} }
} }
......
vue.config.js
View file @ 71a3fdcb
...@@ -18,7 +18,15 @@ module.exports = { ...@@ -18,7 +18,15 @@ module.exports = {
disableHostCheck: false, disableHostCheck: false,
https: false, https: false,
hotOnly: false, // See https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#configuring-proxy hotOnly: false, // See https://github.com/vuejs/vue-cli/blob/dev/docs/cli-service.md#configuring-proxy
// proxy: {} proxy: {
'/mall': {
target: "http://192.168.110.67/mall",
changeOrigin: true,
pathRewrite: {
'^/mall': '/' // 重写接口
}
}
}
}, },
css: { css: {
......
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