|
@@ -0,0 +1,407 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container public-config-page">
|
|
|
+ <el-form :model="form" ref="form" :inline="true" :rules="rules" label-width="160px">
|
|
|
+ <div class="title-box">
|
|
|
+ <p>基本信息</p>
|
|
|
+ </div>
|
|
|
+ <div class="form-max-box">
|
|
|
+ <el-form-item label="学校名称:" prop="schoolName">
|
|
|
+ <el-input
|
|
|
+ v-model="form.schoolName"
|
|
|
+ maxLength="20"
|
|
|
+ placeholder="请输入学校名称"
|
|
|
+ />
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="圆形Logo:" prop="circularLogo">
|
|
|
+ <el-upload
|
|
|
+ class="certificate-avatar-uploader"
|
|
|
+ :action="uploadImgUrl"
|
|
|
+ :show-file-list="false"
|
|
|
+ accept="image/jpeg,image/gif,image/png"
|
|
|
+ :on-success="(res)=>handleAvatarSuccess(res,'circularLogo')"
|
|
|
+ :headers="headers"
|
|
|
+ :before-upload="beforeAvatarUpload">
|
|
|
+ <img v-if="form.circularLogo" :src="form.circularLogo" class="avatar" style="height:80px;width:80px;">
|
|
|
+ <i v-if="!form.circularLogo" class="el-icon-plus avatar-uploader-icon"></i>
|
|
|
+ </el-upload>
|
|
|
+ <i v-if="form.circularLogo" class="el-icon-view" @click="lookImg(form.circularLogo)"
|
|
|
+ style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;
|
|
|
+ height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="长方形Logo:" prop="rectangleLogo">
|
|
|
+ <el-upload
|
|
|
+ class="certificate-avatar-uploader"
|
|
|
+ :action="uploadImgUrl"
|
|
|
+ :show-file-list="false"
|
|
|
+ accept="image/jpeg,image/gif,image/png"
|
|
|
+ :on-success="(res)=>handleAvatarSuccess(res,'rectangleLogo')"
|
|
|
+ :headers="headers"
|
|
|
+ :before-upload="beforeAvatarUpload">
|
|
|
+ <img v-if="form.rectangleLogo" :src="form.rectangleLogo" class="avatar" style="height:80px;width:80px;">
|
|
|
+ <i v-if="!form.rectangleLogo" class="el-icon-plus avatar-uploader-icon"></i>
|
|
|
+ </el-upload>
|
|
|
+ <i v-if="form.rectangleLogo" class="el-icon-view" @click="lookImg(form.rectangleLogo)"
|
|
|
+ style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;
|
|
|
+ height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <!--<div class="title-box">-->
|
|
|
+ <!--<p>一体机</p>-->
|
|
|
+ <!--</div>-->
|
|
|
+ <!--<div class="form-max-box">-->
|
|
|
+ <!--<el-form-item label="签到/离开示意图:" prop="signMap">-->
|
|
|
+ <!--<el-upload-->
|
|
|
+ <!--class="certificate-avatar-uploader"-->
|
|
|
+ <!--:action="uploadImgUrl"-->
|
|
|
+ <!--:show-file-list="false"-->
|
|
|
+ <!--accept="image/jpeg,image/gif,image/png"-->
|
|
|
+ <!--:on-success="(res)=>handleAvatarSuccess(res,'signMap')"-->
|
|
|
+ <!--:headers="headers"-->
|
|
|
+ <!--:before-upload="beforeAvatarUpload">-->
|
|
|
+ <!--<img v-if="form.signMap" :src="form.signMap" class="avatar" style="height:80px;width:80px;">-->
|
|
|
+ <!--<i v-if="!form.signMap" class="el-icon-plus avatar-uploader-icon"></i>-->
|
|
|
+ <!--</el-upload>-->
|
|
|
+ <!--<i v-if="form.signMap" class="el-icon-view" @click="lookImg(form.signMap)"-->
|
|
|
+ <!--style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;-->
|
|
|
+ <!--height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>-->
|
|
|
+ <!--</el-form-item>-->
|
|
|
+ <!--<el-form-item label="视频封面:" prop="videoCover">-->
|
|
|
+ <!--<el-upload-->
|
|
|
+ <!--class="certificate-avatar-uploader"-->
|
|
|
+ <!--:action="uploadImgUrl"-->
|
|
|
+ <!--:show-file-list="false"-->
|
|
|
+ <!--accept="image/jpeg,image/gif,image/png"-->
|
|
|
+ <!--:on-success="(res)=>handleAvatarSuccess(res,'videoCover')"-->
|
|
|
+ <!--:headers="headers"-->
|
|
|
+ <!--:before-upload="beforeAvatarUpload">-->
|
|
|
+ <!--<img v-if="form.videoCover" :src="form.videoCover" class="avatar" style="height:80px;width:80px;">-->
|
|
|
+ <!--<i v-if="!form.videoCover" class="el-icon-plus avatar-uploader-icon"></i>-->
|
|
|
+ <!--</el-upload>-->
|
|
|
+ <!--<i v-if="form.videoCover" class="el-icon-view" @click="lookImg(form.videoCover)"-->
|
|
|
+ <!--style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;-->
|
|
|
+ <!--height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>-->
|
|
|
+ <!--</el-form-item>-->
|
|
|
+ <!--<el-form-item label="操作指南:" prop="operationGuide">-->
|
|
|
+ <!--<el-upload-->
|
|
|
+ <!--class="certificate-avatar-uploader"-->
|
|
|
+ <!--:action="uploadImgUrl"-->
|
|
|
+ <!--:show-file-list="false"-->
|
|
|
+ <!--accept="image/jpeg,image/gif,image/png"-->
|
|
|
+ <!--:on-success="(res)=>handleAvatarSuccess(res,'operationGuide')"-->
|
|
|
+ <!--:headers="headers"-->
|
|
|
+ <!--:before-upload="beforeAvatarUpload">-->
|
|
|
+ <!--<img v-if="form.operationGuide" :src="form.operationGuide" class="avatar" style="height:80px;width:80px;">-->
|
|
|
+ <!--<i v-if="!form.operationGuide" class="el-icon-plus avatar-uploader-icon"></i>-->
|
|
|
+ <!--</el-upload>-->
|
|
|
+ <!--<i v-if="form.operationGuide" class="el-icon-view" @click="lookImg(form.operationGuide)"-->
|
|
|
+ <!--style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;-->
|
|
|
+ <!--height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>-->
|
|
|
+ <!--</el-form-item>-->
|
|
|
+ <!--</div>-->
|
|
|
+ <!--<div class="title-box">-->
|
|
|
+ <!--<p>小程序</p>-->
|
|
|
+ <!--</div>-->
|
|
|
+ <!--<div class="form-max-box">-->
|
|
|
+ <!--<el-form-item label="登录页banner:" prop="loginBanner">-->
|
|
|
+ <!--<el-upload-->
|
|
|
+ <!--class="certificate-avatar-uploader"-->
|
|
|
+ <!--:action="uploadImgUrl"-->
|
|
|
+ <!--:show-file-list="false"-->
|
|
|
+ <!--accept="image/jpeg,image/gif,image/png"-->
|
|
|
+ <!--:on-success="(res)=>handleAvatarSuccess(res,'loginBanner')"-->
|
|
|
+ <!--:headers="headers"-->
|
|
|
+ <!--:before-upload="beforeAvatarUpload">-->
|
|
|
+ <!--<img v-if="form.loginBanner" :src="form.loginBanner" class="avatar" style="height:80px;width:80px;">-->
|
|
|
+ <!--<i v-if="!form.loginBanner" class="el-icon-plus avatar-uploader-icon"></i>-->
|
|
|
+ <!--</el-upload>-->
|
|
|
+ <!--<i v-if="form.loginBanner" class="el-icon-view" @click="lookImg(form.loginBanner)"-->
|
|
|
+ <!--style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;-->
|
|
|
+ <!--height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>-->
|
|
|
+ <!--</el-form-item>-->
|
|
|
+ <!--<el-form-item label="首页banner:" prop="homepageBanner">-->
|
|
|
+ <!--<el-upload-->
|
|
|
+ <!--class="certificate-avatar-uploader"-->
|
|
|
+ <!--:action="uploadImgUrl"-->
|
|
|
+ <!--:show-file-list="false"-->
|
|
|
+ <!--accept="image/jpeg,image/gif,image/png"-->
|
|
|
+ <!--:on-success="(res)=>handleAvatarSuccess(res,'homepageBanner')"-->
|
|
|
+ <!--:headers="headers"-->
|
|
|
+ <!--:before-upload="beforeAvatarUpload">-->
|
|
|
+ <!--<img v-if="form.homepageBanner" :src="form.homepageBanner" class="avatar" style="height:80px;width:80px;">-->
|
|
|
+ <!--<i v-if="!form.homepageBanner" class="el-icon-plus avatar-uploader-icon"></i>-->
|
|
|
+ <!--</el-upload>-->
|
|
|
+ <!--<i v-if="form.homepageBanner" class="el-icon-view" @click="lookImg(form.homepageBanner)"-->
|
|
|
+ <!--style="position: absolute;top:0;right:0;z-index:999;border-radius:3px;cursor:pointer;width:20px;-->
|
|
|
+ <!--height:20px;line-height:20px;text-align: center;background: rgba(0,0,0,0.2);color:#fff;"></i>-->
|
|
|
+ <!--</el-form-item>-->
|
|
|
+ <!--</div>-->
|
|
|
+ <div class="title-box">
|
|
|
+ <p>化学品智能终端</p>
|
|
|
+ </div>
|
|
|
+ <div class="form-max-box">
|
|
|
+ <el-form-item label="使用身份配置" prop="userType">
|
|
|
+ <el-checkbox-group v-model="form.userType">
|
|
|
+ <el-checkbox style="margin:4px 87px 0 20px;" label="11">教职工</el-checkbox>
|
|
|
+ <el-checkbox label="22">学生</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ <!--<el-radio-group v-model="form.userType">-->
|
|
|
+ <!--<el-radio style="margin:4px 28px 0 20px;" label="-1">全部</el-radio>-->
|
|
|
+ <!--<el-radio style="margin:4px 30px 0 0;" label="11">教职工</el-radio>-->
|
|
|
+ <!--<el-radio label="22">学生</el-radio>-->
|
|
|
+ <!--</el-radio-group>-->
|
|
|
+ <!--<el-select v-model="form.userType" placeholder="请配置使用身份" style="width:200px;">-->
|
|
|
+ <!--<el-option label="全部" value="-1" />-->
|
|
|
+ <!--<el-option label="教职工" value="11" />-->
|
|
|
+ <!--<el-option label="学生" value="22" />-->
|
|
|
+ <!--</el-select>-->
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <div class="form-max-box">
|
|
|
+ <el-form-item label="扩展配置" prop="expandType">
|
|
|
+ <el-checkbox-group v-model="form.expandType">
|
|
|
+ <el-checkbox style="margin:4px 30px 0 20px;" label="11">化学品柜智能锁</el-checkbox>
|
|
|
+ <el-checkbox label="22">气瓶标签</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </el-form-item>
|
|
|
+ </div>
|
|
|
+ <!--<div class="form-max-box">-->
|
|
|
+ <!--<el-form-item label="智能锁配置" prop="smartLock">-->
|
|
|
+ <!--<el-radio-group v-model="form.smartLock">-->
|
|
|
+ <!--<el-radio style="margin:4px 40px 0 20px;" :label="1">有</el-radio>-->
|
|
|
+ <!--<el-radio :label="0">无</el-radio>-->
|
|
|
+ <!--</el-radio-group>-->
|
|
|
+ <!--<!–<el-select v-model="form.smartLock" placeholder="请配置智能锁" style="width:200px;">–>-->
|
|
|
+ <!--<!–<el-option label="有" :value="1" />–>-->
|
|
|
+ <!--<!–<el-option label="无" :value="0" />–>-->
|
|
|
+ <!--<!–</el-select>–>-->
|
|
|
+ <!--</el-form-item>-->
|
|
|
+ <!--</div>-->
|
|
|
+ <!--<div class="form-max-box">-->
|
|
|
+ <!--<el-form-item label="气瓶标签配置" prop="airBottle">-->
|
|
|
+ <!--<el-radio-group v-model="form.airBottle">-->
|
|
|
+ <!--<el-radio style="margin:4px 40px 0 20px;" :label="1">有</el-radio>-->
|
|
|
+ <!--<el-radio :label="0">无</el-radio>-->
|
|
|
+ <!--</el-radio-group>-->
|
|
|
+ <!--<!–<el-select v-model="form.airBottle" placeholder="请配置气瓶标签" style="width:200px;">–>-->
|
|
|
+ <!--<!–<el-option label="有" :value="1" />–>-->
|
|
|
+ <!--<!–<el-option label="无" :value="0" />–>-->
|
|
|
+ <!--<!–</el-select>–>-->
|
|
|
+ <!--</el-form-item>-->
|
|
|
+ <!--</div>-->
|
|
|
+ </el-form>
|
|
|
+ <p class="inquire-button-one" style="margin:60px auto 60px;display: block" @click="submitForm">保存</p>
|
|
|
+ <!--查看图片-->
|
|
|
+ <el-dialog title="查看" :visible.sync="imgOpen" width="1200px" append-to-body>
|
|
|
+ <div class="scrollbar-box" style="width:1160px;margin:0 auto;max-height:700px;overflow-y: scroll">
|
|
|
+ <img :src="imgUrl" style="display:block;max-width:1160px;margin:0 auto">
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ import { getToken } from "@/utils/auth";
|
|
|
+ import { getLogoInfo,updateLogoInfo } from "@/api/system/publicConfig";
|
|
|
+ import store from '@/store'
|
|
|
+ export default {
|
|
|
+ name: "publicConfig",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ uploadImgUrl: window.location.href.split('://')[0]+'://' + process.env.VUE_APP_BASE_API + "/file/upload", // 上传的图片服务器地址
|
|
|
+ headers: {
|
|
|
+ Authorization: "Bearer " + getToken(),
|
|
|
+ },
|
|
|
+ form:{
|
|
|
+ userType:[],
|
|
|
+ expandType:[]
|
|
|
+ },
|
|
|
+ rules: {
|
|
|
+ schoolName: [
|
|
|
+ { required: true, message: "学校名称不能为空", trigger: "blur" },
|
|
|
+ { required: true, message: "学校名称不能为空", validator: this.spaceJudgment, trigger: "blur" }
|
|
|
+ ],
|
|
|
+ circularLogo: [
|
|
|
+ { required: true, message: "圆形Logo不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ rectangleLogo: [
|
|
|
+ { required: true, message: "长方形Logo不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ signMap: [
|
|
|
+ { required: true, message: "签到/离开示意图不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ videoCover: [
|
|
|
+ { required: true, message: "视频封面不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ operationGuide: [
|
|
|
+ { required: true, message: "操作指南不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ loginBanner: [
|
|
|
+ { required: true, message: "登录页banner不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ homepageBanner: [
|
|
|
+ { required: true, message: "首页banner不能为空", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ userType: [
|
|
|
+ { required: true, message: "请配置使用身份", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ smartLock: [
|
|
|
+ { required: true, message: "请配置智能锁", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ airBottle: [
|
|
|
+ { required: true, message: "请配置气瓶标签", trigger: "blur" }
|
|
|
+ ],
|
|
|
+ // expandType: [
|
|
|
+ // { required: true, message: "请配置扩展配置", trigger: "blur" }
|
|
|
+ // ]
|
|
|
+ },
|
|
|
+ imgUrl:"",
|
|
|
+ imgOpen:false,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+
|
|
|
+ },
|
|
|
+ mounted(){
|
|
|
+ this.getLogoInfo();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ /** 提交按钮 */
|
|
|
+ submitForm: function() {
|
|
|
+ let self = this;
|
|
|
+ this.$refs["form"].validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ let obj = {
|
|
|
+ schoolName:this.form.schoolName,
|
|
|
+ circularLogo:this.form.circularLogo,
|
|
|
+ rectangleLogo:this.form.rectangleLogo,
|
|
|
+ // signMap:this.form.signMap,
|
|
|
+ // videoCover:this.form.videoCover,
|
|
|
+ // operationGuide:this.form.operationGuide,
|
|
|
+ // loginBanner:this.form.loginBanner,
|
|
|
+ // homepageBanner:this.form.homepageBanner,
|
|
|
+ // smartLock:0,
|
|
|
+ // airBottle:0,
|
|
|
+ }
|
|
|
+ //判断使用身份配置
|
|
|
+ if(self.form.userType[1]){
|
|
|
+ obj.userType = '-1';
|
|
|
+ }else{
|
|
|
+ if(self.form.userType[0] == '11'){
|
|
|
+ obj.userType = '11';
|
|
|
+ }else if(self.form.userType[0] == '22'){
|
|
|
+ obj.userType = '22';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ //判断扩展配置(智能锁配置/气瓶标签配置)
|
|
|
+ let oneType = 0;
|
|
|
+ let twoType = 0;
|
|
|
+ for(let i=0;i<self.form.expandType.length;i++){
|
|
|
+ if(self.form.expandType[i] == '11'){
|
|
|
+ obj.smartLock = 1;
|
|
|
+ oneType++
|
|
|
+ }else if(self.form.expandType[i] == '22'){
|
|
|
+ obj.airBottle = 1;
|
|
|
+ twoType++
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(oneType==0){
|
|
|
+ obj.smartLock = 0;
|
|
|
+ }
|
|
|
+ if(twoType==0){
|
|
|
+ obj.airBottle = 0;
|
|
|
+ }
|
|
|
+ updateLogoInfo(obj).then(response => {
|
|
|
+ this.msgSuccess(response.msg);
|
|
|
+ this.getLogoInfo();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //查看图片
|
|
|
+ lookImg(url){
|
|
|
+ this.imgUrl = url;
|
|
|
+ this.imgOpen = true;
|
|
|
+ },
|
|
|
+ //获取数据
|
|
|
+ getLogoInfo(){
|
|
|
+ getLogoInfo().then(response => {
|
|
|
+ store.dispatch('settings/setSmartAlarmType', response.data.smartLock)
|
|
|
+ localStorage.setItem('setSmartAlarmType',response.data.smartLock)
|
|
|
+ localStorage.setItem('circularLogo',response.data.circularLogo)
|
|
|
+ localStorage.setItem('rectangleLogo',response.data.rectangleLogo)
|
|
|
+ localStorage.setItem('videoCover',response.data.videoCover)
|
|
|
+ //判断使用身份配置
|
|
|
+ let listOne = [];
|
|
|
+ if(response.data.userType == -1){
|
|
|
+ listOne.push('11')
|
|
|
+ listOne.push('22')
|
|
|
+ }else if(response.data.userType == 11){
|
|
|
+ listOne.push('11')
|
|
|
+ }else if(response.data.userType == 22){
|
|
|
+ listOne.push('22')
|
|
|
+ }
|
|
|
+ this.$set(response.data,'userType',listOne);
|
|
|
+ //判断扩展配置
|
|
|
+ let listTwo = [];
|
|
|
+ if(response.data.smartLock == 1){
|
|
|
+ listTwo.push('11')
|
|
|
+ }
|
|
|
+ if(response.data.airBottle == 1){
|
|
|
+ listTwo.push('22')
|
|
|
+ }
|
|
|
+ this.$set(response.data,'expandType',listTwo);
|
|
|
+ this.$set(this,'form',response.data)
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //上传
|
|
|
+ handleAvatarSuccess(res,type) {
|
|
|
+ if(type == 'circularLogo'){
|
|
|
+ this.$set(this.form,'circularLogo',res.data.url);
|
|
|
+ }else if(type == 'rectangleLogo'){
|
|
|
+ this.$set(this.form,'rectangleLogo',res.data.url);
|
|
|
+ }else if(type == 'signMap'){
|
|
|
+ this.$set(this.form,'signMap',res.data.url);
|
|
|
+ }else if(type == 'videoCover'){
|
|
|
+ this.$set(this.form,'videoCover',res.data.url);
|
|
|
+ }else if(type == 'operationGuide'){
|
|
|
+ this.$set(this.form,'operationGuide',res.data.url);
|
|
|
+ }else if(type == 'loginBanner'){
|
|
|
+ this.$set(this.form,'loginBanner',res.data.url);
|
|
|
+ }else if(type == 'homepageBanner'){
|
|
|
+ this.$set(this.form,'homepageBanner',res.data.url);
|
|
|
+ }
|
|
|
+ this.$forceUpdate()
|
|
|
+ },
|
|
|
+ beforeAvatarUpload(file) {
|
|
|
+ let type = false;
|
|
|
+ console.log('file',file);
|
|
|
+ if (file.type == 'image/png' || file.type == 'image/jpeg' || file.type == 'image/gif') {
|
|
|
+ type = true;
|
|
|
+ }else{
|
|
|
+ this.$message.error('只能上传png/jpeg/gif格式图片');
|
|
|
+ type = false;
|
|
|
+ }
|
|
|
+ return type;
|
|
|
+ },
|
|
|
+ },
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped lang="scss">
|
|
|
+ .public-config-page{
|
|
|
+ *{
|
|
|
+ margin:0;
|
|
|
+ }
|
|
|
+ .title-box{
|
|
|
+ border-bottom:1px solid #dedede;
|
|
|
+ p{
|
|
|
+ margin-left:40px;
|
|
|
+ color:#0045af;
|
|
|
+ line-height:60px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .form-max-box{
|
|
|
+ margin-top:20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|