代理端增加海报，部分页面增加scoped避免样式污染
This commit is contained in:
parent
f85a73cf77
commit
eb99a6165a
File diff suppressed because it is too large
Load Diff
|
|
@ -25,9 +25,11 @@
|
|||
"gulp-load-plugins": "1.5.0",
|
||||
"gulp-replace": "0.6.1",
|
||||
"hls.js": "^1.5.17",
|
||||
"html2canvas": "^1.4.1",
|
||||
"lodash": "4.17.5",
|
||||
"mockjs": "^1.1.0",
|
||||
"npm": "^6.9.0",
|
||||
"qrcodejs2": "^0.0.2",
|
||||
"svg-sprite-loader": "3.7.3",
|
||||
"video.js": "^8.20.0",
|
||||
"videojs-contrib-hls": "^5.15.0",
|
||||
|
|
@ -40,8 +42,6 @@
|
|||
"vuex": "3.0.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"sass": "^1.80.1",
|
||||
"sass-loader": "^7.3.1",
|
||||
"autoprefixer": "7.1.2",
|
||||
"babel-core": "6.22.1",
|
||||
"babel-eslint": "7.1.1",
|
||||
|
|
@ -83,6 +83,8 @@
|
|||
"postcss-import": "11.0.0",
|
||||
"postcss-loader": "2.0.8",
|
||||
"rimraf": "2.6.0",
|
||||
"sass": "^1.80.1",
|
||||
"sass-loader": "^7.3.1",
|
||||
"selenium-server": "3.0.1",
|
||||
"semver": "5.3.0",
|
||||
"shelljs": "0.7.6",
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 1.3 MiB |
|
|
@ -14,8 +14,8 @@ const http = axios.create({
|
|||
})
|
||||
|
||||
// const requestURl = "http://localhost:8100/sqx_fast/";
|
||||
// const requestURl = "https://video.hnsiyao.cn/sqx_fast/";
|
||||
const requestURl = "https://dj-api.hnsiyao.cn/sqx_fast/";
|
||||
const requestURl = "https://video.hnsiyao.cn/sqx_fast/";
|
||||
// const requestURl = "https://dj-api.hnsiyao.cn/sqx_fast/";
|
||||
|
||||
/**
|
||||
* 请求拦截
|
||||
|
|
|
|||
|
|
@ -1,9 +1,10 @@
|
|||
<template>
|
||||
<div>
|
||||
|
||||
<el-row>
|
||||
<div style="float: right;">
|
||||
<el-button size="mini" type="primary" icon="document" @click="refresh()">刷新</el-button>
|
||||
<div style="float: right">
|
||||
<el-button size="mini" type="primary" icon="document" @click="refresh()"
|
||||
>刷新</el-button
|
||||
>
|
||||
</div>
|
||||
<el-col :span="24" class="cards">
|
||||
<div class="box">
|
||||
|
|
@ -11,14 +12,16 @@
|
|||
<div class="box_color">H5分享</div>
|
||||
<div class="text_color">
|
||||
<div>
|
||||
分享链接：<span>{{h5shareUrl}}</span>
|
||||
分享链接：<span>{{ h5shareUrl }}</span>
|
||||
<!-- <i class="el-icon-edit" @click="copyBtn(h5shareUrl)"
|
||||
style="color: red;"></i> -->
|
||||
</div>
|
||||
<div style="margin-top: 20px;">
|
||||
分享二维码：<img :src="h5erweimaImg" style="width: 100px;height: 100px;" />
|
||||
<div style="margin-top: 20px">
|
||||
分享二维码：<img
|
||||
:src="h5erweimaImg"
|
||||
style="width: 100px; height: 100px"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<!--
|
||||
<el-button size="mini" type="primary" @click="compile()">编辑
|
||||
|
|
@ -32,12 +35,14 @@
|
|||
<div class="box_color">微信小程序分享</div>
|
||||
<div class="text_color">
|
||||
<div>
|
||||
分享链接：<span>{{xhxshareUrl}}</span>
|
||||
分享链接：<span>{{ xhxshareUrl }}</span>
|
||||
</div>
|
||||
<div style="margin-top: 20px;">
|
||||
分享二维码：<img :src="xcxerweimaImg" style="width: 100px;height: 100px;" />
|
||||
<div style="margin-top: 20px">
|
||||
分享二维码：<img
|
||||
:src="xcxerweimaImg"
|
||||
style="width: 100px; height: 100px"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -48,12 +53,14 @@
|
|||
<div class="box_color">抖音小程序分享</div>
|
||||
<div class="text_color">
|
||||
<div>
|
||||
分享链接：<span>{{xhxshareUrl}}</span>
|
||||
分享链接：<span>{{ xhxshareUrl }}</span>
|
||||
</div>
|
||||
<div style="margin-top: 20px;">
|
||||
分享二维码：<img :src="dyxerweimaImg" style="width: 100px;height: 100px;" />
|
||||
<div style="margin-top: 20px">
|
||||
分享二维码：<img
|
||||
:src="dyxerweimaImg"
|
||||
style="width: 100px; height: 100px"
|
||||
/>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -64,25 +71,47 @@
|
|||
<div class="box_color">APP分享</div>
|
||||
<div class="text_color">
|
||||
<div>
|
||||
分享链接：<span>{{appshareUrl}}</span>
|
||||
分享链接：<span>{{ appshareUrl }}</span>
|
||||
</div>
|
||||
<div style="margin-top: 20px;">
|
||||
分享二维码：<img src="../../assets/img/avatar.png" style="width: 100px;height: 100px;" />
|
||||
<div style="margin-top: 20px">
|
||||
分享海报：<img
|
||||
:src="posterImg"
|
||||
style="width: 120px; height: auto"
|
||||
/>
|
||||
|
||||
<el-button size="mini" type="primary" @click="imgDown(posterImg)"
|
||||
>海报下载
|
||||
</el-button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<!-- 添加社区 -->
|
||||
<el-dialog title="添加社区" :visible.sync="dialogFormVisible" center>
|
||||
<div style="margin-bottom: 10px;">
|
||||
<span style="width: 200px;display: inline-block;text-align: right;">社区名称：</span>
|
||||
<el-input style="width:50%;" v-model="campusName" type="text" placeholder="请输入社区名称"></el-input>
|
||||
<div style="margin-bottom: 10px">
|
||||
<span style="width: 200px; display: inline-block; text-align: right"
|
||||
>社区名称：</span
|
||||
>
|
||||
<el-input
|
||||
style="width: 50%"
|
||||
v-model="campusName"
|
||||
type="text"
|
||||
placeholder="请输入社区名称"
|
||||
></el-input>
|
||||
</div>
|
||||
<div style="margin-bottom: 10px;">
|
||||
<span style="width: 200px;display: inline-block;text-align: right;">社区地址：</span>
|
||||
<el-input style="width:50%;" v-model="campusDetails" type="text" placeholder="请输入社区地址"></el-input>
|
||||
<div style="margin-bottom: 10px">
|
||||
<span style="width: 200px; display: inline-block; text-align: right"
|
||||
>社区地址：</span
|
||||
>
|
||||
<el-input
|
||||
style="width: 50%"
|
||||
v-model="campusDetails"
|
||||
type="text"
|
||||
placeholder="请输入社区地址"
|
||||
></el-input>
|
||||
</div>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<el-button @click="dialogFormVisible = false">取 消</el-button>
|
||||
|
|
@ -93,10 +122,10 @@
|
|||
<el-dialog title="修改" :visible.sync="dialogFormVisible1" center>
|
||||
<el-form :model="form">
|
||||
<el-form-item label="分享链接：" :label-width="formLabelWidth">
|
||||
<el-input v-model="form.campusName" style="width:65%;"></el-input>
|
||||
<el-input v-model="form.campusName" style="width: 65%"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="分享图片：" :label-width="formLabelWidth">
|
||||
<el-input v-model="form.campusDetails" style="width:65%;"></el-input>
|
||||
<el-input v-model="form.campusDetails" style="width: 65%"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
|
|
@ -104,348 +133,441 @@
|
|||
<el-button type="primary" @click="CompileNoticeTo()">确 定</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
<!-- 海报 -->
|
||||
<div>
|
||||
<!-- 海报html元素 -->
|
||||
<div
|
||||
id="posterHtml"
|
||||
:style="{ backgroundImage: 'url(' + posterHtmlBg + ')' }"
|
||||
style="
|
||||
background-repeat: no-repeat;
|
||||
background-size: 1242px 2688px;
|
||||
width: 1242px;
|
||||
height: 2688px;
|
||||
"
|
||||
v-show="false"
|
||||
>
|
||||
<div>{{ posterContent }}</div>
|
||||
<!-- 二维码 -->
|
||||
<div><div id="qrcodeImg"></div></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Clipboard from 'clipboard';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
limit: 10,
|
||||
page: 1,
|
||||
checkBoxData: [], //多选框选择的值
|
||||
formLabelWidth: '200px',
|
||||
tableDataLoading: false,
|
||||
dialogFormVisible: false,
|
||||
dialogFormVisible1: false,
|
||||
tableData: [],
|
||||
campusName: '',
|
||||
campusDetails: '',
|
||||
form: {
|
||||
campusId: '',
|
||||
campusName: '',
|
||||
campusDetails: ''
|
||||
},
|
||||
h5erweimaImg: '', //h5分享码
|
||||
xcxerweimaImg: '', //微信小程序分享码
|
||||
dyxerweimaImg: '', //抖音小程序分享码
|
||||
h5Url: '', //h5域名
|
||||
guanfangCode: '', //官方邀请码
|
||||
invitationCode: '',
|
||||
h5shareUrl: '', //h5分享链接
|
||||
appshareUrl: '', //app分享链接
|
||||
xhxshareUrl:'',//小程序分享链接
|
||||
}
|
||||
import html2canvas from "html2canvas";
|
||||
import Clipboard from "clipboard";
|
||||
import QRCode from 'qrcodejs2';
|
||||
import { create } from "lodash";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
posterContent: "", // 文案内容
|
||||
posterImg: "", // 最终生成的海报图片
|
||||
posterImgName: "宣传海报", // 最终生成的海报图片名称
|
||||
posterHtmlBg: require("../../assets/img/poster.jpg"), // 背景图
|
||||
showPoster: false,
|
||||
limit: 10,
|
||||
page: 1,
|
||||
checkBoxData: [], //多选框选择的值
|
||||
formLabelWidth: "200px",
|
||||
tableDataLoading: false,
|
||||
dialogFormVisible: false,
|
||||
dialogFormVisible1: false,
|
||||
tableData: [],
|
||||
campusName: "",
|
||||
campusDetails: "",
|
||||
form: {
|
||||
campusId: "",
|
||||
campusName: "",
|
||||
campusDetails: "",
|
||||
},
|
||||
h5erweimaImg: "", //h5分享码
|
||||
xcxerweimaImg: "", //微信小程序分享码
|
||||
dyxerweimaImg: "", //抖音小程序分享码
|
||||
h5Url: "", //h5域名
|
||||
guanfangCode: "", //官方邀请码
|
||||
invitationCode: "",
|
||||
h5shareUrl: "", //h5分享链接
|
||||
appshareUrl: "", //app分享链接
|
||||
xhxshareUrl: "", //小程序分享链接
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
createQrcode(text) {
|
||||
// 生成二维码
|
||||
const qrcodeImgEl = document.getElementById("qrcodeImg");
|
||||
let qrcode = new QRCode(qrcodeImgEl, {
|
||||
width: 190,
|
||||
height: 190,
|
||||
colorDark: "#000000",
|
||||
colorLight: "#ffffff",
|
||||
correctLevel: QRCode.CorrectLevel.H,
|
||||
});
|
||||
qrcode.makeCode(text);
|
||||
},
|
||||
methods: {
|
||||
// 多选
|
||||
changeFun(val) {
|
||||
this.checkBoxData = val;
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.limit = val;
|
||||
this.dataSelect()
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.page = val;
|
||||
this.dataSelect()
|
||||
},
|
||||
// 刷新
|
||||
refresh() {
|
||||
console.log('------')
|
||||
this.xianshi()
|
||||
},
|
||||
// 添加社区弹框
|
||||
classifyStair() {
|
||||
this.dialogFormVisible = true
|
||||
},
|
||||
// 添加社区
|
||||
StairNoticeTo() {
|
||||
if (this.campusName == '') {
|
||||
this.$notify({
|
||||
title: '提示',
|
||||
duration: 1800,
|
||||
message: '请输入社区名称',
|
||||
type: 'warning'
|
||||
});
|
||||
return
|
||||
}
|
||||
if (this.campusDetails == '') {
|
||||
this.$notify({
|
||||
title: '提示',
|
||||
duration: 1800,
|
||||
message: '请输入社区地址',
|
||||
type: 'warning'
|
||||
});
|
||||
return
|
||||
}
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('helpCampus/insertCampus'),
|
||||
method: 'post',
|
||||
data: this.$http.adornData({
|
||||
'campusName': this.campusName,
|
||||
'campusDetails': this.campusDetails,
|
||||
})
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
this.dialogFormVisible = false
|
||||
createPoster() {
|
||||
//click 点击按钮生成海报
|
||||
// 生成海报
|
||||
const vm = this;
|
||||
const domObj = document.getElementById("posterHtml");
|
||||
html2canvas(domObj, {
|
||||
useCORS: true,
|
||||
allowTaint: false,
|
||||
logging: false,
|
||||
letterRendering: true,
|
||||
onclone(doc) {
|
||||
let e = doc.querySelector("#posterHtml");
|
||||
e.style.display = "block";
|
||||
},
|
||||
}).then((canvas) => {
|
||||
// 在微信里,可长按保存或转发
|
||||
vm.posterImg = canvas.toDataURL("image/png");
|
||||
console.log(vm.posterImg)
|
||||
// vm.imgDown(vm.posterImg);
|
||||
});
|
||||
},
|
||||
// 保存图片到本地
|
||||
imgDown(img) {
|
||||
if(!this.posterImg){
|
||||
return this.$message({
|
||||
titile:'提示',
|
||||
message:'请先生成海报',
|
||||
type:'warning'
|
||||
})
|
||||
}
|
||||
var alink = document.createElement("a");
|
||||
alink.href = img;
|
||||
alink.download = this.posterImgName; // 图片名
|
||||
alink.click();
|
||||
},
|
||||
// 多选
|
||||
changeFun(val) {
|
||||
this.checkBoxData = val;
|
||||
},
|
||||
handleSizeChange(val) {
|
||||
this.limit = val;
|
||||
this.dataSelect();
|
||||
},
|
||||
handleCurrentChange(val) {
|
||||
this.page = val;
|
||||
this.dataSelect();
|
||||
},
|
||||
// 刷新
|
||||
refresh() {
|
||||
console.log("------");
|
||||
this.xianshi();
|
||||
},
|
||||
// 添加社区弹框
|
||||
classifyStair() {
|
||||
this.dialogFormVisible = true;
|
||||
},
|
||||
// 添加社区
|
||||
StairNoticeTo() {
|
||||
if (this.campusName == "") {
|
||||
this.$notify({
|
||||
title: "提示",
|
||||
duration: 1800,
|
||||
message: "请输入社区名称",
|
||||
type: "warning",
|
||||
});
|
||||
return;
|
||||
}
|
||||
if (this.campusDetails == "") {
|
||||
this.$notify({
|
||||
title: "提示",
|
||||
duration: 1800,
|
||||
message: "请输入社区地址",
|
||||
type: "warning",
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.$http({
|
||||
url: this.$http.adornUrl("helpCampus/insertCampus"),
|
||||
method: "post",
|
||||
data: this.$http.adornData({
|
||||
campusName: this.campusName,
|
||||
campusDetails: this.campusDetails,
|
||||
}),
|
||||
}).then(({ data }) => {
|
||||
this.dialogFormVisible = false;
|
||||
this.$message({
|
||||
message: "添加成功",
|
||||
type: "success",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.campusName = "";
|
||||
this.campusDetails = "";
|
||||
this.dataSelect();
|
||||
},
|
||||
});
|
||||
});
|
||||
},
|
||||
// 修改社区
|
||||
compile(index, rows) {
|
||||
this.dialogFormVisible1 = true;
|
||||
this.form.campusId = rows.campusId;
|
||||
this.form.campusName = rows.campusName;
|
||||
this.form.campusDetails = rows.campusDetails;
|
||||
},
|
||||
// 修改社区
|
||||
CompileNoticeTo() {
|
||||
this.$http({
|
||||
url: this.$http.adornUrl("helpCampus/updateCampus "),
|
||||
method: "post",
|
||||
data: this.$http.adornData({
|
||||
campusId: this.form.campusId,
|
||||
campusName: this.form.campusName,
|
||||
campusDetails: this.form.campusDetails,
|
||||
}),
|
||||
}).then(({ data }) => {
|
||||
if (data.code == 0) {
|
||||
this.$message({
|
||||
message: '添加成功',
|
||||
type: 'success',
|
||||
message: "操作成功",
|
||||
type: "success",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.campusName = ''
|
||||
this.campusDetails = ''
|
||||
this.dataSelect()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
// 修改社区
|
||||
compile(index, rows) {
|
||||
this.dialogFormVisible1 = true;
|
||||
this.form.campusId = rows.campusId;
|
||||
this.form.campusName = rows.campusName;
|
||||
this.form.campusDetails = rows.campusDetails;
|
||||
},
|
||||
// 修改社区
|
||||
CompileNoticeTo() {
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('helpCampus/updateCampus '),
|
||||
method: 'post',
|
||||
data: this.$http.adornData({
|
||||
'campusId': this.form.campusId,
|
||||
'campusName': this.form.campusName,
|
||||
'campusDetails': this.form.campusDetails
|
||||
})
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
if (data.code == 0) {
|
||||
this.$message({
|
||||
message: '操作成功',
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.dialogFormVisible1 = false
|
||||
this.dataSelect()
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
message: data.msg,
|
||||
type: 'error',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.dialogFormVisible1 = false
|
||||
this.dataSelect()
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
},
|
||||
// 批量删除
|
||||
deleteStairs(id) {
|
||||
this.$confirm(`确定批量删除信息?`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
var ids = id ? [id] : this.checkBoxData.map(item => {
|
||||
return item.campusId
|
||||
})
|
||||
this.dialogFormVisible1 = false;
|
||||
this.dataSelect();
|
||||
},
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
message: data.msg,
|
||||
type: "error",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.dialogFormVisible1 = false;
|
||||
this.dataSelect();
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
// 批量删除
|
||||
deleteStairs(id) {
|
||||
this.$confirm(`确定批量删除信息?`, "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
})
|
||||
.then(() => {
|
||||
var ids = id
|
||||
? [id]
|
||||
: this.checkBoxData.map((item) => {
|
||||
return item.campusId;
|
||||
});
|
||||
this.$http({
|
||||
url: this.$http.adornUrl(`helpCampus/deleteCampus?ids=${ids}`),
|
||||
method: 'get',
|
||||
params: this.$http.adornParams({})
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
method: "get",
|
||||
params: this.$http.adornParams({}),
|
||||
}).then(({ data }) => {
|
||||
if (data.code == 0) {
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.content = ''
|
||||
this.status = 0
|
||||
this.dataSelect()
|
||||
}
|
||||
})
|
||||
this.content = "";
|
||||
this.status = 0;
|
||||
this.dataSelect();
|
||||
},
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
message: data.msg,
|
||||
type: 'error',
|
||||
type: "error",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.content = ''
|
||||
this.status = 0
|
||||
this.dataSelect()
|
||||
}
|
||||
})
|
||||
this.content = "";
|
||||
this.status = 0;
|
||||
this.dataSelect();
|
||||
},
|
||||
});
|
||||
}
|
||||
})
|
||||
}).catch(() => {})
|
||||
},
|
||||
//删除
|
||||
deleteStair(row) {
|
||||
this.$confirm(`确定删除此条信息?`, '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.$http({
|
||||
url: this.$http.adornUrl(`helpCampus/deleteCampus?ids=${row.campusId}`),
|
||||
method: 'get',
|
||||
params: this.$http.adornParams({})
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
if (data.code == 0) {
|
||||
this.$message({
|
||||
message: '删除成功',
|
||||
type: 'success',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.dataSelect()
|
||||
}
|
||||
})
|
||||
} else {
|
||||
this.$message({
|
||||
message: data.msg,
|
||||
type: 'error',
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.dataSelect()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
})
|
||||
}).catch(() => {})
|
||||
},
|
||||
// 重置
|
||||
cleans() {
|
||||
this.phone = ''
|
||||
this.status = 0
|
||||
this.dataSelect()
|
||||
},
|
||||
// 获取派单数据列表
|
||||
dataSelect() {
|
||||
this.tableDataLoading = true
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('urlAddress/selectUrlAddress'),
|
||||
method: 'get',
|
||||
params: this.$http.adornParams({})
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
this.tableDataLoading = false
|
||||
let returnData = data.data;
|
||||
this.tableData = returnData
|
||||
});
|
||||
})
|
||||
},
|
||||
// 配置信息
|
||||
xianshi() {
|
||||
var qdCode = this.$cookie.get('qdCode')
|
||||
// 获取h5域名
|
||||
// this.$http({
|
||||
// url: this.$http.adornUrl('common/type/19'),
|
||||
// method: 'get',
|
||||
// data: this.$http.adornData({})
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('urlAddress/selectUrlAddress'),
|
||||
method: 'get',
|
||||
params: this.$http.adornParams({})
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
if (data.code == 0) {
|
||||
|
||||
this.h5Url = data.data.urlAddress
|
||||
this.xianshi2()
|
||||
}
|
||||
})
|
||||
},
|
||||
xianshi2() {
|
||||
var qdCode = this.$cookie.get('qdCode')
|
||||
// 获取官方邀请码
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('common/type/88'),
|
||||
method: 'get',
|
||||
data: this.$http.adornData({})
|
||||
}).then(({
|
||||
data
|
||||
}) => {
|
||||
if (data.code == 0) {
|
||||
this.guanfangCode = data.data.value
|
||||
this.invitationCode = this.guanfangCode + ',' + qdCode,
|
||||
this.h5erweimaImg = this.$http.adornUrl('app/invite/insertQrCode?content=' + qdCode)
|
||||
this.xcxerweimaImg = this.$http.adornUrl('app/invite/mpCreateQr?invitationCode=' + this.invitationCode)
|
||||
this.dyxerweimaImg = this.$http.adornUrl('app/invite/dyCreateQr?invitationCode=' + this.invitationCode)
|
||||
this.h5shareUrl = this.h5Url + '/pages/index/index?invitation=' + this.guanfangCode + '&qdCode=' +
|
||||
qdCode
|
||||
this.xhxshareUrl = '/pages/index/index?invitation=' + this.guanfangCode + '&qdCode=' +
|
||||
qdCode
|
||||
this.appshareUrl = this.h5Url + '/pages/login/registerApp?invitation=' + this.guanfangCode + '&qdCode=' +
|
||||
qdCode
|
||||
}
|
||||
|
||||
})
|
||||
},
|
||||
// 复制
|
||||
copyBtn(text) {
|
||||
let clipboard = new Clipboard('.copy')
|
||||
clipboard.on('success', e => {
|
||||
console.log('复制成功')
|
||||
// 释放内存
|
||||
clipboard.destroy()
|
||||
})
|
||||
clipboard.on('error', e => {
|
||||
// 不支持复制
|
||||
console.log('该浏览器不支持自动复制')
|
||||
// 释放内存
|
||||
clipboard.destroy()
|
||||
})
|
||||
}
|
||||
.catch(() => {});
|
||||
},
|
||||
mounted() {
|
||||
this.xianshi()
|
||||
// this.dataSelect()
|
||||
}
|
||||
};
|
||||
//删除
|
||||
deleteStair(row) {
|
||||
this.$confirm(`确定删除此条信息?`, "提示", {
|
||||
confirmButtonText: "确定",
|
||||
cancelButtonText: "取消",
|
||||
type: "warning",
|
||||
})
|
||||
.then(() => {
|
||||
this.$http({
|
||||
url: this.$http.adornUrl(
|
||||
`helpCampus/deleteCampus?ids=${row.campusId}`
|
||||
),
|
||||
method: "get",
|
||||
params: this.$http.adornParams({}),
|
||||
}).then(({ data }) => {
|
||||
if (data.code == 0) {
|
||||
this.$message({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.dataSelect();
|
||||
},
|
||||
});
|
||||
} else {
|
||||
this.$message({
|
||||
message: data.msg,
|
||||
type: "error",
|
||||
duration: 1500,
|
||||
onClose: () => {
|
||||
this.dataSelect();
|
||||
},
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(() => {});
|
||||
},
|
||||
// 重置
|
||||
cleans() {
|
||||
this.phone = "";
|
||||
this.status = 0;
|
||||
this.dataSelect();
|
||||
},
|
||||
// 获取派单数据列表
|
||||
dataSelect() {
|
||||
this.tableDataLoading = true;
|
||||
this.$http({
|
||||
url: this.$http.adornUrl("urlAddress/selectUrlAddress"),
|
||||
method: "get",
|
||||
params: this.$http.adornParams({}),
|
||||
}).then(({ data }) => {
|
||||
this.tableDataLoading = false;
|
||||
let returnData = data.data;
|
||||
this.tableData = returnData;
|
||||
});
|
||||
},
|
||||
// 配置信息
|
||||
xianshi() {
|
||||
var qdCode = this.$cookie.get("qdCode");
|
||||
// 获取h5域名
|
||||
// this.$http({
|
||||
// url: this.$http.adornUrl('common/type/19'),
|
||||
// method: 'get',
|
||||
// data: this.$http.adornData({})
|
||||
this.$http({
|
||||
url: this.$http.adornUrl("urlAddress/selectUrlAddress"),
|
||||
method: "get",
|
||||
params: this.$http.adornParams({}),
|
||||
}).then(({ data }) => {
|
||||
if (data.code == 0) {
|
||||
this.h5Url = data.data.urlAddress;
|
||||
this.xianshi2();
|
||||
}
|
||||
});
|
||||
},
|
||||
xianshi2() {
|
||||
var qdCode = this.$cookie.get("qdCode");
|
||||
// 获取官方邀请码
|
||||
this.$http({
|
||||
url: this.$http.adornUrl("common/type/88"),
|
||||
method: "get",
|
||||
data: this.$http.adornData({}),
|
||||
}).then(({ data }) => {
|
||||
if (data.code == 0) {
|
||||
this.guanfangCode = data.data.value;
|
||||
(this.invitationCode = this.guanfangCode + "," + qdCode),
|
||||
(this.h5erweimaImg = this.$http.adornUrl(
|
||||
"app/invite/insertQrCode?content=" + qdCode
|
||||
));
|
||||
this.xcxerweimaImg = this.$http.adornUrl(
|
||||
"app/invite/mpCreateQr?invitationCode=" + this.invitationCode
|
||||
);
|
||||
this.dyxerweimaImg = this.$http.adornUrl(
|
||||
"app/invite/dyCreateQr?invitationCode=" + this.invitationCode
|
||||
);
|
||||
this.h5shareUrl =
|
||||
this.h5Url +
|
||||
"/pages/index/index?invitation=" +
|
||||
this.guanfangCode +
|
||||
"&qdCode=" +
|
||||
qdCode;
|
||||
this.xhxshareUrl =
|
||||
"/pages/index/index?invitation=" +
|
||||
this.guanfangCode +
|
||||
"&qdCode=" +
|
||||
qdCode;
|
||||
this.appshareUrl =
|
||||
this.h5Url +
|
||||
"/pages/login/registerApp?invitation=" +
|
||||
this.guanfangCode +
|
||||
"&qdCode=" +
|
||||
qdCode;
|
||||
this.createQrcode( this.appshareUrl);
|
||||
this.createPoster();
|
||||
}
|
||||
});
|
||||
},
|
||||
// 复制
|
||||
copyBtn(text) {
|
||||
let clipboard = new Clipboard(".copy");
|
||||
clipboard.on("success", (e) => {
|
||||
console.log("复制成功");
|
||||
// 释放内存
|
||||
clipboard.destroy();
|
||||
});
|
||||
clipboard.on("error", (e) => {
|
||||
// 不支持复制
|
||||
console.log("该浏览器不支持自动复制");
|
||||
// 释放内存
|
||||
clipboard.destroy();
|
||||
});
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.xianshi();
|
||||
// this.dataSelect()
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.box {
|
||||
padding: 44px;
|
||||
border: 1px solid #eee;
|
||||
margin: 15px 10px;
|
||||
}
|
||||
<style scoped>
|
||||
#posterHtml{
|
||||
position: relative;
|
||||
}
|
||||
#qrcodeImg {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
bottom: 125px;
|
||||
}
|
||||
.box {
|
||||
padding: 44px;
|
||||
border: 1px solid #eee;
|
||||
margin: 15px 10px;
|
||||
}
|
||||
|
||||
.box_num {
|
||||
font-size: 14px;
|
||||
color: #66b1ff;
|
||||
}
|
||||
.box_num {
|
||||
font-size: 14px;
|
||||
color: #66b1ff;
|
||||
}
|
||||
|
||||
.box_num .box_color {
|
||||
color: #333;
|
||||
font-size: 14px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.box_num .box_color {
|
||||
color: #333;
|
||||
font-size: 14px;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.box_num div span {
|
||||
font-size: 20px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
.box_num div span {
|
||||
font-size: 20px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.text_color {
|
||||
color: #4f9dec;
|
||||
}
|
||||
.text_color {
|
||||
color: #4f9dec;
|
||||
}
|
||||
|
||||
.text_color span {
|
||||
margin-right: 5px;
|
||||
}
|
||||
.text_color span {
|
||||
margin-right: 5px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -3,27 +3,58 @@
|
|||
<div class="site-content__wrapper">
|
||||
<div class="site-content">
|
||||
<div class="login-main">
|
||||
<h3 class="login-title">{{entryName}}</h3>
|
||||
<el-form :model="dataForm" :rules="dataRule" ref="dataForm" @keyup.enter.native="dataFormSubmit()" status-icon>
|
||||
<h3 class="login-title">{{ entryName }}</h3>
|
||||
<el-form
|
||||
:model="dataForm"
|
||||
:rules="dataRule"
|
||||
ref="dataForm"
|
||||
@keyup.enter.native="dataFormSubmit()"
|
||||
status-icon
|
||||
>
|
||||
<el-form-item prop="userName">
|
||||
<el-input v-model="dataForm.userName" placeholder="帐号"></el-input>
|
||||
<el-input
|
||||
v-model="dataForm.userName"
|
||||
placeholder="帐号"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="password">
|
||||
<el-input v-model="dataForm.password" type="password" placeholder="密码"></el-input>
|
||||
<el-input
|
||||
v-model="dataForm.password"
|
||||
type="password"
|
||||
placeholder="密码"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item prop="captcha">
|
||||
<el-form-item prop="captcha">
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="14">
|
||||
<el-input v-model="dataForm.captcha" placeholder="验证码">
|
||||
</el-input>
|
||||
</el-col>
|
||||
<el-col :span="10" class="login-captcha">
|
||||
<img :src="captchaPath" @click="getCaptcha()" alt="">
|
||||
<img :src="captchaPath" @click="getCaptcha()" alt="" />
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button class="login-btn-submit" type="primary" @click="dataFormSubmit()">登录</el-button>
|
||||
<div class="btn-box">
|
||||
<div class="" style="margin-top: 38px">
|
||||
<el-button
|
||||
class="login-btn-submit"
|
||||
type="primary"
|
||||
@click="dataFormSubmit()"
|
||||
>登录</el-button
|
||||
>
|
||||
</div>
|
||||
<!-- <div>
|
||||
<el-button
|
||||
class="login-btn-submit"
|
||||
plain
|
||||
type="primary"
|
||||
@click="dataFormSubmit()"
|
||||
>注册</el-button
|
||||
>
|
||||
</div> -->
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
|
|
@ -33,150 +64,157 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
import { getUUID } from '@/utils'
|
||||
import { entryName } from '@/utils/httpRequest'
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
dataForm: {
|
||||
userName: '',
|
||||
password: '',
|
||||
uuid: '',
|
||||
captcha: '',
|
||||
entryName:'',
|
||||
},
|
||||
dataRule: {
|
||||
userName: [
|
||||
{ required: true, message: '帐号不能为空', trigger: 'blur' }
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: '密码不能为空', trigger: 'blur' }
|
||||
],
|
||||
captcha: [
|
||||
{ required: true, message: '验证码不能为空', trigger: 'blur' }
|
||||
]
|
||||
},
|
||||
captchaPath: ''
|
||||
}
|
||||
},
|
||||
created () {
|
||||
this.entryName = entryName
|
||||
this.getCaptcha()
|
||||
},
|
||||
methods: {
|
||||
// 提交表单
|
||||
dataFormSubmit () {
|
||||
this.$refs['dataForm'].validate((valid) => {
|
||||
if (valid) {
|
||||
this.$http({
|
||||
url: this.$http.adornUrl('sys/login'),
|
||||
method: 'post',
|
||||
data: this.$http.adornData({
|
||||
'username': this.dataForm.userName,
|
||||
'password': this.dataForm.password,
|
||||
'uuid': this.dataForm.uuid,
|
||||
'captcha': this.dataForm.captcha,
|
||||
'adminType':2
|
||||
})
|
||||
}).then(({data}) => {
|
||||
if (data && data.code === 0) {
|
||||
this.$cookie.set('token', data.token)
|
||||
this.$router.replace({ name: 'home' })
|
||||
} else {
|
||||
this.getCaptcha()
|
||||
this.$message.error(data.msg)
|
||||
}
|
||||
})
|
||||
}
|
||||
})
|
||||
import { getUUID } from "@/utils";
|
||||
import { entryName } from "@/utils/httpRequest";
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
dataForm: {
|
||||
userName: "",
|
||||
password: "",
|
||||
uuid: "",
|
||||
captcha: "",
|
||||
entryName: "",
|
||||
},
|
||||
// 获取验证码
|
||||
getCaptcha () {
|
||||
this.dataForm.uuid = getUUID()
|
||||
this.captchaPath = this.$http.adornUrl(`/captcha.jpg?uuid=${this.dataForm.uuid}`)
|
||||
}
|
||||
}
|
||||
}
|
||||
dataRule: {
|
||||
userName: [
|
||||
{ required: true, message: "帐号不能为空", trigger: "blur" },
|
||||
],
|
||||
password: [
|
||||
{ required: true, message: "密码不能为空", trigger: "blur" },
|
||||
],
|
||||
captcha: [
|
||||
{ required: true, message: "验证码不能为空", trigger: "blur" },
|
||||
],
|
||||
},
|
||||
captchaPath: "",
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.entryName = entryName;
|
||||
this.getCaptcha();
|
||||
},
|
||||
methods: {
|
||||
// 提交表单
|
||||
dataFormSubmit() {
|
||||
this.$refs["dataForm"].validate((valid) => {
|
||||
if (valid) {
|
||||
this.$http({
|
||||
url: this.$http.adornUrl("sys/login"),
|
||||
method: "post",
|
||||
data: this.$http.adornData({
|
||||
username: this.dataForm.userName,
|
||||
password: this.dataForm.password,
|
||||
uuid: this.dataForm.uuid,
|
||||
captcha: this.dataForm.captcha,
|
||||
adminType: 2,
|
||||
}),
|
||||
}).then(({ data }) => {
|
||||
if (data && data.code === 0) {
|
||||
this.$cookie.set("token", data.token);
|
||||
this.$router.replace({ name: "home" });
|
||||
} else {
|
||||
this.getCaptcha();
|
||||
this.$message.error(data.msg);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
// 获取验证码
|
||||
getCaptcha() {
|
||||
this.dataForm.uuid = getUUID();
|
||||
this.captchaPath = this.$http.adornUrl(
|
||||
`/captcha.jpg?uuid=${this.dataForm.uuid}`
|
||||
);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.site-wrapper.site-page--login {
|
||||
<style lang="scss" scoped>
|
||||
.btn-box {
|
||||
display: flex;
|
||||
gap: 20px;
|
||||
flex-direction: column;
|
||||
}
|
||||
.site-wrapper.site-page--login {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: rgba(38, 50, 56, 0.2);
|
||||
overflow: hidden;
|
||||
&:before {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
background-image: url(~@/assets/img/login_bg.jpg);
|
||||
background-size: cover;
|
||||
}
|
||||
.site-content__wrapper {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background-color: rgba(38, 50, 56, .2);
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
background-color: transparent;
|
||||
}
|
||||
.site-content {
|
||||
min-height: 100%;
|
||||
// padding: 30px 500px 30px 30px;
|
||||
}
|
||||
.brand-info {
|
||||
margin: 220px 100px 0 90px;
|
||||
color: #fff;
|
||||
}
|
||||
.brand-info__text {
|
||||
margin: 0 0 22px 0;
|
||||
font-size: 48px;
|
||||
font-weight: 400;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
.brand-info__intro {
|
||||
margin: 10px 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.58;
|
||||
opacity: 0.6;
|
||||
}
|
||||
.login-main {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -200px;
|
||||
margin-top: -150px;
|
||||
padding: 20px 30px;
|
||||
width: 400px;
|
||||
border-radius: 8px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.login-title {
|
||||
font-size: 20px;
|
||||
text-align: center;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.login-captcha {
|
||||
overflow: hidden;
|
||||
&:before {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
> img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
content: "";
|
||||
background-image: url(~@/assets/img/login_bg.jpg);
|
||||
background-size: cover;
|
||||
}
|
||||
.site-content__wrapper {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
overflow-x: hidden;
|
||||
overflow-y: auto;
|
||||
background-color: transparent;
|
||||
}
|
||||
.site-content {
|
||||
min-height: 100%;
|
||||
// padding: 30px 500px 30px 30px;
|
||||
}
|
||||
.brand-info {
|
||||
margin: 220px 100px 0 90px;
|
||||
color: #fff;
|
||||
}
|
||||
.brand-info__text {
|
||||
margin: 0 0 22px 0;
|
||||
font-size: 48px;
|
||||
font-weight: 400;
|
||||
text-transform : uppercase;
|
||||
}
|
||||
.brand-info__intro {
|
||||
margin: 10px 0;
|
||||
font-size: 16px;
|
||||
line-height: 1.58;
|
||||
opacity: .6;
|
||||
}
|
||||
.login-main {
|
||||
position: absolute;
|
||||
top:50%;
|
||||
left: 50%;
|
||||
margin-left: -200px;
|
||||
margin-top: -150px;
|
||||
padding: 20px 30px;
|
||||
width: 400px;
|
||||
border-radius:8px;
|
||||
background-color: #fff;
|
||||
}
|
||||
.login-title {
|
||||
font-size: 20px;
|
||||
text-align:center;
|
||||
margin-top:10px;
|
||||
}
|
||||
.login-captcha {
|
||||
overflow: hidden;
|
||||
> img {
|
||||
width: 100%;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.login-btn-submit {
|
||||
width: 100%;
|
||||
margin-top: 38px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.login-btn-submit {
|
||||
width: 100%;
|
||||
// margin-top: 38px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -2783,7 +2783,7 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style scoped>
|
||||
.el-dialog {
|
||||
/* width: 65% !important; */
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1837,7 +1837,7 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style scoped>
|
||||
.el-dialog {
|
||||
/* width: 65% !important; */
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1899,7 +1899,7 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
<style scoped>
|
||||
.el-dialog {
|
||||
/* width: 65% !important; */
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue