springboot014校园管理系统的设计与实现
管理员登录，通过填写注册时输入的用户名、密码、角色进行登录，。
院校管理，在院校管理页面中可以通过填写学院名称、资料文件、学院简介、职工人数、院校账号等信息进行详情、修改、删除等操作，。还可以根据需要对用户管理进行详情、修改或删除等详细操作，。
单位类别管理，在单位类别管理页面中可以填写单位类别等信息，并可根据需要对单位类别管理进行详情、修改或删除等操作，。
院校管理员管理，在院校管理员管理页面中可以填写院校账号、负责人姓名、性别、年龄、联系方式、备注等信息，并可根据需要对院校管理员管理进行详情、修改或删除等详细操作，。
单位管理，在单位管理页面中可以填写姓名、性别、年龄、照片、个人资料、单位类别、备注、联系方式等信息，并且根据需要对单位管理进行详情、绑定用户、修改或删除等详细操作，。
通知推送管理，在通知推送管理页面中可以填写院校账号、负责人姓名、用户账号、用户姓名、通知内容、发送时间等信息，并且根据需要对通知推送管理进行详情、修改或删除等详细操作，。
投票信息管理，在投票信息管理页面中可以填写候选人姓名、性别、年龄、赞成票、反对票、更新时间等内容，并且根据需要对投票信息管理进行详情、修改或删除等详细操作，。
通知回复管理，在通知回复管理页面中可以填写院校账号、用户账号、回复内容、回复时间等内容，并且根据需要对通知回复管理进行详情、修改或删除等详细操作，。
个人信息，在个人信息页面中通过填写用户账号、用户姓名、性别、年龄、个人资料、照片、联系方式、单位类别等信息还可以根据需要对个人信息进行修改，。
单位管理，在单位管理页面中可以查看姓名、性别、年龄、照片、个人资料、单位类别、备注、联系方式等信息内容，并且根据需要对单位管理进行详情等其他详细操作，。
通知推送管理，在通知推送管理页面中通过填写院校账号、负责人姓名、用户账号、用户姓名、通知内容、发送时间等内容进行详情、修改、删除等操作，。
投票信息管理，在投票信息管理页面中通过填写候选人姓名、性别、年龄、赞成票、反对票、更新时间等内容进行详情等操作，。
个人信息，在个人信息页面中通过填写院校账号、负责人姓名、性别、年龄、联系方式、备注等信息还可以根据需要对个人信息进行修改等操作，。
用户管理，在用户管理页面中可以填写用户账号、用户姓名、性别、年龄、个人资料、照片、联系方式、单位类别等信息内容，并且根据需要对用户管理进行详情、修改或删除等其他详细操作，。
单位类别管理，在单位类别管理页面中通过填写单位类别等内容进行详情、修改、删除，。
通知推送管理，在通知推送管理页面中通过填写院校账号、负责人姓名、用户账号、用户姓名、通知内容、发送时间等内容进行详情、回复等操作，。
通知回复管理，在通知回复管理页面中通过填写院校账号、用户账号、回复内容、回复时间等内容进行详情、修改、删除等操作，。
TokenServiceImpl.java
package com.service.impl;
import java.util.Calendar;
import java.util.Date;
import java.util.List;
import java.util.Map;
import org.springframework.stereotype.Service;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.baomidou.mybatisplus.plugins.Page;
import com.baomidou.mybatisplus.service.impl.ServiceImpl;
import com.dao.TokenDao;
import com.entity.TokenEntity;
import com.entity.TokenEntity;
import com.service.TokenService;
import com.utils.CommonUtil;
import com.utils.PageUtils;
import com.utils.Query;
/**
* token
*/
@Service("tokenService")
public class TokenServiceImpl extends ServiceImpl<TokenDao, TokenEntity> implements TokenService {
@Override
public PageUtils queryPage(Map<String, Object> params) {
Page<TokenEntity> page = this.selectPage(
new Query<TokenEntity>(params).getPage(),
new EntityWrapper<TokenEntity>()
);
return new PageUtils(page);
}
@Override
public List<TokenEntity> selectListView(Wrapper<TokenEntity> wrapper) {
return baseMapper.selectListView(wrapper);
}
@Override
public PageUtils queryPage(Map<String, Object> params,
Wrapper<TokenEntity> wrapper) {
Page<TokenEntity> page =new Query<TokenEntity>(params).getPage();
page.setRecords(baseMapper.selectListView(page,wrapper));
PageUtils pageUtil = new PageUtils(page);
return pageUtil;
}
@Override
public String generateToken(Long userid,String username, String tableName, String role) {
TokenEntity tokenEntity = this.selectOne(new EntityWrapper<TokenEntity>().eq("userid", userid).eq("role", role));
String token = CommonUtil.getRandomString(32);
Calendar cal = Calendar.getInstance();
cal.setTime(new Date());
cal.add(Calendar.HOUR_OF_DAY, 1);
if(tokenEntity!=null) {
tokenEntity.setToken(token);
tokenEntity.setExpiratedtime(cal.getTime());
this.updateById(tokenEntity);
} else {
this.insert(new TokenEntity(userid,username, tableName, role, token, cal.getTime()));
}
return token;
}
@Override
public TokenEntity getTokenEntity(String token) {
TokenEntity tokenEntity = this.selectOne(new EntityWrapper<TokenEntity>().eq("token", token));
if(tokenEntity == null || tokenEntity.getExpiratedtime().getTime()<new Date().getTime()) {
return null;
}
return tokenEntity;
}
}
DanweileibieController.java
package com.controller;
import java.text.SimpleDateFormat;
import java.util.ArrayList;
import java.util.Arrays;
import java.util.Calendar;
import java.util.Map;
import java.util.HashMap;
import java.util.Iterator;
import java.util.Date;
import java.util.List;
import javax.servlet.http.HttpServletRequest;
import com.utils.ValidatorUtils;
import org.apache.commons.lang3.StringUtils;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.PathVariable;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.RestController;
import com.baomidou.mybatisplus.mapper.EntityWrapper;
import com.baomidou.mybatisplus.mapper.Wrapper;
import com.annotation.IgnoreAuth;
import com.entity.DanweileibieEntity;
import com.entity.view.DanweileibieView;
import com.service.DanweileibieService;
import com.service.TokenService;
import com.utils.PageUtils;
import com.utils.R;
import com.utils.MD5Util;
import com.utils.MPUtil;
import com.utils.CommonUtil;
/**
* 单位类别
* 后端接口
* @author
* @email
* @date 2021-03-09 11:06:58
*/
@RestController
@RequestMapping("/danweileibie")
public class DanweileibieController {
@Autowired
private DanweileibieService danweileibieService;
/**
* 后端列表
*/
@RequestMapping("/page")
public R page(@RequestParam Map<String, Object> params,DanweileibieEntity danweileibie, HttpServletRequest request){
EntityWrapper<DanweileibieEntity> ew = new EntityWrapper<DanweileibieEntity>();
PageUtils page = danweileibieService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, danweileibie), params), params));
return R.ok().put("data", page);
}
/**
* 前端列表
*/
@RequestMapping("/list")
public R list(@RequestParam Map<String, Object> params,DanweileibieEntity danweileibie, HttpServletRequest request){
EntityWrapper<DanweileibieEntity> ew = new EntityWrapper<DanweileibieEntity>();
PageUtils page = danweileibieService.queryPage(params, MPUtil.sort(MPUtil.between(MPUtil.likeOrEq(ew, danweileibie), params), params));
return R.ok().put("data", page);
}
/**
* 列表
*/
@RequestMapping("/lists")
public R list( DanweileibieEntity danweileibie){
EntityWrapper<DanweileibieEntity> ew = new EntityWrapper<DanweileibieEntity>();
ew.allEq(MPUtil.allEQMapPre( danweileibie, "danweileibie"));
return R.ok().put("data", danweileibieService.selectListView(ew));
}
/**
* 查询
*/
@RequestMapping("/query")
public R query(DanweileibieEntity danweileibie){
EntityWrapper< DanweileibieEntity> ew = new EntityWrapper< DanweileibieEntity>();
ew.allEq(MPUtil.allEQMapPre( danweileibie, "danweileibie"));
DanweileibieView danweileibieView = danweileibieService.selectView(ew);
return R.ok("查询单位类别成功").put("data", danweileibieView);
}
/**
* 后端详情
*/
@RequestMapping("/info/{id}")
public R info(@PathVariable("id") Long id){
DanweileibieEntity danweileibie = danweileibieService.selectById(id);
return R.ok().put("data", danweileibie);
}
/**
* 前端详情
*/
@RequestMapping("/detail/{id}")
public R detail(@PathVariable("id") Long id){
DanweileibieEntity danweileibie = danweileibieService.selectById(id);
return R.ok().put("data", danweileibie);
}
/**
* 后端保存
*/
@RequestMapping("/save")
public R save(@RequestBody DanweileibieEntity danweileibie, HttpServletRequest request){
danweileibie.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
//ValidatorUtils.validateEntity(danweileibie);
danweileibieService.insert(danweileibie);
return R.ok();
}
/**
* 前端保存
*/
@RequestMapping("/add")
public R add(@RequestBody DanweileibieEntity danweileibie, HttpServletRequest request){
danweileibie.setId(new Date().getTime()+new Double(Math.floor(Math.random()*1000)).longValue());
//ValidatorUtils.validateEntity(danweileibie);
danweileibieService.insert(danweileibie);
return R.ok();
}
/**
* 修改
*/
@RequestMapping("/update")
public R update(@RequestBody DanweileibieEntity danweileibie, HttpServletRequest request){
//ValidatorUtils.validateEntity(danweileibie);
danweileibieService.updateById(danweileibie);//全部更新
return R.ok();
}
/**
* 删除
*/
@RequestMapping("/delete")
public R delete(@RequestBody Long[] ids){
danweileibieService.deleteBatchIds(Arrays.asList(ids));
return R.ok();
}
/**
* 提醒接口
*/
@RequestMapping("/remind/{columnName}/{type}")
public R remindCount(@PathVariable("columnName") String columnName, HttpServletRequest request,
@PathVariable("type") String type,@RequestParam Map<String, Object> map) {
map.put("column", columnName);
map.put("type", type);
if(type.equals("2")) {
SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd");
Calendar c = Calendar.getInstance();
Date remindStartDate = null;
Date remindEndDate = null;
if(map.get("remindstart")!=null) {
Integer remindStart = Integer.parseInt(map.get("remindstart").toString());
c.setTime(new Date());
c.add(Calendar.DAY_OF_MONTH,remindStart);
remindStartDate = c.getTime();
map.put("remindstart", sdf.format(remindStartDate));
}
if(map.get("remindend")!=null) {
Integer remindEnd = Integer.parseInt(map.get("remindend").toString());
c.setTime(new Date());
c.add(Calendar.DAY_OF_MONTH,remindEnd);
remindEndDate = c.getTime();
map.put("remindend", sdf.format(remindEndDate));
}
}
Wrapper<DanweileibieEntity> wrapper = new EntityWrapper<DanweileibieEntity>();
if(map.get("remindstart")!=null) {
wrapper.ge(columnName, map.get("remindstart"));
}
if(map.get("remindend")!=null) {
wrapper.le(columnName, map.get("remindend"));
}
int count = danweileibieService.selectCount(wrapper);
return R.ok().put("count", count);
}
}
add-or-update.vue
<template>
<div class="addEdit-block">
<el-form
class="detail-form-content"
ref="ruleForm"
:model="ruleForm"
:rules="rules"
label-width="80px"
:style="{backgroundColor:addEditForm.addEditBoxColor}"
>
<el-row>
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="姓名" prop="xingming">
<el-input v-model="ruleForm.xingming"
placeholder="姓名" clearable :readonly="ro.xingming"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="姓名" prop="xingming">
<el-input v-model="ruleForm.xingming"
placeholder="姓名" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="性别" prop="xingbie">
<el-input v-model="ruleForm.xingbie"
placeholder="性别" clearable :readonly="ro.xingbie"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="性别" prop="xingbie">
<el-input v-model="ruleForm.xingbie"
placeholder="性别" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="年龄" prop="nianling">
<el-input v-model="ruleForm.nianling"
placeholder="年龄" clearable :readonly="ro.nianling"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="年龄" prop="nianling">
<el-input v-model="ruleForm.nianling"
placeholder="年龄" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="24">
<el-form-item class="upload" v-if="type!='info' && !ro.zhaopian" label="照片" prop="zhaopian">
<file-upload
tip="点击上传照片"
action="file/upload"
:limit="3"
:multiple="true"
:fileUrls="ruleForm.zhaopian?ruleForm.zhaopian:''"
@change="zhaopianUploadChange"
></file-upload>
</el-form-item>
<div v-else>
<el-form-item v-if="ruleForm.zhaopian" label="照片" prop="zhaopian">
<img style="margin-right:20px;" v-bind:key="index" v-for="(item,index) in ruleForm.zhaopian.split(',')" :src="item" width="100" height="100">
</el-form-item>
</div>
</el-col>
<el-col :span="24">
<el-form-item class="upload" v-if="type!='info'" label="个人资料" prop="gerenziliao">
<file-upload
tip="点击上传个人资料"
action="file/upload"
:limit="1"
:multiple="true"
:fileUrls="ruleForm.gerenziliao?ruleForm.gerenziliao:''"
@change="gerenziliaoUploadChange"
></file-upload>
</el-form-item>
<div v-else>
<el-form-item v-if="ruleForm.gerenziliao" label="个人资料" prop="gerenziliao">
<el-button type="text" size="small" @click="download(ruleForm.gerenziliao)">下载</el-button>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="select" v-if="type!='info'" label="单位类别" prop="danweileibie">
<el-select v-model="ruleForm.danweileibie" placeholder="请选择单位类别">
<el-option
v-for="(item,index) in danweileibieOptions"
v-bind:key="index"
:label="item"
:value="item">
</el-option>
</el-select>
</el-form-item>
<div v-else>
<el-form-item class="input" label="单位类别" prop="danweileibie">
<el-input v-model="ruleForm.danweileibie"
placeholder="单位类别" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="备注" prop="beizhu">
<el-input v-model="ruleForm.beizhu"
placeholder="备注" clearable :readonly="ro.beizhu"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="备注" prop="beizhu">
<el-input v-model="ruleForm.beizhu"
placeholder="备注" readonly></el-input>
</el-form-item>
</div>
</el-col>
<el-col :span="12">
<el-form-item class="input" v-if="type!='info'" label="联系方式" prop="lianxifangshi">
<el-input v-model="ruleForm.lianxifangshi"
placeholder="联系方式" clearable :readonly="ro.lianxifangshi"></el-input>
</el-form-item>
<div v-else>
<el-form-item class="input" label="联系方式" prop="lianxifangshi">
<el-input v-model="ruleForm.lianxifangshi"
placeholder="联系方式" readonly></el-input>
</el-form-item>
</div>
</el-col>
</el-row>
<el-form-item class="btn">
<el-button v-if="type!='info'" type="primary" class="btn-success" @click="onSubmit">提交</el-button>
<el-button v-if="type!='info'" class="btn-close" @click="back()">取消</el-button>
<el-button v-if="type=='info'" class="btn-close" @click="back()">返回</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
// 数字，邮件，手机，url，身份证校验
import { isNumber,isIntNumer,isEmail,isPhone, isMobile,isURL,checkIdCard } from "@/utils/validate";
export default {
data() {
let self = this
var validateIdCard = (rule, value, callback) => {
if(!value){
callback();
} else if (!checkIdCard(value)) {
callback(new Error("请输入正确的身份证号码"));
} else {
callback();
}
};
var validateUrl = (rule, value, callback) => {
if(!value){
callback();
} else if (!isURL(value)) {
callback(new Error("请输入正确的URL地址"));
} else {
callback();
}
};
var validateMobile = (rule, value, callback) => {
if(!value){
callback();
} else if (!isMobile(value)) {
callback(new Error("请输入正确的手机号码"));
} else {
callback();
}
};
var validatePhone = (rule, value, callback) => {
if(!value){
callback();
} else if (!isPhone(value)) {
callback(new Error("请输入正确的电话号码"));
} else {
callback();
}
};
var validateEmail = (rule, value, callback) => {
if(!value){
callback();
} else if (!isEmail(value)) {
callback(new Error("请输入正确的邮箱地址"));
} else {
callback();
}
};
var validateNumber = (rule, value, callback) => {
if(!value){
callback();
} else if (!isNumber(value)) {
callback(new Error("请输入数字"));
} else {
callback();
}
};
var validateIntNumber = (rule, value, callback) => {
if(!value){
callback();
} else if (!isIntNumer(value)) {
callback(new Error("请输入整数"));
} else {
callback();
}
};
return {
addEditForm: {"btnSaveFontColor":"rgba(55, 50, 50, 1)","selectFontSize":"14px","btnCancelBorderColor":"rgba(64, 158, 255, 1)","inputBorderRadius":"4px","inputFontSize":"14px","textareaBgColor":"rgba(252, 251, 251, 1)","btnSaveFontSize":"14px","textareaBorderRadius":"4px","uploadBgColor":"rgba(252, 251, 251, 1)","textareaBorderStyle":"solid","btnCancelWidth":"88px","textareaHeight":"120px","dateBgColor":"rgba(252, 251, 251, 1)","btnSaveBorderRadius":"8px","uploadLableFontSize":"14px","textareaBorderWidth":"1px","inputLableColor":"#606266","addEditBoxColor":"rgba(228, 221, 221, 0.17)","dateIconFontSize":"14px","btnSaveBgColor":"rgba(136, 238, 122, 1)","uploadIconFontColor":"#8c939d","textareaBorderColor":"#DCDFE6","btnCancelBgColor":"rgba(232, 198, 111, 1)","selectLableColor":"#606266","btnSaveBorderStyle":"solid","dateBorderWidth":"1px","dateLableFontSize":"14px","dateBorderRadius":"4px","btnCancelBorderStyle":"solid","selectLableFontSize":"14px","selectBorderStyle":"solid","selectIconFontColor":"#C0C4CC","btnCancelHeight":"44px","inputHeight":"40px","btnCancelFontColor":"#606266","dateBorderColor":"#DCDFE6","dateIconFontColor":"#C0C4CC","uploadBorderStyle":"solid","dateBorderStyle":"solid","dateLableColor":"#606266","dateFontSize":"14px","inputBorderWidth":"1px","uploadIconFontSize":"28px","selectHeight":"40px","inputFontColor":"rgba(14, 14, 14, 1)","uploadHeight":"148px","textareaLableColor":"#606266","textareaLableFontSize":"14px","btnCancelFontSize":"14px","inputBorderStyle":"solid","btnCancelBorderRadius":"8px","inputBgColor":"rgba(252, 251, 251, 1)","inputLableFontSize":"14px","uploadLableColor":"#606266","uploadBorderRadius":"4px","btnSaveHeight":"44px","selectBgColor":"rgba(252, 251, 251, 1)","btnSaveWidth":"88px","selectIconFontSize":"14px","dateHeight":"40px","selectBorderColor":"#DCDFE6","inputBorderColor":"rgba(192, 193, 197, 0.21)","uploadBorderColor":"#DCDFE6","textareaFontColor":"#606266","selectBorderWidth":"1px","dateFontColor":"#606266","btnCancelBorderWidth":"1px","uploadBorderWidth":"1px","textareaFontSize":"14px","selectBorderRadius":"4px","selectFontColor":"#606266","btnSaveBorderColor":"rgba(64, 158, 255, 1)","btnSaveBorderWidth":"1px"},
id: '',
type: '',
ro:{
xingming : false,
xingbie : false,
nianling : false,
zhaopian : false,
gerenziliao : false,
danweileibie : false,
beizhu : false,
lianxifangshi : false,
},
ruleForm: {
xingming: '',
xingbie: '',
nianling: '',
zhaopian: '',
gerenziliao: '',
danweileibie: '',
beizhu: '',
lianxifangshi: '',
},
danweileibieOptions: [],
rules: {
xingming: [
],
xingbie: [
],
nianling: [
],
zhaopian: [
],
gerenziliao: [
],
danweileibie: [
],
beizhu: [
],
lianxifangshi: [
],
}
};
},
props: ["parent"],
computed: {
},
created() {
this.addEditStyleChange()
this.addEditUploadStyleChange()
},
methods: {
// 下载
download(file){
window.open(`${file}`)
},
// 初始化
init(id,type) {
if (id) {
this.id = id;
this.type = type;
}
if(this.type=='info'||this.type=='else'){
this.info(id);
}else if(this.type=='cross'){
var obj = this.$storage.getObj('crossObj');
for (var o in obj){
if(o=='xingming'){
this.ruleForm.xingming = obj[o];
this.ro.xingming = true;
continue;
}
if(o=='xingbie'){
this.ruleForm.xingbie = obj[o];
this.ro.xingbie = true;
continue;
}
if(o=='nianling'){
this.ruleForm.nianling = obj[o];
this.ro.nianling = true;
continue;
}
if(o=='zhaopian'){
this.ruleForm.zhaopian = obj[o];
this.ro.zhaopian = true;
continue;
}
if(o=='gerenziliao'){
this.ruleForm.gerenziliao = obj[o];
this.ro.gerenziliao = true;
continue;
}
if(o=='danweileibie'){
this.ruleForm.danweileibie = obj[o];
this.ro.danweileibie = true;
continue;
}
if(o=='beizhu'){
this.ruleForm.beizhu = obj[o];
this.ro.beizhu = true;
continue;
}
if(o=='lianxifangshi'){
this.ruleForm.lianxifangshi = obj[o];
this.ro.lianxifangshi = true;
continue;
}
}
}
// 获取用户信息
this.$http({
url: `${this.$storage.get('sessionTable')}/session`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
var json = data.data;
} else {
this.$message.error(data.msg);
}
});
this.$http({
url: `option/danweileibie/danweileibie`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.danweileibieOptions = data.data;
} else {
this.$message.error(data.msg);
}
});
},
// 多级联动参数
info(id) {
this.$http({
url: `danwei/info/${id}`,
method: "get"
}).then(({ data }) => {
if (data && data.code === 0) {
this.ruleForm = data.data;
} else {
this.$message.error(data.msg);
}
});
},
// 提交
onSubmit() {
// ${column.compare}
// ${column.compare}
// ${column.compare}
// ${column.compare}
// ${column.compare}
// ${column.compare}
// ${column.compare}
// ${column.compare}
this.$refs["ruleForm"].validate(valid => {
if (valid) {
this.$http({
url: `danwei/${!this.ruleForm.id ? "save" : "update"}`,
method: "post",
data: this.ruleForm
}).then(({ data }) => {
if (data && data.code === 0) {
this.$message({
message: "操作成功",
type: "success",
duration: 1500,
onClose: () => {
this.parent.showFlag = true;
this.parent.addOrUpdateFlag = false;
this.parent.danweiCrossAddOrUpdateFlag = false;
this.parent.search();
this.parent.contentStyleChange();
}
});
} else {
this.$message.error(data.msg);
}
});
}
});
},
// 获取uuid
getUUID () {
return new Date().getTime();
},
// 返回
back() {
this.parent.showFlag = true;
this.parent.addOrUpdateFlag = false;
this.parent.danweiCrossAddOrUpdateFlag = false;
this.parent.contentStyleChange();
},
zhaopianUploadChange(fileUrls) {
this.ruleForm.zhaopian = fileUrls;
this.addEditUploadStyleChange()
},
gerenziliaoUploadChange(fileUrls) {
this.ruleForm.gerenziliao = fileUrls;
this.addEditUploadStyleChange()
},
addEditStyleChange() {
this.$nextTick(()=>{
// input
document.querySelectorAll('.addEdit-block .input .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.inputHeight
el.style.color = this.addEditForm.inputFontColor
el.style.fontSize = this.addEditForm.inputFontSize
el.style.borderWidth = this.addEditForm.inputBorderWidth
el.style.borderStyle = this.addEditForm.inputBorderStyle
el.style.borderColor = this.addEditForm.inputBorderColor
el.style.borderRadius = this.addEditForm.inputBorderRadius
el.style.backgroundColor = this.addEditForm.inputBgColor
})
document.querySelectorAll('.addEdit-block .input .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.inputHeight
el.style.color = this.addEditForm.inputLableColor
el.style.fontSize = this.addEditForm.inputLableFontSize
})
// select
document.querySelectorAll('.addEdit-block .select .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.selectHeight
el.style.color = this.addEditForm.selectFontColor
el.style.fontSize = this.addEditForm.selectFontSize
el.style.borderWidth = this.addEditForm.selectBorderWidth
el.style.borderStyle = this.addEditForm.selectBorderStyle
el.style.borderColor = this.addEditForm.selectBorderColor
el.style.borderRadius = this.addEditForm.selectBorderRadius
el.style.backgroundColor = this.addEditForm.selectBgColor
})
document.querySelectorAll('.addEdit-block .select .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.selectHeight
el.style.color = this.addEditForm.selectLableColor
el.style.fontSize = this.addEditForm.selectLableFontSize
})
document.querySelectorAll('.addEdit-block .select .el-select__caret').forEach(el=>{
el.style.color = this.addEditForm.selectIconFontColor
el.style.fontSize = this.addEditForm.selectIconFontSize
})
// date
document.querySelectorAll('.addEdit-block .date .el-input__inner').forEach(el=>{
el.style.height = this.addEditForm.dateHeight
el.style.color = this.addEditForm.dateFontColor
el.style.fontSize = this.addEditForm.dateFontSize
el.style.borderWidth = this.addEditForm.dateBorderWidth
el.style.borderStyle = this.addEditForm.dateBorderStyle
el.style.borderColor = this.addEditForm.dateBorderColor
el.style.borderRadius = this.addEditForm.dateBorderRadius
el.style.backgroundColor = this.addEditForm.dateBgColor
})
document.querySelectorAll('.addEdit-block .date .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.dateHeight
el.style.color = this.addEditForm.dateLableColor
el.style.fontSize = this.addEditForm.dateLableFontSize
})
document.querySelectorAll('.addEdit-block .date .el-input__icon').forEach(el=>{
el.style.color = this.addEditForm.dateIconFontColor
el.style.fontSize = this.addEditForm.dateIconFontSize
el.style.lineHeight = this.addEditForm.dateHeight
})
// upload
let iconLineHeight = parseInt(this.addEditForm.uploadHeight) - parseInt(this.addEditForm.uploadBorderWidth) * 2 + 'px'
document.querySelectorAll('.addEdit-block .upload .el-upload--picture-card').forEach(el=>{
el.style.width = this.addEditForm.uploadHeight
el.style.height = this.addEditForm.uploadHeight
el.style.borderWidth = this.addEditForm.uploadBorderWidth
el.style.borderStyle = this.addEditForm.uploadBorderStyle
el.style.borderColor = this.addEditForm.uploadBorderColor
el.style.borderRadius = this.addEditForm.uploadBorderRadius
el.style.backgroundColor = this.addEditForm.uploadBgColor
})
document.querySelectorAll('.addEdit-block .upload .el-form-item__label').forEach(el=>{
el.style.lineHeight = this.addEditForm.uploadHeight
el.style.color = this.addEditForm.uploadLableColor
el.style.fontSize = this.addEditForm.uploadLableFontSize
})
document.querySelectorAll('.addEdit-block .upload .el-icon-plus').forEach(el=>{
el.style.color = this.addEditForm.uploadIconFontColor
el.style.fontSize = this.addEditForm.uploadIconFontSize
el.style.lineHeight = iconLineHeight
el.style.display = 'block'
})
// 多文本输入框
document.querySelectorAll('.addEdit-block .textarea .el-textarea__inner').forEach(el=>{
el.style.height = this.addEditForm.textareaHeight
el.style.color = this.addEditForm.textareaFontColor
el.style.fontSize = this.addEditForm.textareaFontSize
el.style.borderWidth = this.addEditForm.textareaBorderWidth
el.style.borderStyle = this.addEditForm.textareaBorderStyle
el.style.borderColor = this.addEditForm.textareaBorderColor
el.style.borderRadius = this.addEditForm.textareaBorderRadius
el.style.backgroundColor = this.addEditForm.textareaBgColor
})
document.querySelectorAll('.addEdit-block .textarea .el-form-item__label').forEach(el=>{
// el.style.lineHeight = this.addEditForm.textareaHeight
el.style.color = this.addEditForm.textareaLableColor
el.style.fontSize = this.addEditForm.textareaLableFontSize
})
// 保存
document.querySelectorAll('.addEdit-block .btn .btn-success').forEach(el=>{
el.style.width = this.addEditForm.btnSaveWidth
el.style.height = this.addEditForm.btnSaveHeight
el.style.color = this.addEditForm.btnSaveFontColor
el.style.fontSize = this.addEditForm.btnSaveFontSize
el.style.borderWidth = this.addEditForm.btnSaveBorderWidth
el.style.borderStyle = this.addEditForm.btnSaveBorderStyle
el.style.borderColor = this.addEditForm.btnSaveBorderColor
el.style.borderRadius = this.addEditForm.btnSaveBorderRadius
el.style.backgroundColor = this.addEditForm.btnSaveBgColor
})
// 返回
document.querySelectorAll('.addEdit-block .btn .btn-close').forEach(el=>{
el.style.width = this.addEditForm.btnCancelWidth
el.style.height = this.addEditForm.btnCancelHeight
el.style.color = this.addEditForm.btnCancelFontColor
el.style.fontSize = this.addEditForm.btnCancelFontSize
el.style.borderWidth = this.addEditForm.btnCancelBorderWidth
el.style.borderStyle = this.addEditForm.btnCancelBorderStyle
el.style.borderColor = this.addEditForm.btnCancelBorderColor
el.style.borderRadius = this.addEditForm.btnCancelBorderRadius
el.style.backgroundColor = this.addEditForm.btnCancelBgColor
})
})
},
addEditUploadStyleChange() {
this.$nextTick(()=>{
document.querySelectorAll('.addEdit-block .upload .el-upload-list--picture-card .el-upload-list__item').forEach(el=>{
el.style.width = this.addEditForm.uploadHeight
el.style.height = this.addEditForm.uploadHeight
el.style.borderWidth = this.addEditForm.uploadBorderWidth
el.style.borderStyle = this.addEditForm.uploadBorderStyle
el.style.borderColor = this.addEditForm.uploadBorderColor
el.style.borderRadius = this.addEditForm.uploadBorderRadius
el.style.backgroundColor = this.addEditForm.uploadBgColor
})
})
},
}
};
</script>
<style lang="scss">
.editor{
height: 500px;
& /deep/ .ql-container {
height: 310px;
}
}
.amap-wrapper {
width: 100%;
height: 500px;
}
.search-box {
position: absolute;
}
.addEdit-block {
margin: -10px;
}
.detail-form-content {
padding: 12px;
}
.btn .el-button {
padding: 0;
}
</style>
HomeProgress.vue
<template>
<div class="home-progress">
<div class="title">月访问量</div>
<div class="tip">同上期增长</div>
<el-progress
class="progress"
:text-inside="true"
:stroke-width="24"
:percentage="20"
status="success"
></el-progress>
<div class="title">月用户量</div>
<div class="tip">同上期增长</div>
<el-progress
class="progress"
:text-inside="true"
:stroke-width="24"
:percentage="50"
status="success"
></el-progress>
<div class="title">月收入</div>
<div class="tip">同上期减少</div>
<el-progress
class="progress"
:text-inside="true"
:stroke-width="24"
:percentage="28"
status="exception"
></el-progress>
</div>
</template>
<script>
export default {};
</script>
<style lang="scss">
.home-progress {
background: #ffffff;
height: 400px;
padding: 20px;
.title {
color: #666666;
font-weight: bold;
font-size: 20px;
margin-top: 10px;
}
.tip {
color: #888888;
font-size: 16px;
margin-top: 10px;
}
.progress {
margin-top: 10px;
}
}
</style>
扫一扫
2114
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
