更新

src/components/Enterprise/components/introduction.vue

@@ -16,7 +16,8 @@
       <v-slide-group :show-arrows="true" class="mt-3 img-box" v-viewer>
         <!-- props.info.enterprise.albumList -->
         <v-slide-group-item v-for="val in list" :key="val">
-          <v-img class="mr-3" width="200" height="120" :src="val" cover rounded></v-img>
+          <v-img v-if="isImage(val)" class="mr-3" width="200" height="115" :src="val" cover rounded></v-img>
+          <video v-else class="videos-radius" :src="val" controls height="118" width="200" preload="preload"></video>
         </v-slide-group-item>
       </v-slide-group>
     </div>
@@ -36,8 +37,14 @@ const list = [
   'https://img.bosszhipin.com/beijin/upload/com/img/20190823/f01c227906f5c15554d19904cf5009944d4ba1fec2b1a061e4a46fb61ddab12d.jpg',
   'https://img.bosszhipin.com/beijin/upload/com/img/20190823/154f6a1bc139eea59bf2610c3115fc664d4ba1fec2b1a061e4a46fb61ddab12d.jpg',
   'https://img.bosszhipin.com/beijin/upload/com/img/20190823/644c82121f1d19cb120c1e4c2836d1004d4ba1fec2b1a061e4a46fb61ddab12d.jpg',
-  'https://img.bosszhipin.com/beijin/upload/com/img/20190823/4b867202f288d6512dac50856bae61194d4ba1fec2b1a061e4a46fb61ddab12d.jpg'
+  'https://img.bosszhipin.com/beijin/upload/com/img/20190823/4b867202f288d6512dac50856bae61194d4ba1fec2b1a061e4a46fb61ddab12d.jpg',
+  'https://zhipin-company-1251955568.file.myqcloud.com/zhipin-company/99/20240411/fp0316a40013_f2abd6bc44254064931620a9a1dbdf21-OSS11.30.go15.fmHblack.mp4?sign=8bbdf46fa8ec4f97a742edf59e559379&t=1716168952'
 ]
+
+const isImage = (url) => {
+  var reg = /\.(png|jpg|gif|jpeg|webp)$/
+  return reg.test(url)
+}
 </script>
 
 <style scoped lang="scss">
@@ -50,4 +57,7 @@ const list = [
   text-align: justify;
   letter-spacing: 0;
 }
+.videos-radius {
+  border-radius: 8px;
+}
 </style>

src/components/Enterprise/components/positions.vue

@@ -1,17 +1,63 @@
 <template>
-  <div>在招职位
-    <!-- <div class="banner-tools my-4" style="height: 98px;"> -->
-      <!-- <div class="float-left" style="line-height: 40px;">
-        <v-chip size="small" label v-for="(k, i) in info.tagList" :key="i" class="mr-1" color="primary">{{ k }}</v-chip>
-      </div> -->
-    <!-- </div> -->
+  <div>
+    <div class="top">检索</div>
+    <div class="bottom">
+      <div v-for="(val, i) in list" :key="i">
+        <div class="d-flex justify-space-between">
+          <p :class="['name', {'default-active': val.active }]">{{ val.name }}</p>
+          <p class="salary">{{ val.payFrom }}-{{ val.payTo }}k/{{ val.payName }}</p>
+        </div>
+      </div>
+    </div>
   </div>
 </template>
 
 <script setup>
 defineOptions({ name: 'recruitment-positions'})
+const list = [
+  {
+    name: '产品经理',
+    payFrom: 6,
+    payTo: 11,
+    payName: '月',
+    updateTime: 1716175909224,
+    areaName: '广州',
+    eduName: '本科',
+    expName: '1-3年',
+    active: false
+  },
+  {
+    name: '产品经理',
+    payFrom: 6,
+    payTo: 11,
+    payName: '月',
+    updateTime: 1716175909224,
+    areaName: '广州',
+    eduName: '本科',
+    expName: '1-3年',
+    active: false
+  }
+]
 </script>
 
 <style scoped lang="scss">
-
+.name {
+  position: relative;
+  max-width: 200px;
+  margin-right: 8px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-weight: 600;
+  &:hover {
+    color: var(--v-primary-base);
+  }
+}
+.salary {
+  font-size: 16px;
+  font-weight: 700;
+  color: #fe574a;
+  line-height: 22px;
+  flex: none;
+}
 </style>