<style lang="scss" scoped>
	@import url("@/asset/css/flex.css");
    .opiSurListBox{
        background: #f5f5f5;
        height: 100vh;
        overflow: hidden;
    }
    .opiSurHeader{
        background: linear-gradient(-30deg, #4779FF, #47A5FF);
    }
    .opiSurTitle view{
        padding: 5rpx 20rpx;
        border: 1px solid #fff;
        background: #fff;
        border-radius: 50rpx;
    }
    .opiSurTitle view.active{
        border: 1px solid #4779FF;
        background: #BED6FF;
        color: #4779FF;
    }
    .opiSurListCenter{
        background: #fff;
        border-radius: 10rpx;
        overflow: hidden;
        box-shadow: 0rpx 3rpx 32rpx 0rpx rgba(71,71,71,0.16);
    }
    
</style>
<template>
    <view class="opiSurListBox column">
        <view class="opiSurHeader">
            <headers :title="pageTitle" color="#fff"></headers>
        </view>
        <view class="opiSurTitle row justify-between PX30 PY20 fz24">
            <view v-for="item in titles"
            :class="[msg.type==item.id?'active':'']">
                {{ item.name }}({{ item.num }})
            </view>
        </view>
        <scroll-view class="flex1 bgFFF" scroll-y="true"
        :enable-back-to-top="true" :enable-flex="true"
        style="overflow: hidden;">
            <view class="PX30">
                <view v-for="item in 20"
                 class="opiSurListCenter fz28 PX20 PY20 MT20 MB30 row justify-between">
                    <view>名字</view>
                    <view>未评分</view>
                </view>
            </view>
            
            <view style="height: 50rpx;"></view>
        </scroll-view>
    </view>
    
</template>
<script>
import headers from "@/components/header/header";
export default {
    components: {
        headers,
    },
    data() {
        return {
            pageTitle: '意见调查',
            showVisible: false,
            titles:[
                {name:'全部',id:1,num:37},
                {name:'已评分',id:2,num:12},
                {name:'未评分',id:3,num:25},
            ],
            msg:{
                type: 1
            }
        }
    },
    onLoad(option){

    },
    created() {

    },
    mounted() {

    },
    methods: {
        showPassengerInfo(){
            this.showVisible = true
        }
    },
}
</script>