Browse Source

修改bug

dev
岳鹏龙 1 year ago
parent
commit
3b81067886
  1. 2
      src/pages/myElection/index.vue
  2. 648
      src/pages/votingElection/index.vue

2
src/pages/myElection/index.vue

@ -182,7 +182,7 @@
.election-item {
margin-bottom: 30rpx;
padding: 40rpx;
padding: 34rpx;
border-radius: 24rpx;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.001), rgba(0, 0, 0, 0.001)), #FFFFFF;
box-sizing: border-box;

648
src/pages/votingElection/index.vue

@ -1,353 +1,359 @@
<script setup lang="ts">
const doSearch = (_formData: { page: number; limit: number }, onSuccess: Function) => {
// const submitData = { ...formData }
// listApi(submitData, userStore.useType).then((res) => {
// const { data } = res as { data: { data: any; total: number } }
// onSuccess({ data })
// })
onSuccess({
data: {
data: [
{
id: 1,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
},
{
id: 2,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
},
{
id: 3,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
},
{
id: 4,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
},
{
id: 5,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
}
],
total: 0
}
})
}
const doSearch = (_formData : { page : number; limit : number }, onSuccess : Function) => {
// const submitData = { ...formData }
// listApi(submitData, userStore.useType).then((res) => {
// const { data } = res as { data: { data: any; total: number } }
// onSuccess({ data })
// })
onSuccess({
data: {
data: [
{
id: 1,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
},
{
id: 2,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
},
{
id: 3,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
},
{
id: 4,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
},
{
id: 5,
img: '/static/img/grxx.png',
name: '陈志远',
class: '现任财务总监',
yijian: ''
}
],
total: 0
}
})
}
const selectIndex = ref(0)
const buttlist = ref([
{
type: 'agree',
butname: '同意'
},
{
type: 'disagree',
butname: '反对'
},
{
type: 'neutral',
butname: '弃权'
}
])
const selectIndex = ref(0)
const buttlist = ref([
{
type: 'agree',
butname: '同意'
},
{
type: 'disagree',
butname: '反对'
},
{
type: 'neutral',
butname: '弃权'
}
])
const selectBut = (data: any, cardid: any,type: string) => {
const target = data.find((card: { id: any; }) => card.id === cardid);
if (target) {
target.yijian = target.yijian === type ? null : type;
}
}
const selectBut = (data : any, cardid : any, type : string, butname: string) => {
const target = data.find((card : { id : any; }) => card.id === cardid);
uni.showModal({
title: '您本轮选举投' + butname + '票',
content: '确定吗?',
success: function (res) {
if (res.confirm) {
if (target) {
target.yijian = target.yijian === type ? null : type;
}
} else if (res.cancel) {
console.log('用户点击取消');
}
}
});
}
</script>
<template>
<!-- 你的页面内容 -->
<view class="box">
<view class="headpart">
<view class="title">2024年度董事会成员选举</view>
<view class="time">投票开始时间2024年3月15日 18:00</view>
<view class="time">投票截止时间2024年3月15日 18:00</view>
</view>
<ex-list ref="reListRef" custom-list-type="custom" :on-form-search="doSearch">
<template v-slot="{ data }">
<view class="tppart">
<view class="tpone" v-for="(row, index) of data" :key="'tpone' + index">
<view class="topp">
<img style="width: 96rpx; height: 96rpx; border-radius: 50%" :src="row.img" alt="" />
<view class="rightpart">
<view class="name">
{{ row.name }}
</view>
<view class="class">
{{ row.class }}
</view>
</view>
</view>
<view class="bottomp">
<view
class="minbut"
v-for="(item, ele) in buttlist"
:key="ele"
@click="selectBut(data,row.id,item.type)"
:class="{ active: row.yijian === item.type }"
>
{{ item.butname }}
</view>
</view>
</view>
</view>
</template>
</ex-list>
<view class="bottbutton">
<view class="qbty">全部同意</view>
<view class="tjtp">提交投票</view>
</view>
</view>
<!-- 你的页面内容 -->
<view class="box">
<view class="headpart">
<view class="title">2024年度董事会成员选举</view>
<view class="time">投票开始时间2024年3月15日 18:00</view>
<view class="time">投票截止时间2024年3月15日 18:00</view>
</view>
<ex-list ref="reListRef" custom-list-type="custom" :on-form-search="doSearch">
<template v-slot="{ data }">
<view class="tppart">
<view class="tpone" v-for="(row, index) of data" :key="'tpone' + index">
<view class="topp">
<img style="width: 96rpx; height: 96rpx; border-radius: 50%" :src="row.img" alt="" />
<view class="rightpart">
<view class="name">
{{ row.name }}
</view>
<view class="class">
{{ row.class }}
</view>
</view>
</view>
<view class="bottomp">
<view class="minbut" v-for="(item, ele) in buttlist" :key="ele"
@click="selectBut(data,row.id,item.type,item.butname)" :class="{ active: row.yijian === item.type }">
{{ item.butname }}
</view>
</view>
</view>
</view>
</template>
</ex-list>
<view class="bottbutton">
<view class="qbty">全部同意</view>
<view class="tjtp">提交投票</view>
</view>
</view>
</template>
<style scoped lang="scss">
.box {
width: 100%;
background-color: #f9fafb;
.box {
width: 100%;
background-color: #f9fafb;
.headpart {
width: 92%;
height: 194rpx;
border-radius: 24rpx;
background-color: #eff6ff;
margin: 32rpx auto;
padding: 20rpx 3%;
.headpart {
width: 92%;
height: 194rpx;
border-radius: 24rpx;
background-color: #eff6ff;
margin: 32rpx auto;
padding: 20rpx 3%;
.title {
color: #2563eb;
font-size: 28rpx;
margin-top: 16rpx;
}
.title {
color: #2563eb;
font-size: 28rpx;
margin-top: 16rpx;
}
.time {
margin-top: 16rpx;
color: #4b5563;
font-size: 28rpx;
}
}
.time {
margin-top: 16rpx;
color: #4b5563;
font-size: 28rpx;
}
}
.tppart {
width: 100%;
max-height: 69vh;
overflow-y: auto;
display: grid;
justify-items: center;
.tppart {
width: 100%;
max-height: 69vh;
overflow-y: auto;
display: grid;
justify-items: center;
.tpone {
width: 91%;
height: 264rpx;
padding: 20rpx 4%;
box-sizing: border-box;
border-radius: 24rpx;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.001), rgba(0, 0, 0, 0.001)), #ffffff;
box-sizing: border-box;
border: 2rpx solid #f3f4f6;
box-shadow:
0rpx 2rpx 4rpx -2rpx rgba(0, 0, 0, 0.1),
0rpx 2rpx 6rpx 0rpx rgba(0, 0, 0, 0.1);
margin-top: 32rpx;
display: grid;
.tpone {
width: 91%;
height: 264rpx;
padding: 20rpx 4%;
box-sizing: border-box;
border-radius: 24rpx;
background: linear-gradient(0deg, rgba(0, 0, 0, 0.001), rgba(0, 0, 0, 0.001)), #ffffff;
box-sizing: border-box;
border: 2rpx solid #f3f4f6;
box-shadow:
0rpx 2rpx 4rpx -2rpx rgba(0, 0, 0, 0.1),
0rpx 2rpx 6rpx 0rpx rgba(0, 0, 0, 0.1);
margin-top: 32rpx;
display: grid;
.topp {
display: flex;
.topp {
display: flex;
.rightpart {
margin-left: 32rpx;
display: grid;
justify-items: left;
align-content: baseline;
.rightpart {
margin-left: 32rpx;
display: grid;
justify-items: left;
align-content: baseline;
.name {
font-family: Roboto;
font-size: 28rpx;
font-weight: 500;
line-height: 42rpx;
letter-spacing: normal;
color: #000000;
margin-top: 7rpx;
}
.name {
font-family: Roboto;
font-size: 28rpx;
font-weight: 500;
line-height: 42rpx;
letter-spacing: normal;
color: #000000;
margin-top: 7rpx;
}
.class {
font-family: Roboto;
font-size: 28rpx;
font-weight: normal;
line-height: 40rpx;
letter-spacing: normal;
color: #6b7280;
margin-top: 7rpx;
}
}
}
.class {
font-family: Roboto;
font-size: 28rpx;
font-weight: normal;
line-height: 40rpx;
letter-spacing: normal;
color: #6b7280;
margin-top: 7rpx;
}
}
}
.bottomp {
display: flex;
justify-content: space-between;
gap: 0rpx 20rpx;
.bottomp {
display: flex;
justify-content: space-between;
gap: 0rpx 20rpx;
.minbut {
flex: 1;
width: 190rpx;
height: 76rpx;
/* 自动布局 */
display: flex;
justify-content: center;
padding: 16rpx 32rpx;
flex-wrap: wrap;
align-content: flex-start;
border-radius: 8rpx;
background: #ffffff;
box-sizing: border-box;
border: 2rpx solid #d1d5db;
font-family: Roboto;
font-size: 28rpx;
font-weight: normal;
line-height: 40rpx;
text-align: center;
letter-spacing: normal;
color: #4b5563;
}
.minbut {
flex: 1;
width: 190rpx;
height: 76rpx;
/* 自动布局 */
display: flex;
justify-content: center;
padding: 16rpx 32rpx;
flex-wrap: wrap;
align-content: flex-start;
border-radius: 8rpx;
background: #ffffff;
box-sizing: border-box;
border: 2rpx solid #d1d5db;
font-family: Roboto;
font-size: 28rpx;
font-weight: normal;
line-height: 40rpx;
text-align: center;
letter-spacing: normal;
color: #4b5563;
}
.minbut.active {
border: 2rpx solid #2563eb;
color: #2563eb;
}
}
}
.minbut.active {
border: 2rpx solid #2563eb;
color: #2563eb;
}
}
}
.tpone:first-child {
margin-top: 0;
}
}
.tpone:first-child {
margin-top: 0;
}
}
.bottbutton {
width: 100%;
height: 10vh;
display: flex;
padding: 24rpx 32rpx;
gap: 0rpx 24rpx;
flex-wrap: wrap;
align-content: flex-start;
background: #ffffff;
box-sizing: border-box;
border-width: 2rpx 0rpx 0rpx 0rpx;
border-style: solid;
border-color: #f3f4f6;
position: fixed;
bottom: 0;
.bottbutton {
width: 100%;
height: 10vh;
display: flex;
padding: 24rpx 32rpx;
gap: 0rpx 24rpx;
flex-wrap: wrap;
align-content: flex-start;
background: #ffffff;
box-sizing: border-box;
border-width: 2rpx 0rpx 0rpx 0rpx;
border-style: solid;
border-color: #f3f4f6;
position: fixed;
bottom: 0;
.qbty {
width: 331rpx;
height: 90rpx;
/* 自动布局 */
display: flex;
box-sizing: border-box;
justify-content: center;
padding: 24rpx 0rpx;
gap: 0rpx 20rpx;
flex-wrap: wrap;
border-radius: 8rpx;
background: #eff6ff;
font-family: Roboto;
font-size: 28rpx;
font-weight: 500;
line-height: 42rpx;
text-align: center;
letter-spacing: normal;
color: #2563eb;
}
.qbty {
width: 331rpx;
height: 90rpx;
/* 自动布局 */
display: flex;
box-sizing: border-box;
justify-content: center;
padding: 24rpx 0rpx;
gap: 0rpx 20rpx;
flex-wrap: wrap;
border-radius: 8rpx;
background: #eff6ff;
font-family: Roboto;
font-size: 28rpx;
font-weight: 500;
line-height: 42rpx;
text-align: center;
letter-spacing: normal;
color: #2563eb;
}
.tjtp {
width: 331rpx;
height: 90rpx;
/* 自动布局 */
display: flex;
box-sizing: border-box;
justify-content: center;
padding: 24rpx 0rpx;
gap: 0rpx 20rpx;
flex-wrap: wrap;
border-radius: 8rpx;
background: #2563eb;
font-family: Roboto;
font-size: 28rpx;
font-weight: 500;
line-height: 42rpx;
text-align: center;
letter-spacing: normal;
color: #ffffff;
}
}
.tjtp {
width: 331rpx;
height: 90rpx;
/* 自动布局 */
display: flex;
box-sizing: border-box;
justify-content: center;
padding: 24rpx 0rpx;
gap: 0rpx 20rpx;
flex-wrap: wrap;
border-radius: 8rpx;
background: #2563eb;
font-family: Roboto;
font-size: 28rpx;
font-weight: 500;
line-height: 42rpx;
text-align: center;
letter-spacing: normal;
color: #ffffff;
}
}
.address-items {
padding: 20rpx 15rpx 32rpx 28rpx;
background-color: #fff;
border-bottom: 2rpx solid #f5f5f5;
.address-items {
padding: 20rpx 15rpx 32rpx 28rpx;
background-color: #fff;
border-bottom: 2rpx solid #f5f5f5;
.left {
flex: 1;
overflow: hidden;
.left {
flex: 1;
overflow: hidden;
.name {
font-size: 28rpx;
font-weight: 700;
color: #101010;
line-height: 40rpx;
margin-right: 16rpx;
}
.name {
font-size: 28rpx;
font-weight: 700;
color: #101010;
line-height: 40rpx;
margin-right: 16rpx;
}
.isdefault {
font-size: 20rpx;
font-weight: 400;
color: #fff;
padding: 4rpx 12rpx;
border-radius: 8rpx;
background: linear-gradient(90deg, #4778ff 0%, #4778ffb8 100%);
}
.isdefault {
font-size: 20rpx;
font-weight: 400;
color: #fff;
padding: 4rpx 12rpx;
border-radius: 8rpx;
background: linear-gradient(90deg, #4778ff 0%, #4778ffb8 100%);
}
.info {
width: 100%;
color: #666;
font-size: 24rpx;
font-weight: 400;
margin-top: 12rpx;
}
}
.info {
width: 100%;
color: #666;
font-size: 24rpx;
font-weight: 400;
margin-top: 12rpx;
}
}
.right {
width: 140rpx;
padding-left: 32rpx;
font-size: 24rpx;
font-weight: 400;
color: #4979ff;
text-align: right;
}
}
.right {
width: 140rpx;
padding-left: 32rpx;
font-size: 24rpx;
font-weight: 400;
color: #4979ff;
text-align: right;
}
}
.buts {
width: 100%;
height: 10vh;
background-color: F3F4F6;
position: fixed;
bottom: 0;
border-top: 2rpx solid #ebebec;
}
}
</style>
.buts {
width: 100%;
height: 10vh;
background-color: F3F4F6;
position: fixed;
bottom: 0;
border-top: 2rpx solid #ebebec;
}
}
</style>
Loading…
Cancel
Save