<template>
    <view class="postion-card1" @tap="jump(data.id)">
        <view class="flex-between">
            <view class="postion-name">{{ data.name }}</view>
            <view v-if="data.minSalary > 0" class="salary"
                >{{ data.minSalary<1000?data.minSalary:data.minSalary / 1000 +'k'}}-{{ data.maxSalary<1000?data.maxSalary:data.maxSalary / 1000 +'k' }}<text>/{{ company }}</text></view
            >
            <view v-else class="salary2">面议</view>
        </view>
        <view class="benefits">
            <text v-for="(v, i) in data.benefits?.split(',')" :key="i">{{ v }}</text>
        </view>
        <view class="flex-between">
            <text class="company-name">{{ data.companyName }}</text>
            <text class="address" v-show="data.cityName && data.street">{{ data.cityName + "-" + data.street }}</text>
        </view>
    </view>
</template>

<script setup>
import { defineProps } from "vue";
import { getEnumText } from "@/utils/utils.js";
const props = defineProps({
    data: {
        type: Object,
        default: () => ({})
    },
    jump: {
        type: Boolean,
        default: true
    }
});
const company = ref('');
onShow(async() => {
    console.log(props.data);
    company.value = await getEnumText("EnumSettlementType", props.data.settlementType);
});
const jump = id => {
    if (props.jump) {
        uni.navigateTo({
            url: `/pages/postionList/positionDetails/index?id=${id}`
        });
    }
};
</script>

<style lang="scss" scoped>
.postion-card1 {
    .flex-between {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }
    .postion-name {
        font-size: 16px;
        font-weight: 600;
        line-height: 18px;
        color: #1b2026;
    }
    .salary {
        font-size: 18px;
        font-weight: 500;
        line-height: 12px;
        color: #1f86ff;
        text-align: center;
        letter-spacing: 0;
        text {
            font-size: 14px;
        }
    }
    .salary2 {
        font-size: 16px;
        font-weight: 500;
        line-height: 12px;
        color: #1f86ff;
        text-align: center;
        letter-spacing: 0;
        text {
            font-size: 14px;
        }
    }
    .benefits {
        display: flex;
        gap: 4px;
        align-items: center;
        margin: 12px 0;
        text {
            padding: 2px 4px;
            font-size: 10px;
            line-height: 14px;
            color: #4e5969;
            background: #f2f3f5;
        }
    }
    .company-name {
        font-size: 12px;
        font-weight: normal;
        line-height: 18px;
        color: #1b2026;
        letter-spacing: 0;
    }
    .address {
        font-size: 12px;
        font-weight: normal;
        line-height: 12px;
        color: #1b2026;
        text-align: center;
        letter-spacing: 0;
    }
}
</style>
