<template>
  <div>
    <h3>隐私设置</h3>
    <v-divider class="mb-4"></v-divider>
    <v-radio-group v-model="radios">
      <v-radio v-for="k in items" :key="k.value" :label="k.label" :value="k.value" color="primary">
        <template v-slot:label>
          <div class="radio-text">{{ k.label }} <span class="radio-desc">{{ k.decs }}</span></div>
        </template>
      </v-radio>
    </v-radio-group>
    <v-divider class="mb-4"></v-divider>
  </div>
</template>

<script setup name="privacySettings">
import { ref } from 'vue'
const radios = ref(0)
const items = [
  { label: '简历公开', decs: '正在找工作，企业可以看到我的简历', value: 0 },
  { label: '仅投递公司可见', decs: '可投递简历，仅投递可见', value: 1 },
  { label: '简历保密', decs: '没找工作，企业不能搜索到您的简历', value: 2 }
]
</script>

<style lang="scss" scoped>
h3 {
  font-size: 20px;
  text-align: left;
  font-weight: 600;
  padding-bottom: 25px;
}
.radio-text {
  font-weight: 700;
  color: #000;
}
.radio-desc {
  color: var(--default-text);
  margin-left: 30px;
}
</style>