Commit 87556e15 authored by mengqingrui's avatar mengqingrui

框架搭建

parents
Pipeline #188 failed with stages
.DS_Store
node_modules
/dist
# local env files
.env.local
.env.*.local
# Log files
npm-debug.log*
yarn-debug.log*
yarn-error.log*
pnpm-debug.log*
# Editor directories and files
.idea
.vscode
*.suo
*.ntvs*
*.njsproj
*.sln
*.sw?
# live
## Project setup
```
npm install
```
### Compiles and hot-reloads for development
```
npm run serve
```
### Compiles and minifies for production
```
npm run build
```
### Lints and fixes files
```
npm run lint
```
### Customize configuration
See [Configuration Reference](https://cli.vuejs.org/config/).
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
{
"compilerOptions": {
"target": "es5",
"module": "esnext",
"baseUrl": "./",
"moduleResolution": "node",
"paths": {
"@/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
}
}
This diff is collapsed.
{
"name": "live",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
"dependencies": {
"@liveqing/liveplayer": "^2.7.0",
"axios": "^1.1.3",
"core-js": "^3.8.3",
"jquery": "^3.6.1",
"js-md5": "^0.7.3",
"mint-ui": "^2.2.13",
"mqtt": "^4.3.7",
"node-polyfill-webpack-plugin": "^2.0.1",
"pdfh5": "^1.4.2",
"qs": "^6.11.0",
"vue": "^2.6.14",
"vue-pdf": "^4.3.0",
"vue-router": "^3.5.2",
"vue-video-player": "^5.0.2",
"vuex": "^4.1.0"
},
"devDependencies": {
"@babel/core": "^7.12.16",
"@babel/eslint-parser": "^7.12.16",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-eslint": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"copy-webpack-plugin": "^4.6.0",
"eslint": "^7.32.0",
"eslint-plugin-vue": "^8.0.3",
"postcss-loader": "^7.0.1",
"postcss-px-to-viewport": "^1.1.1",
"videojs-contrib-hls": "^5.15.0",
"vue-template-compiler": "^2.6.14"
},
"eslintConfig": {
"root": true,
"env": {
"node": true
},
"extends": [
"plugin:vue/essential",
"eslint:recommended"
],
"parserOptions": {
"parser": "@babel/eslint-parser"
},
"rules": {
"generator-star-spacing": "off",
"no-debugger": "off",
"no-tabs": "off",
"no-unused-vars": "off",
"no-console": "off",
"no-irregular-whitespace": "off",
"vue/no-unused-components": "off",
"no-undef": "off"
}
},
"browserslist": [
"> 1%",
"last 2 versions",
"not dead"
]
}
module.exports = {
plugins: {
autoprefixer: {},
"postcss-px-to-viewport": {
viewportWidth: 375,//视窗的宽度,对应的是我们设计稿的宽度
viewportHeight: 812,//视窗的高度,对应的是我们设计稿的高度
unitPrecision: 5,//制定‘px’转换为视窗单位的小数位数(很多时候无法整除)
viewportUnit: 'vw',//指定需要转换成的视窗单位,建议使用vw
selectorBlackList: ['ignore', 'tab-bar', 'tab-bar-item'],//指定不需要转换的类,
minPixelValue: 1,//小于或等于‘1px’不转换为视窗单位
mediaQuery: false//允许在媒体查询中转换为‘px’
}
}
}
\ No newline at end of file
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<script src="./static/js/mqttws31.js" type="text/javascript"></script>
<title><%= htmlWebpackPlugin.options.title %></title>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
<script src="./js/liveplayer-lib.min.js"></script>
<!-- <script src="<%= BASE_URL %>js/liveplayer-element.min.js"></script> -->
</body>
</html>
This diff is collapsed.
This diff is collapsed.
<template>
<div id="app">
<!-- <img alt="Vue logo" src="./assets/logo.png"> -->
<div v-if="$route.path!='/'">
<router-view />
</div>
<!-- 登陆 -->
<div v-if="$route.path=='/'">
<router-view />
</div>
</div>
</template>
<script>
// import sign from './views/sign.vue'
export default {
name: 'App',
components: {
// sign
}
}
</script>
<style>
*{
margin: 0;
padding: 0;
}
/* #app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
} */
</style>
// mqtt
var client;
var destination; //直播间id
var options;
// item:{
// user,
// pwd,
// domain,
// port,
// destination
// }
function connect(item, fun) {
console.log(item)
options = {
userName: item.user,
password: item.pwd,
useSSL: true,
onSuccess: function () {
destination = item.destination;
client.subscribe(destination, {
qos: 2
});
console.log(destination + ' 连接成功');
},
onFailure: function (err){
console.log('连接失败')
console.log(err)
},
};
var clientID = 'admin-' + Math.floor(Math.random() * 1000000000);
client = new Messaging.Client(item.domain, item.port, clientID);
client.onMessageArrived = onMessageArrived;
client.onConnectionLost = onConnectionLost;
client.cleanSession = 1;
client.connect(options);
//收到评论时
function onMessageArrived(message) {
console.log("阿斯蒂芬",message)
var jsonData = JSON.parse(message.payloadString);
if (fun) {
fun(jsonData);
}
}
// 断线重连
function onConnectionLost(responseObject) {
if (responseObject.errorCode !== 0) { //非主动断开
console.log("onConnectionLost:" + responseObject.errorMessage);
client.connect(options);
}
}
/*====mqtt相关=====*/
}
// 路由改变时关闭订阅
function disconnect() {
if (client) {
client.disconnect();
client = null;
console.log('连接已断开');
}
}
export default {
connect,
disconnect
}
\ No newline at end of file
This diff is collapsed.
This source diff could not be displayed because it is too large. You can view the blob instead.
import Vue from 'vue';
import object from './request';
// import store from '../store/index';
import qs from 'qs'
// 创建vue实例
let vue = new Vue();
const service = object.service; // 带token
const login = object.loginService; // 不带token
const uploader = object.uploader; // 上传
const file = object.file; // 上传
const downloader = object.downloader; // 下载
// const wxservice = object.wxservice; // 下载
// const contractURL = object.contractURL //合同url
const server={
// 登录
login: {
// 密码登录
loginByPwd: function(data) {
return login.post('/auth/douniuapp', data)
},
// 获取验证码
getMessage: function(data) {
return login.post('/douniuapp/unsign/smscode', data)
},
// 手机验证码登录
loginByPhone: function(data) {
return login.post('/auth/douniuphone', data)
},
//注册
registerPhone:function(data){
return login.post('/auth/registerAndLogin', data)
},
},
// 基础
live: {
liveDetail:function(data){
return service.post('/app/live/liveDetail', data)
},
videoList:function(data){
return service.post('/app/live/getLiveRepeatList', data)
},
setMessage:function(data){
return service.post('/app/live/sendDanmu', data)
},
getLive:function(data){
return service.post('/app/live/liveList', data)
}
},
}
export default server
This diff is collapsed.
<template>
<div class="hello">
<h1>{{ msg }}</h1>
<p>
For a guide and recipes on how to configure / customize this project,<br>
check out the
<a href="https://cli.vuejs.org" target="_blank" rel="noopener">vue-cli documentation</a>.
</p>
<h3>Installed CLI Plugins</h3>
<ul>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-babel" target="_blank" rel="noopener">babel</a></li>
<li><a href="https://github.com/vuejs/vue-cli/tree/dev/packages/%40vue/cli-plugin-eslint" target="_blank" rel="noopener">eslint</a></li>
</ul>
<h3>Essential Links</h3>
<ul>
<li><a href="https://vuejs.org" target="_blank" rel="noopener">Core Docs</a></li>
<li><a href="https://forum.vuejs.org" target="_blank" rel="noopener">Forum</a></li>
<li><a href="https://chat.vuejs.org" target="_blank" rel="noopener">Community Chat</a></li>
<li><a href="https://twitter.com/vuejs" target="_blank" rel="noopener">Twitter</a></li>
<li><a href="https://news.vuejs.org" target="_blank" rel="noopener">News</a></li>
</ul>
<h3>Ecosystem</h3>
<ul>
<li><a href="https://router.vuejs.org" target="_blank" rel="noopener">vue-router</a></li>
<li><a href="https://vuex.vuejs.org" target="_blank" rel="noopener">vuex</a></li>
<li><a href="https://github.com/vuejs/vue-devtools#vue-devtools" target="_blank" rel="noopener">vue-devtools</a></li>
<li><a href="https://vue-loader.vuejs.org" target="_blank" rel="noopener">vue-loader</a></li>
<li><a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">awesome-vue</a></li>
</ul>
</div>
</template>
<script>
export default {
name: 'HelloWorld',
props: {
msg: String
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
h3 {
margin: 40px 0 0;
}
ul {
list-style-type: none;
padding: 0;
}
li {
display: inline-block;
margin: 0 10px;
}
a {
color: #42b983;
}
</style>
<template>
<div class="pdfBox">
<!-- <span class="back"> back </span> -->
<div id="previewPdf"></div>
<!-- <img class="back" src="../common/img/unCheck.png" alt=""> -->
</div>
</template>
<script>
import pdfh5 from 'pdfh5';
import 'pdfh5/css/pdfh5.css'
export default {
data () {
return {
pdfh5: null,
}
},
methods: {
openPdf(url){ //url:PDF文件地址
this.pdfh5 = new pdfh5('#previewPdf', {
pdfurl: url
});
this.pdfh5.on('success', ()=>{
console.log('pdf渲染成功');
});
}
}
}
</script>
<style scoped>
.pdfBox {
position: relative;
top: 0;
left: 0;
width: 100vw;
height: 100vh;
background: #000;
overflow: hidden;
z-index: 99;
}
#previewPdf {
height: 100vh;
}
.back{
position: fixed;
top: 1vw;
left: 1vw;
/* font-size: 10vw; */
height: 10vw;
width: 10vw;
/* color: black; */
}
</style>
\ No newline at end of file
import Vue from 'vue'
import App from './App.vue'
import axios from 'axios'
import router from './router'
import Mint from 'mint-ui';
import md5 from 'js-md5';
import request from './axios/request'
import store from './store/index'
import server from './axios/api'
import VideoPlayer from 'vue-video-player'
import 'vue-video-player/src/custom-theme.css'
import 'video.js/dist/video-js.css'
//引入 hls,视频直播(m3u8)必须引入的
import 'videojs-contrib-hls'
//播放rtmp视频
// import 'videojs-flash'
import Qs from 'qs'
Vue.use(Mint);
Vue.use(VideoPlayer);
Vue.prototype.server = server;
Vue.prototype.store = store;
Vue.prototype.request = request;
Vue.config.productionTip = false
Vue.prototype.qs = Qs;
Vue.prototype.axios = axios;
Vue.prototype.router = router;
Vue.prototype.$md5 = md5;
new Vue({
render: h => h(App),
router,
}).$mount('#app')
import Vue from 'vue'
import Router from 'vue-router'
import store from '../store/index'
import index from '../views/sign'
import password from '../views/password'
import register from '../views/register'
import live from '../views/live'
import pdf from '../views/pdf'
import fullScreen from '../views/fullScreen'
// import login from '../views/login'
// import monthlyReport from '@/components/monthlyReport'//月报
// import personnelManagement from '@/components/personnelManagement'//人员管理
// import commission from '@/components/commission/commission'//用户提成
// import commissionDetail from '@/components/commission/detail'//用户提成详情
// import commissionPersonalDetail from '@/components/commission/personalDetail'//用户提成个人详情
Vue.use(Router)
const router = new Router({
routes:[
{
path: '/login',
name: 'index',
component: index,
meta: {
requireAuth: true
} // 判断是否需要登录
},
{
path: '/',
name: 'index',
component: index,
meta: {
requireAuth: true
} // 判断是否需要登录
},
{
path: '/password',
name: 'password',
component: password,
},
{
path: '/register',
name: 'register',
component: register,
},
{
path: '/live',
name: 'live',
component: live,
},
{
path: '/pdf',
name: 'pdf',
component: pdf,
},
{
path: '/fullScreen',
name: 'fullScreen',
component: fullScreen,
},
// {
// path: '/login',
// name: 'login',
// component: login
// },
// //月报
// {
// path: '/douniu/statistical/MonthlyReport',
// name: 'monthlyReport',
// component: monthlyReport,
// meta: {
// requireAuth: true
// }
// },
// //人员管理
// {
// path: '/powerManage',
// name: 'personnelManagement',
// component: personnelManagement,
// meta: {
// requireAuth: true
// }
// },
// //用户提成
// {
// path: '/roleManage',
// name: 'commission',
// component: commission,
// meta: {
// requireAuth: true
// }
// },
// //用户提成详情
// {
// path: '/departmentManage',
// name: 'commissionDetail',
// component: commissionDetail,
// meta: {
// requireAuth: true
// }
// },
// //用户提成个人详情
// {
// path: '/program',
// name: 'commissionPersonalDetail',
// component: commissionPersonalDetail,
// meta: {
// requireAuth: true
// }
// },
]
})
//去掉路由重复跳转报错
'push,replace'.split(',').map(method => router[method] = function () {
return Router.prototype[method].apply(this, arguments).catch(err => err)
})
// 注册全局钩子用来拦截导航
router.beforeEach((to, from, next) => {
const token = store.state.token;
const admitPath = store.state.admitPath;
// const addPath = store.state.addPath;
// 禁f12
window.onkeydown = function (e) {
if (e.keyCode === 123 && to.meta.banF12) {
e.preventDefault()
}
}
if (to.meta.requireAuth) { // 判断该路由是否需要登录权限
if (to.path == '/login') {
next();
return;
}
// console.log(token)
if (token) { // 通过vuex state获取当前的token是否存在
if (to.path == '/' || to.path == '') {
next();
return;
}
for (var i in admitPath) {
if (to.path == admitPath[i]) {
next();
return;
}
}
// for (var i in addPath) {
// if (to.path == addPath[i]) {
// next();
// return;
// }
// }
console.log(to.path)
console.log('没有访问权限');
} else {
console.log('该页面需要登陆')
next({
path: '/login',
// query: { redirect: to.fullPath } // 将跳转的路由path作为参数,登录成功后跳转到该路由
})
}
} else {
next()
}
})
export default router
// store index.js
import Vue from 'vue'
import Vuex from 'vuex'
// import callServer from '../assets/callServer'
// import common from '../assets/common'
// 获取随机数
// function getRandom(){
// if(window.sessionStorage.getItem('random')){
// return window.sessionStorage.getItem('random');
// }else{
// var random = (new Date()).valueOf() + common.randomString(5);
// window.sessionStorage.setItem('random', random);
// return random;
// }
// }
Vue.use(Vuex)
// 初始化时用sessionStore.getItem('token'),这样子刷新页面就无需重新登录
const state = {
ID: window.sessionStorage.getItem('ID'),
user: window.sessionStorage.getItem('user'),
admitPath: JSON.parse(window.sessionStorage.getItem('admitPath')), //菜单路由
addPath: JSON.parse(window.sessionStorage.getItem('addPath')), //新增路由
routeList: JSON.parse(window.sessionStorage.getItem('routeList')),
// random: getRandom(), //图片验证码随机数
token: window.sessionStorage.getItem('token'),
refreshToken: window.sessionStorage.getItem('refreshToken'),
contractToken: window.sessionStorage.getItem('contractToken'),
contractRefreshToken: window.sessionStorage.getItem('contractRefreshToken'),
}
const mutations = {
//将token保存到sessionStorage里,token表示登陆状态
SET_TOKEN: (state, data) => {
state.token = data;
window.sessionStorage.setItem('token', data);
},
// 刷新token
SET_REFRESH_TOKEN: (state, data) => {
state.refreshToken = data;
window.sessionStorage.setItem('refreshToken', data);
},
//合同token
SET_CONTRACT_TOKEN: (state, data) => {
state.contractToken = data;
window.sessionStorage.setItem('contractToken', data);
},
// 合同刷新token
SET_CONTRACT_REFRESH_TOKEN: (state, data) => {
state.contractRefreshToken = data;
window.sessionStorage.setItem('contractRefreshToken', data);
},
// 设置路由列表
SET_ROUTR_LIST: (state, data) => {
state.routeList=data;
window.sessionStorage.setItem('routeList', JSON.stringify(data));
},
// 设置可进入路由
SET_ADMIT_PATH: (state, data) => {
state.admitPath=data;
window.sessionStorage.setItem('admitPath', JSON.stringify(data));
},
// 添加可进入路由
ADD_ADMIT_PATH: (state, data) => {
var temp = state.addPath;
if(!temp){
temp = [];
}
for(var i in temp){
if(data==temp[i]){
return;
}
}
temp.push(data);
state.addPath=temp;
window.sessionStorage.setItem('addPath', JSON.stringify(temp));
},
// 删除可进入路由
DEL_ADMIT_PATH: (state, data) => {
var temp = state.addPath;
for(var i in temp){
if(data==temp[i]){
temp.splice(i,1)
break;
}
}
state.addPath=temp;
window.sessionStorage.setItem('addPath', JSON.stringify(temp));
},
//获取用户名
SET_USER: (state, data) => {
// 把用户名存起来
state.user = data.name;
state.ID = data.id;
window.sessionStorage.setItem('user', data.name)
window.sessionStorage.setItem('ID', data.id)
},
//登出
LOGOUT: (state) => {
// 登出的时候要清除token
state.ID= null,
state.user= null,
state.admitPath= null,
state.routeList= null,
state.token= null,
state.refreshToken= null,
state.contractToken= null,
state.contractRefreshToken= null,
window.sessionStorage.clear();
// if(callServer && callServer.state){
// callServer.logout(); //客服坐席登出
// }
}
}
const actions = {
}
export default new Vuex.Store({
state,
mutations,
actions
})
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
<template>
<div>
</div>
</template>
<script>
export default {
name: 'H5LivePasswordtwo',
data() {
return {
};
},
mounted() {
},
methods: {
},
};
</script>
<style lang="scss" scoped>
</style>
\ No newline at end of file
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
{"name":"live","version":"0.1.0","dependencies":{"@liveqing/liveplayer":{"version":"2.7.0"},"axios":{"version":"1.1.3","dependencies":{"follow-redirects":{"version":"1.15.2"},"form-data":{"version":"4.0.0","dependencies":{"asynckit":{"version":"0.4.0"},"combined-stream":{"version":"1.0.8","dependencies":{"delayed-stream":{"version":"1.0.0"}}},"mime-types":{"version":"2.1.35","dependencies":{"mime-db":{"version":"1.52.0"}}}}},"proxy-from-env":{"version":"1.1.0"}}},"core-js":{"version":"3.25.5"},"jquery":{"version":"3.6.1"},"mint-ui":{"version":"2.2.13","dependencies":{"array-find-index":{"version":"1.0.2"},"raf.js":{"version":"0.0.4"},"vue-lazyload":{"version":"1.3.4"}}},"vue":{"required":{"_requested":{"name":"vue"},"author":{"name":"Evan You"},"dependencies":{"@vue/compiler-sfc":{"_requested":{"name":"@vue/compiler-sfc"},"dependencies":{"@babel/parser":{"_requested":{"name":"@babel/parser"},"author":{"name":"The Babel Team"},"name":"@babel/parser","version":"7.19.4"},"postcss":{"_requested":{"name":"postcss"},"author":{"name":"Andrey Sitnik"},"dependencies":{"nanoid":{"_requested":{"name":"nanoid"},"author":{"name":"Andrey Sitnik"},"name":"nanoid","version":"3.3.4"},"picocolors":{"_requested":{"name":"picocolors"},"author":{"name":"Alexey Raspopov"},"name":"picocolors","version":"1.0.0"},"source-map-js":{"_requested":{"name":"source-map-js"},"author":{"name":"Valentin 7rulnik Semirulnik"},"name":"source-map-js","version":"1.0.2"}},"name":"postcss","version":"8.4.18"},"source-map":{"_requested":{"name":"source-map"},"author":{"name":"Nick Fitzgerald"},"name":"source-map","version":"0.6.1"}},"name":"@vue/compiler-sfc","version":"2.7.13"},"csstype":{"_requested":{"name":"csstype"},"author":{"name":"Fredrik Nicol"},"name":"csstype","version":"3.1.1"}},"name":"vue","version":"2.7.13"}},"vue-router":{"version":"3.5.2"},"vuex":{"version":"4.1.0","dependencies":{"@vue/devtools-api":{"version":"6.4.4"}}}}}
\ No newline at end of file
// const { defineConfig } = require('@vue/cli-service')
const CopyWebpackPlugin = require('copy-webpack-plugin');
const NodePolyfillPlugin = require('node-polyfill-webpack-plugin')
// module.exports = defineConfig({
// transpileDependencies: true,
// })
module.exports = {
configureWebpack: {
plugins: [
new CopyWebpackPlugin([
{ from: 'node_modules/@liveqing/liveplayer/dist/component/crossdomain.xml'},
{ from: 'node_modules/@liveqing/liveplayer/dist/component/liveplayer.swf'},
{ from: 'node_modules/@liveqing/liveplayer/dist/component/liveplayer-lib.min.js', to: 'js/'},
]),
new NodePolyfillPlugin()
],
},
devServer: {
port:8080, //设置端口
},
publicPath: './',//修改目录
outputDir: 'dist', // build时构建文件的目录 构建时传入 --no-clean 可关闭该行为
assetsDir: 'assets', // build时放置生成的静态资源 (js、css、img、fonts) 的 (相对于 outputDir 的) 目录
filenameHashing: true, // 默认在生成的静态资源文件名中包含hash以控制缓存
runtimeCompiler: false, // 是否使用包含运行时编译器的 Vue 构建版本
productionSourceMap: true, // 如果你不需要生产环境的 source map,可以将其设置为 false 以加速生产环境构建
}
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