Skip to content

E
enterprise-serevice-platform-web
Commit fca4814a authored by 杨硕's avatar 杨硕
Browse files
Options

活动详情ui优化

parent 746a1ea5
Show whitespace changes
Inline Side-by-side
Showing with 116 additions and 56 deletions
src/views/activityInformation/details.vue
View file @ fca4814a
......@@ -21,8 +21,8 @@
type="primary"
:disabled="registrationButton"
@click="handleAdd"
>我要报名</el-button>
<el-image v-if="image" style="width: 100px;height: 80px" :src="registration" />
><span class="top-button-title">我要报名</span></el-button>
<el-image v-if="image" style="width: 62px;height: 62px" :src="registration" />
</div>
<el-form ref="form" :model="form" label-width="auto" class="form">
<el-row>
......@@ -67,7 +67,7 @@
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="form.registrationWay === '1' ? '报名人数:' : '限制人数:'">
<el-form-item :label="form.registrationWay === '1' ? '报名人数：' : '限制人数：'">
<span class="formdate-text">{{ registrationNumber }}</span>
</el-form-item>
</el-col>
......@@ -97,7 +97,7 @@
<el-dialog :close-on-click-modal="false" class="signupDialog" title="我要报名" :visible.sync="open" width="40%" append-to-body>
<el-form ref="addForm" :rules="rules" :model="addForm" label-width="auto">
<el-form-item label="参与企业" prop="signUpDept">
<el-select v-model="addForm.signUpDept" style="width: 100%" placeholder="请输入参与企业">
<el-select size="medium" v-model="addForm.signUpDept" class="input" placeholder="请输入参与企业">
<el-option
v-for="item in enterprises"
:key="item.id"
......@@ -107,18 +107,18 @@
</el-select>
</el-form-item>
<el-form-item label="联系人" prop="contact">
<el-input v-model.trim="addForm.contact" maxlength="30" placeholder="请输入联系人" />
<el-input size="medium" class="input" v-model.trim="addForm.contact" maxlength="30" placeholder="请输入联系人" />
</el-form-item>
<el-form-item label="联系电话" prop="phone">
<el-input v-model.trim="addForm.phone" maxlength="16" placeholder="请输入联系电话" />
<el-input size="medium" class="input" v-model.trim="addForm.phone" maxlength="16" placeholder="请输入联系电话" />
</el-form-item>
<el-form-item label="参与人数" prop="peopleNumber">
<el-input v-model.trim="addForm.peopleNumber" maxlength="10" oninput="value=value.replace(/\D/g,'')" placeholder="请输入参与人数" />
<el-input size="medium" class="input" v-model.trim="addForm.peopleNumber" maxlength="10" oninput="value=value.replace(/\D/g,'')" placeholder="请输入参与人数" />
</el-form-item>
</el-form>
<div class="footer">
<el-button @click="open=false">关闭</el-button>
<el-button type="primary" @click="add">确定</el-button>
<el-button class="cancelBtn" @click="open=false">关闭</el-button>
<el-button class="confirmBtn" type="primary" @click="add">确定</el-button>
</div>
</el-dialog>
</div>
......@@ -148,7 +148,7 @@ export default {
// 我要报名按钮
registrationButton: false,
// 已报名图片
registration: require('@/assets/image/registrationStatus.png'),
registration: require('@/assets/image/yibaoming.png'),
// 活动总限制人数
peopleTotal: 0,
// 活动目前人数
......@@ -505,6 +505,8 @@ export default {
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
color: #707070;
-webkit-background-clip: text;
max-width: 1203px;
text-overflow:ellipsis;
}
.item.el-form-item__label{
color: #333333;
......@@ -523,7 +525,7 @@ export default {
}
}
.form{
margin-top: 40px;
margin-top: 15px;
}
.details-body{
margin-top: 12px;
......@@ -553,6 +555,7 @@ export default {
}
}
.signupDialog{
padding: 0px 67px;
.footer{
padding: 20px 10px 0 0;
float: right;
......@@ -565,4 +568,23 @@ export default {
color: #333333;
-webkit-background-clip: text;
}
.top-button-title{
font-size: 15px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #FFFFFF;
-webkit-background-clip: text;
}
::v-deep.el-row{
margin-bottom: 4px;
}
.input{
width: 362px;
height: 36px;
line-height: 32px;
background: #FFFFFF;
border-radius: 6px 6px 6px 6px;
opacity: 1;
border: 1px solid #E4E4E4;
}
</style>
src/views/personalCenter/components/messageCenter.vue
View file @ fca4814a
......@@ -161,7 +161,6 @@ export default {
<style scoped lang="scss">
.messageCenter-module{
width: 1126px;
//margin: auto;
.info-top{
display: flex;
......@@ -189,7 +188,7 @@ export default {
font-size: 15px;
color: #333333;
font-weight: bold;
padding: 0 30px;
margin-left: 60px;
cursor: pointer;
display: block;
float: left;
......@@ -230,7 +229,7 @@ export default {
border-color: #F18F18
}
.table{
width: 100%;
width: 1066px;
margin-bottom: 28px;
}
}
......
src/views/personalCenter/components/myDeclaration.vue
View file @ fca4814a
......@@ -88,7 +88,6 @@ export default {
</script>
<style scoped lang="scss">
.myDeclaration-module{
width: 1126px;
//margin: auto;
.el-divider--horizontal{
background-color: black!important;
......@@ -109,6 +108,7 @@ export default {
}
.body{
padding-top: 30px;
padding-right:30px;
::v-deep.el-table th{
background-color: white!important;
}
......
src/views/personalCenter/index.vue
View file @ fca4814a
<template>
<div class="personalCenter-module">
<div class="topHeader">
<HomeSearch/>
<nav-list :list="navList" :current-menu="'/personalCenter/index'"/>
<HomeSearch />
<nav-list :list="navList" :current-menu="'/personalCenter/index'" />
</div>
<div class="personalCenter-content">
<div class="body">
<el-row :gutter="20">
<el-col :span="1">
<i class="el-icon-arrow-left" style="color: #1A78E5;font-weight: bold;padding-top: 40px"
@click="handleGoBack"/>
<i
class="el-icon-arrow-left"
style="color: #1A78E5;font-weight: bold;padding-top: 40px"
@click="handleGoBack"
/>
<!-- <el-button type="primary" icon="el-icon-arrow-left" circle @click="handleGoBack" />-->
</el-col>
<el-col :span="5">
......@@ -40,25 +43,25 @@
<el-col :span="18">
<div class="right-region">
<div v-if="choseMenu === '个人信息'">
<personal-info/>
<personal-info />
</div>
<div v-if="choseMenu === '关联企业'">
<AffiliatedEnterprises/>
<AffiliatedEnterprises />
</div>
<div v-if="choseMenu === '我的收藏'">
<my-collection/>
<my-collection />
</div>
<div v-if="choseMenu === '我的申报'">
<my-declaration/>
<my-declaration />
</div>
<div v-if="choseMenu === '我的活动'">
<my-activities/>
<my-activities />
</div>
<div v-if="choseMenu === '修改密码'">
<change-password @changeRouter="changeRouter"/>
<change-password @changeRouter="changeRouter" />
</div>
<div v-if="choseMenu === '消息中心'">
<message-center/>
<message-center />
</div>
</div>
</el-col>
......@@ -78,8 +81,8 @@ import myDeclaration from './components/myDeclaration'
import personalInfo from './components/personalInfo'
import HomeSearch from '@/views/homePage/components/searchHome/index'
import NavList from '@/views/homePage/components/NavList/index'
import {myMessage} from '@/views/personalCenter/apis'
import {idGetImg} from '@/views/OneClickService/apis'
import { myMessage } from '@/views/personalCenter/apis'
import { idGetImg } from '@/views/OneClickService/apis'
import Cookies from 'js-cookie'
import headImg from '../../assets/image/touxiang.png'
......@@ -101,13 +104,13 @@ export default {
loading: true, // 头像遮罩
choseMenu: '个人信息', // 选择的模块
options: [
{name: '个人信息'},
{name: '关联企业'},
{name: '我的收藏'},
{name: '我的申报'},
{name: '我的活动'},
{name: '修改密码'},
{name: '消息中心'}
{ name: '个人信息' },
{ name: '关联企业' },
{ name: '我的收藏' },
{ name: '我的申报' },
{ name: '我的活动' },
{ name: '修改密码' },
{ name: '消息中心' }
],
form: {
// img: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
......@@ -115,25 +118,25 @@ export default {
nickName: ''
},
personalCenterList: [
{img: require('@/assets/image/gongju-pic1.jpg'), name: '石家庄政务服务'},
{img: require('@/assets/image/gongju-pic2.jpg'), name: '石家庄政务服务'},
{img: require('@/assets/image/gongju-pic3.jpg'), name: '石家庄政务服务'},
{img: require('@/assets/image/gongju-pic4.jpg'), name: '石家庄政务服务'},
{img: require('@/assets/image/gongju-pic5.jpg'), name: '石家庄政务服务'},
{img: require('@/assets/image/gongju-pic6.jpg'), name: '石家庄政务服务'}
{ img: require('@/assets/image/gongju-pic1.jpg'), name: '石家庄政务服务' },
{ img: require('@/assets/image/gongju-pic2.jpg'), name: '石家庄政务服务' },
{ img: require('@/assets/image/gongju-pic3.jpg'), name: '石家庄政务服务' },
{ img: require('@/assets/image/gongju-pic4.jpg'), name: '石家庄政务服务' },
{ img: require('@/assets/image/gongju-pic5.jpg'), name: '石家庄政务服务' },
{ img: require('@/assets/image/gongju-pic6.jpg'), name: '石家庄政务服务' }
]
}
},
computed: {
navList() {
const navArray = [
{menuName: '首页', path: '/', query: {}},
{menuName: '政策直达', path: '/PolicyDirect/index', query: {}},
{menuName: '服务共享', path: '/ServiceShare/index'},
{menuName: '企业诉求', path: '/EnterpriseAppeal/index', query: {}},
{menuName: '一键办事', path: '/OneClickService/index', query: {}},
{menuName: '活动信息', path: '/activityInformation/index', query: {}},
{menuName: '个人中心', path: '/personalCenter/index', query: {}}
{ menuName: '首页', path: '/', query: {}},
{ menuName: '政策直达', path: '/PolicyDirect/index', query: {}},
{ menuName: '服务共享', path: '/ServiceShare/index' },
{ menuName: '企业诉求', path: '/EnterpriseAppeal/index', query: {}},
{ menuName: '一键办事', path: '/OneClickService/index', query: {}},
{ menuName: '活动信息', path: '/activityInformation/index', query: {}},
{ menuName: '个人中心', path: '/personalCenter/index', query: {}}
]
return navArray
}
......
src/views/personalCenter/messageDetails.vue
View file @ fca4814a
......@@ -7,17 +7,19 @@
<el-row>
<el-col :span="1">
<!--<el-button class="back-button" type="primary" icon="el-icon-arrow-left" circle @click="handleGoBack" />-->
<i class="el-icon-arrow-left" style="color: #1A78E5;font-weight: bold;padding-top: 40px" @click="handleGoBack" />
<i class="el-icon-arrow-left" @click="handleGoBack" />
</el-col>
<el-col :span="23">
<div style="background-color: #ffffff;padding: 50px 30px 20px 30px;min-height: 500px">
<div style="background-color: #ffffff;padding: 29px 30px 20px 30px;min-height: 500px">
<div class="info-top">
<div class="title">消息详情</div>
<el-button type="text" class="updataBtn" @click="handleDel">删除</el-button>
<el-button type="text" class="updataBtn" @click="handleDel">
<i class="el-icon-delete-solid" />
删除</el-button>
</div>
<!-- <el-divider />-->
<div class="body">
<div class="title">{{ form.title }}</div>
<div class="form-title">{{ form.title }}</div>
<div class="value">{{ form.content }}</div>
<div class="time">{{ form.createTime }}</div>
</div>
......@@ -106,7 +108,8 @@ export default {
width: 100%;
}
.messageDetails-content{
padding: 310px 120px 40px;
width: 1400px;
padding: 312px 120px 34px;
//margin-top: 30px;
.back-button {
margin-top: 30px;
......@@ -120,13 +123,18 @@ export default {
.title{
font-weight: bold;
font-size: 17px;
color: #333333;
}
.updataBtn{
font-size: 15px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #1A78E5;
-webkit-background-clip: text;
}
}
.body{
padding-top: 40px;
padding-top: 34px;
.title{
text-align: center;
font-weight: bold;
......@@ -134,13 +142,41 @@ export default {
padding-bottom: 35px;
}
.value{
text-indent: 2em;
font-size: 15px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
line-height: 25px;
-webkit-background-clip: text;
}
.time{
padding-top: 30px;
float: right;
font-size: 15px;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
line-height: 24px;
-webkit-background-clip: text;
}
.form-title{
text-align: center;
font-size: 19px;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333333;
-webkit-background-clip: text;
line-height: 24px;
padding-bottom: 36px;
}
}
}
.el-icon-arrow-left{
color: #1A78E5;
font-weight: bold;
padding-top: 41px;
float: right;
margin-right: 20px;
}
}
</style>
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