Skip to content

P
pica.cloud.web-education-admin
提交 580aeceb 编写于 作者: tao.wu's avatar tao.wu
浏览文件
操作

工作站顶部入口，意见反馈，全局请求设置不需要syscode的情况，增加saas的接口域名

上级 4faeb060
显示空白字符变更
内嵌 并排
正在显示 包含 388 行增加 和 11 行删除
src/components/opinionDialog.vue 0 → 100644
浏览文件 @ 580aeceb
<template>
<div class="opinion-container">
<el-dialog title="意见反馈" :center="true" :visible.sync="dialogFormVisible" :before-close="beforeClose">
<el-form :model="form" :rules="rules" ref="opinionForm" >
<el-form-item label="意见反馈：" :label-width="formLabelWidth" prop="opinion">
<el-input type="textarea" :rows="10" :maxlength="maxlength" v-model="form.opinion" autocomplete="off" placeholder="请告诉我们您遇到的问题或者建议"></el-input>
<span class="text-count">{{currentCount}}/2000</span>
</el-form-item>
<el-form-item label="上传图片：" :label-width="formLabelWidth" prop="imgs">
<el-upload
class="upload-demo"
:action="action"
:headers="headers"
multiple
list-type="picture"
:limit="imgLimit"
:accept="'image/jpg,image/jpeg,image/png,image/bmp'"
:data="imgFile"
:before-upload="getImgParam"
:on-remove="handleRemove"
:on-success="handleSuccess"
:on-error="handleError"
:on-exceed="handleExceed"
:disabled="addImageDisabled"
:file-list="fileList">
<el-button size="small" type="primary" @click="addImage" :disabled="addImageDisabled">添加图片</el-button>
<div slot="tip" class="el-upload__tip">最多5张，每张小于5M，支持jpg，png，bmp</div>
</el-upload>
</el-form-item>
<el-form-item label="联系方式：" :label-width="formLabelWidth" prop="contact">
<el-input v-model="form.contact" maxlength="11" autocomplete="off" placeholder="请输入您的联系方式，如有需要我们会尽快联系您"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="beforeClose">取 消</el-button>
<el-button type="primary" @click="submitFrom('opinionForm')">提 交</el-button>
</div>
<div slot="footer" class="dialog-footer bottom-msg">
<div class="disblock">
<h1>客服电话：400-920-8877 工作日：9:00~18:00</h1>
</div>
<div class="disblock">
<img src="https://file.yunqueyi.com/File/static/qrcode_for_yunqueyi.jpg" alt="">
<div class="ewm-wrap">
<h1>您可以在「云鹊医」公众号里直接留言</h1>
<h1>扫一扫二维码关注云鹊医公众号</h1>
</div>
</div>
</div>
</el-dialog>
<el-dialog
width="60%"
title=""
:center="true"
:visible.sync="innerVisible"
:before-close="beforeCloseInner"
:custom-class="'result-opinion'"
append-to-body>
<div class="result-msg">
<i class="el-icon-success"></i>
<span>提交成功</span>
</div>
<div class="msg-wrap">
<h1>感谢您的反馈，我们会在<span>1个工作日</span>内答复您的问题</h1>
<h1>请耐心等待</h1>
</div>
<div class="btn-wrap">
<el-button type="primary" class="button" @click="beforeCloseInner">我知道了</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import fetch from '@/utils/fetch'
import { envConfig } from '@/utils/env-config'
export default {
data(){
return{
maxlength: 2000,
form: {
opinion: '',
imgs: '',
contact: '',
},
innerVisible: false,
dialogFormVisible: true,
formLabelWidth: '100px',
rules: {
opinion: [
{ required: true, message: '请输入意见反馈', trigger: 'blur' }
]
},
addImageDisabled: false,
imgLimit: 3,// 最多允许上传的图片个数
action: 'https://upload.qiniup.com/',
token: '',
headers: {
token: ''
},
imgToken: null,//qiniu上传token
imgFile: {},
fileList: [],
urlString: ''
}
},
created(){
this.token = 'D34A213A354849A0B08A241771F7A675';
// this.token = localStorage.getItem('storageToken');
this.headers.token = this.token
},
computed: {
currentCount(){
return this.form.opinion.length
}
},
methods: {
// 获取七牛token
addImage(){
if(this.fileList.length>=this.imgLimit){
this.$message.warning(`最多上传${this.imgLimit}张图片`);
return;
}
this.GET('/file/image/token').then((res) => {
if(res.code=='000000'){
this.imgToken = res.data.token;
}else{
this.$message.error(res.message);
}
})
},
beforeClose(e){
this.$emit('closeDialog',false)
},
beforeCloseInner(e){
this.$emit('closeDialog',false)
},
submitFrom(formName){
this.$refs[formName].validate((valid) => {
if (valid) {
console.log(this.urlString)
const data = {
input_text: this.form.opinion,
system_type: 'workStation',
token: this.token,
contact_information: this.form.contact,
url: this.urlString,
};
fetch({
url: 'https://dev-api.yunqueyi.com/web/companys/feedback',
method: 'POST',
data,
headers:{
noSysCode: true,
"Content-Type": 'application/json'
}
}).then(res=>{
this.dialogFormVisible = false;
this.innerVisible = true;
})
} else {
return false;
}
});
},
getImgParam(file) {
const isLt2M = file.size / 1024 / 1024 < 5;
if (!isLt2M) {
this.$message.error('上传图片大小不能超过 5MB!');
return isLt2M;
}
const date = new Date();
const year = date.getFullYear();
const month = date.getMonth() + 1;
// const day = date.getDate();
// const hour = date.getHours();
// const minute = date.getMinutes();
// const second = date.getSeconds();
// this.imgFile.imageType = this.imageType;
this.imgFile.file = file;
this.imgFile.name = file.name;
this.imgFile.key = `qiniu/image/feedback/${year}/${month}/${file.name}`;
this.imgFile.token = this.imgToken;
},
handleRemove(){},
handleSuccess(response, file, fileList){
this.urlString += 'https://test1-file.yunqueyi.com/s' + response.key + ';'
this.$message.success(`上传成功！`);
if(fileList.length>=this.imgLimit){
this.addImageDisabled = true;
}
},
handleError(err, file, fileList){
this.$message.error(JSON.stringify(err) + '| 如果出现这个错误信息，说明图片上传失败，请检查代码，如果没有问题，请查看服务器是否有问题!并且删除这段代码提示，只保留前面错误信息提示即可!');
},
// 超出限制时
handleExceed(files, fileList){
if(fileList.length>=this.imgLimit){
this.$message.warning(`最多上传${this.imgLimit}张图片`);
}
},
}
}
</script>
<style lang="scss">
.opinion-container{
.text-count{
position: absolute;
right: 5px;
bottom: 3px;
line-height: 28px;
}
.el-form-item__label{
text-align: center;
}
.el-upload__tip{
display: inline;
margin-left: 10px;
}
.el-upload-list--picture .el-upload-list__item-thumbnail{
margin-left: -74px;
}
.el-upload-list__item{
width: 92px;
display: inline-block;
margin-right: 5px;
.el-upload-list__item-name{
display: none;
}
}
.el-upload-list--picture .el-upload-list__item-status-label{
background: #449284;
}
.el-dialog__footer{
padding: 0;
}
.bottom-msg{
margin-top: 30px;
padding: 20px 0;
background: #efefef;
.disblock{
width: 48%;
display: inline-block;
vertical-align: middle;
img,div{
display: inline-block;
vertical-align: middle;
}
h1{
color: #000;
font-size: 14px;
line-height: 28px;
}
img{
width: 80px;
height: 80px;
}
.ewm-wrap{
h1{
text-align: left;
}
}
}
}
}
.result-opinion{
border-radius: 8px!important;
text-align: center;
.result-msg{
text-align: center;
color: #449284;
span{
color: #000;
margin-left: 5px;
font-size: 20px;
}
}
.msg-wrap{
margin: 10px 0;
text-align: center;
h1{
font-size: 18px;
}
span{
color: #449284;
}
}
.btn-wrap{
text-align: center;
padding: 10px 5px;
}
}
</style>
src/utils/env-config.js
浏览文件 @ 580aeceb
......@@ -10,6 +10,7 @@ export const envConfig = {
// baseUrl: 'https://test1-sc.yunqueyi.com/',
//baseUrl: 'https://uat-sc.yunqueyi.com/',
baseUrl: 'https://dev-sc.yunqueyi.com/',
saasUrl: 'https://dev.yunqueyi.com',
qiniuFileUrl: "https://dev-sc.yunqueyi.com/contents/admin/qiniu/token1",
qiniuResourceUrl: "https://test1-videos.yunqueyi.com",
qiniuImgUrl: "https://test1-file.yunqueyi.com",
......@@ -19,6 +20,7 @@ export const envConfig = {
},
dev: {
baseUrl: 'https://dev-sc.yunqueyi.com/',
saasUrl: 'https://dev.yunqueyi.com',
qiniuFileUrl: "https://dev-sc.yunqueyi.com/contents/admin/qiniu/token1",
qiniuResourceUrl: "https://test1-videos.yunqueyi.com",
qiniuImgUrl: "https://test1-file.yunqueyi.com",
......@@ -28,6 +30,7 @@ export const envConfig = {
},
test: {
baseUrl: 'https://test1-sc.yunqueyi.com/',
saasUrl: 'https://test1.yunqueyi.com',
qiniuFileUrl: "https://test1-sc.yunqueyi.com/contents/admin/qiniu/token1",
qiniuResourceUrl: "https://test1-videos.yunqueyi.com",
qiniuImgUrl: "https://test1-file.yunqueyi.com",
......@@ -37,6 +40,7 @@ export const envConfig = {
},
uat: {
baseUrl: 'https://uat-sc.yunqueyi.com/',
saasUrl: 'https://uat.yunqueyi.com',
qiniuFileUrl: "https://uat-sc.yunqueyi.com/contents/admin/qiniu/token1",
qiniuResourceUrl: "https://video.yunqueyi.com", // 视频
qiniuImgUrl: "https://files.yunqueyi.com",
......@@ -46,6 +50,7 @@ export const envConfig = {
},
pro: {
baseUrl: 'https://sc.yunqueyi.com/',
saasUrl: 'https://api.yunqueyi.com',
qiniuFileUrl: "https://sc.yunqueyi.com/contents/admin/qiniu/token1",
qiniuResourceUrl: "https://video.yunqueyi.com",
qiniuImgUrl: "https://files.yunqueyi.com",
......
src/utils/fetch.js
浏览文件 @ 580aeceb
......@@ -11,9 +11,20 @@ const service = axios.create({
// request拦截器
service.interceptors.request.use(config => {
const noSysCode = config.headers.noSysCode;
if(noSysCode){
delete config.headers.sysCode;
delete config.headers.deviceInfo;
delete config.headers.noSysCode;
delete config.headers.token;
}else{
config.headers['sysCode'] = 12
config.headers['token'] = localStorage.getItem('storageToken')
config.headers['token'] = 'D34A213A354849A0B08A241771F7A675'
// config.headers['token'] = localStorage.getItem('storageToken')
config.headers['deviceInfo'] = JSON.stringify({ "app_channel": "", "app_mac": "", "app_uuid": "", "app_version": "", "device_brand": "", "device_ip": "", "device_model": "", "device_net": "", "device_ops": "", "resolution_wh": "", "system_level": "", "device_type": '10' })
}
// if (config.data && config.data.setEntry) {
// config.headers['sysCode'] = config.data.sysCode || 10
// if(config.data.token){
......
src/views/layout/header.vue
浏览文件 @ 580aeceb
......@@ -4,6 +4,7 @@
<img src="../../assets/image/index_logoicon.png"/>
<p>云鹊医工作站</p>
</div>
<div class="user-info">
<el-dropdown trigger="click" @command="handleCommand">
<div class="el-dropdown-link">
......@@ -16,13 +17,37 @@
</el-dropdown-menu>
</el-dropdown>
</div>
<div class="exp-msg">
<el-row :gutter="20">
<el-col :span="9" class="msg-opinion">
<div class="grid-content bg-purple">
<i class="el-icon-edit"></i>
<h1 @click="opinionShow=true">意见反馈</h1>
</div>
</el-col>
<el-col :span="15" class="msg-phone">
<div class="grid-content bg-purple-light">
<i class="el-icon-phone"></i>
<h1>400-920-8877</h1>
</div>
</el-col>
</el-row>
</div>
<opinionDialog v-if="opinionShow" @closeDialog="closeDialog"></opinionDialog>
</div>
</template>
<script>
import { getLoginUrl,getInnerLoginUrl, getYunQueYiUrl } from '../../utils/index.js'
import { mapGetters } from 'vuex'
import opinionDialog from '@/components/opinionDialog'
let vm = null
export default {
components: {
opinionDialog
},
props: {
portrait: {
type: String
......@@ -37,7 +62,8 @@ export default {
data() {
return {
name: '',
systemInfoList: []
systemInfoList: [],
opinionShow: false
}
},
computed: {
......@@ -61,6 +87,9 @@ export default {
if(command === 'forward') {
window.location.href = getYunQueYiUrl()
}
},
closeDialog(val){
this.opinionShow = val
}
}
}
......@@ -95,6 +124,31 @@ export default {
margin-left: 60px;
}
}
.exp-msg{
float: right;
line-height: 64px;
.msg-opinion{
width: 140px;
}
.msg-phone{
width: 180px;
}
.grid-content{
i,h1{
display: inline-block;
vertical-align: middle;
font-size: 16px;
line-height: 32px;
color: #838683;
cursor: pointer;
}
h1{
padding-right: 20px;
border-right: 1px solid #838683;
}
}
}
.user-info {
float: right;
padding-right: 50px;
......
Markdown 格式
0% or
您添加了 0 人 到此讨论。请谨慎行事。
先完成此消息的编辑！
想要评论请 注册 或