talk_appAmin/pages/work/My_activity/My_activity.vue

289 lines
5.3 KiB
Vue
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<template>
<view>
<!-- tabs标签 -->
<view class="tabsinfo flex alignCenter justifyCenter">
<up-tabs :list="list4" lineWidth="24" lineHeight="4" @click="tabsClick" lineColor="#6aa2ff" :activeStyle="{
color: '#000000',
fontSize: '30rpx',
transform: 'scale(1.05)'
}" :inactiveStyle="{
color: '#999999',
fontSize: '28rpx',
transform: 'scale(1.05)'
}" itemStyle=" width: 185rpx; padding-bottom:18rpx;">
</up-tabs>
</view>
<!-- 审核的信息 -->
<view class="shenghe_item" @click="gotoworkinfo">
<!-- -->
<view class="fabu_time">
<h4>发布时间2024.06.01 12:00</h4>
</view>
<view class="xian">
</view>
<!-- 审核的文章标题 -->
<view class="shenghe_title">
<h4>怎么评论爱德华·艾尔加这位音乐家及其他的作品,欢迎大家发表自己的看法</h4>
</view>
<!-- 开始时间 -->
<view class="start_time">
<image src="../../../static/images/icon/starttime.png" mode=""></image>
<p>开始时间: 2024.06.01 12:00:00</p>
</view>
<!-- 结束时间 -->
<view class="end_time">
<image src="../../../static/images/icon/starttime.png" mode=""></image>
<p>结束时间: 2024.06.01 12:00:00</p>
</view>
<!-- 活动地点 -->
<view class="active_address">
<image src="../../../static/images/icon/local.png" mode=""></image>
<p>活动地点天津电子信息职业技术学院操场东面</p>
</view>
<!-- 活动状态 -->
<view class="activity_style">
<!-- v-show控制活动状态的样式 -->
<view class="" v-show="sctivity_sty==0">
</view>
<view class="" v-show="sctivity_sty==1">
</view>
<view class="" v-show="sctivity_sty==2">
</view>
</view>
</view>
</view>
</template>
<script setup>
import {
ref
} from 'vue'
const list4 = ref([{
name: '全部审核',
state: 9
},
{
name: '待审核',
state: 1
},
{
name: '已通过',
state: 2
},
{
name: '未通过',
state: 0
}
]);
//用于反馈活动状态
var sctivity_sty = ref(0)
function gotoworkinfo(){
uni.navigateTo({
url:'/pages/work/My_activity/My_activity_info'
})
}
</script>
<style scoped>
.tabsinfo {
background-color: #fff;
height: 80rpx;
margin-bottom: 24rpx;
}
.shenghe_item {
width: 686rpx;
background: #ffffff;
padding:0rpx 23rpx 24rpx 23rpx;
border-radius: 16rpx 16rpx 16rpx 16rpx;
margin: 0 auto;
}
.user_header {
width: 100%;
display: flex;
justify-content: space-between;
height: 84rpx;
.user_img {
width: 84rpx;
height: 84rpx;
margin-right: 19rpx;
image {
width: 84rpx;
height: 84rpx;
border-radius: 50%;
}
}
.user_msg {
h4 {
font-weight: 600;
width: 186rpx;
height: 31rpx;
font-size: 30rpx;
text-align: left;
color: #000000 100%;
margin-bottom: 18rpx;
}
p {
height: 30rpx;
font-size: 30rpx;
color: #999999;
}
}
.text_style {
right: 0;
font-weight: 400;
width: 84rpx;
height: 28rpx;
font-size: 28rpx;
text-align: left;
color: #6AA2FF;
}
}
.user_header>view {
display: flex;
}
.fabu_time{
height: 78rpx;
line-height: 78rpx;
}
.xian{
width: 638rpx;
height: 2rpx;
border-radius: 1rpx 1rpx 1rpx 1rpx;
background: #f4f5f6;
}
.shenghe_title {
h4 {
font-weight: 400;
width: 100%;
height: 80rpx;
font-size: 32rpx;
color: #000000;
margin-top: 24rpx;
}
}
.shenghe_text {
width: 100%;
word-break: break-all;
overflow: hidden;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
margin-top: 26rpx;
}
.imgs_box {
width: 100%;
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
padding-top: 34rpx;
image {
width: 222rpx;
height: 222rpx;
border-radius: 20rpx 20rpx 20rpx 20rpx;
margin-bottom: 6rpx;
margin-right: 6rpx;
}
}
.text_span {
margin-top: 28rpx;
view {
padding: 8rpx;
background-color: #F7F8FA;
display: inline-block;
border-radius: 10rpx 10rpx 10rpx 10rpx;
font-size: 24rpx;
color: #3477FC;
font-weight: 600;
margin-bottom: 20rpx;
margin-right: 24rpx;
}
}
.start_time{
display: flex;
align-items: center;
height: 26rpx;
margin-top: 34rpx;
}
.start_time image,.end_time image{
width: 26rpx;
height: 26rpx;
margin-right: 17rpx;
}
.start_time p,.end_time p{
font-size: 24rpx;
line-height: 26rpx;
}
.end_time{
display: flex;
align-items: center;
height: 26rpx;
margin-top: 12rpx;
}
.active_address{
display: flex;
align-items: center;
height: 26rpx;
margin-top: 23rpx;
}
.active_address image{
width: 26rpx;
height: 26rpx;
margin-right: 17rpx;
}
.active_address p{
font-size: 24rpx;
line-height: 26rpx;
}
.activity_style{
display: flex;
justify-content: flex-end;
margin-top: 32rpx;
view{
width: 84rpx;
height: 28rpx;
border-radius: 14rpx 14rpx 14rpx 14rpx;
display: flex;
align-items: center;
justify-content: center;
padding: 13rpx 4rpx;
font-size: 20rpx;
}
}
.activity_style view:nth-child(1){
background: #c0f0ec;
color: #00CCBE;
}
.activity_style view:nth-child(2){
background: #FDE2E2;
color: #FFABAB;
}
.activity_style view:nth-child(3){
background: #F1F1F1;
color: #7E7E7E;
}
</style>