zhengyiming
2025-02-14 05357b9c587f64cd548e987643066b253cd9bfe0
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
<template>
  <ContentScrollView>
    <Cell :show-title="false">
      <CellChunk title="求职意向">
        <div class="curriculum-list">
          <CurriculumViewItem label="期望岗位:">
            <div class="curriculum-position-list">
              <div class="curriculum-position-list-item">客房服务员</div>
              <div class="curriculum-position-list-item">客房服务员</div>
              <div class="curriculum-position-list-item">客房服务员</div>
              <div class="curriculum-position-list-item">客房服务员</div>
              <div class="curriculum-position-list-item">客房员</div>
              <div class="curriculum-position-list-item">客房服务员</div>
              <div class="curriculum-position-list-item">客房服务员</div>
              <div class="curriculum-position-list-item">客房服务员</div>
            </div>
          </CurriculumViewItem>
          <CurriculumViewItem label="空闲时间:" text="不限"> </CurriculumViewItem>
          <CurriculumViewItem label="求职状态:" text="积极找工作"> </CurriculumViewItem>
        </div>
      </CellChunk>
      <CellChunk title="资格证书">
        <nut-grid
          square
          :column-num="3"
          :border="false"
          :gutter="20"
          v-if="list.length > 0"
          class="pro-img-grid"
        >
          <nut-grid-item v-for="(item, index) in list" :key="item" class="pro-img-grid-item">
            <div class="pro-img-grid-img-item">
              <PreviewImage :src="item" class="pro-img-grid-img" :urls="list" />
            </div>
          </nut-grid-item>
        </nut-grid>
      </CellChunk>
      <CellChunk title="工作经验">
        <CurriculumViewItem label="工作年限:" text="无工作经验,用户自己填写">
        </CurriculumViewItem>
        <CurriculumViewItem label="工作经验:" text="客房服务员,用户自己填写">
        </CurriculumViewItem>
      </CellChunk>
      <CellChunk title="详细信息">
        <CurriculumViewItem
          label="身高:"
          text="175 cm"
          :label-width="labelWidth"
        ></CurriculumViewItem>
        <CurriculumViewItem
          label="体重:"
          text="80 kg"
          :label-width="labelWidth"
        ></CurriculumViewItem>
        <CurriculumViewItem label="个人照片:">
          <nut-grid
            square
            :column-num="2"
            :border="false"
            :gutter="20"
            v-if="list.length > 0"
            class="pro-img-grid"
          >
            <nut-grid-item v-for="(item, index) in list" :key="item" class="pro-img-grid-item">
              <div class="pro-img-grid-img-item">
                <PreviewImage :src="item" class="pro-img-grid-img" :urls="list" />
              </div>
            </nut-grid-item>
          </nut-grid>
        </CurriculumViewItem>
      </CellChunk>
    </Cell>
  </ContentScrollView>
</template>
 
<script setup lang="ts">
import CurriculumViewItem from './CurriculumViewItem.vue';
import { PreviewImage } from '@12333/components';
import Taro from '@tarojs/taro';
 
defineOptions({
  name: 'curriculumView',
});
 
const labelWidth = Taro.pxTransform(120);
 
const list = ref([
  'https://storage.360buyimg.com/jdc-article/NutUItaro34.jpg',
  'https://storage.360buyimg.com/jdc-article/NutUItaro2.jpg',
  'https://storage.360buyimg.com/jdc-article/welcomenutui.jpg',
  'https://storage.360buyimg.com/jdc-article/fristfabu.jpg',
]);
</script>
 
<style lang="scss">
@import '@/styles/common.scss';
 
.flexJobDetail-page-wrapper {
  .curriculum-position-list {
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    column-gap: 24px;
    row-gap: 16px;
 
    .curriculum-position-list-item {
      font-weight: 500;
      font-size: 24px;
      color: boleGetCssVar('color', 'warning');
      line-height: 36px;
    }
  }
}
</style>