Browse Source

我的投递页面新增 接口联调

wangcc 2 years ago
parent
commit
3a8e93c696

+ 18 - 2
src/api/PersonalCenter/index.js

@@ -2,8 +2,8 @@
  * @Description: 个人中心
  * @Author: 空白格
  * @Date: 2022-08-15 14:26:14
- * @LastEditors: gcz
- * @LastEditTime: 2022-08-18 16:13:42
+ * @LastEditors: wangcc
+ * @LastEditTime: 2022-08-24 18:01:54
  * @FilePath: \veterans_client_web\src\api\PersonalCenter\index.js
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
  */
@@ -60,3 +60,19 @@ export function getIdInfo(params) {
   })
 }
 
+
+/**
+ * 查询我投递列表
+ * @param {*} params
+ * @returns
+ */
+ export function myDeliveredList(params) {
+  return request({
+    url: '/app/delivery/myDeliveredList',
+    method: 'get',
+    headers: {
+      noLoginFlag: true
+    },
+    params
+  })
+}

BIN
src/assets/images/log.png


+ 2 - 2
src/components/BannerBreadcrumb/index.vue

@@ -2,8 +2,8 @@
  * @Description: 顶部广告图和面包屑
  * @Author: 空白格
  * @Date: 2022-08-11 13:44:08
- * @LastEditors: 空白格
- * @LastEditTime: 2022-08-22 10:25:33
+ * @LastEditors: wangcc
+ * @LastEditTime: 2022-08-24 16:19:32
  * @FilePath: \veterans_client_web\src\components\BannerBreadcrumb\index.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->

+ 199 - 3
src/views/PersonalCenter/Deliver/DeliverIndex.vue

@@ -2,11 +2,207 @@
  * @Description: 我的投递
  * @Author: 空白格
  * @Date: 2022-08-24 09:40:33
- * @LastEditors: 空白格
- * @LastEditTime: 2022-08-24 09:40:33
+ * @LastEditors: wangcc
+ * @LastEditTime: 2022-08-24 18:04:18
  * @FilePath: \veterans_client_web\src\views\PersonalCenter\Deliver\DeliverIndex.vue
  * @Copyright: Copyright (c) 2016~2022 by 空白格, All Rights Reserved.
 -->
 <template>
-  <div>我的投递</div>
+  <div>
+    <banner title="我的投递" :breadcrumb="false"></banner>
+    <div class="breadcrumb">
+      <div class="_container">
+        <div class="banner-breadcrumb-breadcrumb">
+          <el-breadcrumb separator-class="el-icon-arrow-right">
+            <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
+            <el-breadcrumb-item :to="{ path: '/personalcenter'}">我的</el-breadcrumb-item>
+            <el-breadcrumb-item>我的投递</el-breadcrumb-item>
+          </el-breadcrumb>
+        </div>
+      </div>
+    </div>
+    <div class="deliverBox">
+      <div class="_container">
+        <div class="box-list">
+          <h1>全部投递</h1>
+          <div>
+            <div class="deliver" v-for="(item,index) in deliverList" :key="index">
+              <div class="log">
+                <img :src="item.companyLogoUrl" alt />
+              </div>
+              <div class="center">
+                <h3>{{item.tit}}</h3>
+                <p>{{item.provinceName}}/{{item.experience}} {{item.education}}</p>
+                <p>{{item.company}}</p>
+              </div>
+              <div class="right-box">
+                <span class="pir">{{item.pir}}</span>
+                <span class="time">{{item.createTime}}</span>
+              </div>
+            </div>
+            <div class="pagination" v-if="total">
+              <el-pagination
+                background
+                layout="prev, pager, next"
+                :page-size="queryParams.pageSize"
+                :total="total"
+                @current-change="currentChange"
+              />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
 </template>
+
+<script>
+import banner from '@/components/BannerBreadcrumb/index.vue';
+import {myDeliveredList} from '@/api/PersonalCenter/index'
+export default {
+  name: 'DeliverIndex',
+  components: { banner },
+  data() {
+    return {
+      queryParams: {
+        pageNum: 1,
+        pageSize: 10,
+        schoolName: undefined
+      },
+      total: 0,
+      loading: false,
+      deliverList: []
+    };
+  },
+  methods: {
+    /**
+     * 分页切换触发
+     * @date 2022-08-16
+     * @param {any} page
+     * @returns {any}
+     */
+    currentChange(page) {
+      this.queryParams.pageNum = page;
+      this.getList();
+    },
+    /**
+     * 获取列表
+     * @date 2022-08-11
+     * @returns {any}
+     */
+    getList() {
+      this.loading = true;
+      myDeliveredList(this.queryParams).then((res) => {
+        this.deliverList = res.rows;
+        this.total = Number(res.total);
+        this.loading = false;
+      });
+    }
+  }
+};
+</script>
+
+<style  lang='scss' scoped>
+._container {
+  width: 1200px !important;
+  margin-right: auto;
+  margin-left: auto;
+  padding-right: 15px;
+  padding-left: 15px;
+  max-width: none !important;
+}
+._container:after,
+._container:before {
+  display: table;
+  content: ' ';
+  clear: both;
+}
+.breadcrumb {
+  background-color: #f5f7fa;
+  height: 70px;
+  display: flex;
+  align-items: center;
+}
+.banner-breadcrumb-breadcrumb {
+  .el-breadcrumb {
+    font-size: 18px;
+  }
+  :deep(.el-breadcrumb__inner.is-link) {
+    color: #7e7e7e;
+    font-weight: normal;
+  }
+  :deep(.el-breadcrumb__item:last-child .el-breadcrumb__inner) {
+    color: #ff0000;
+  }
+}
+.box-list {
+  background-color: #fff;
+  padding: 10px 0 80px 0;
+  display: table;
+  h1 {
+    color: #222222;
+    font-size: 26px;
+    margin: 19px 20px;
+  }
+  .deliver:hover {
+    box-shadow: 0 1px 10px 0 rgba(0, 0, 0, 0.11);
+  }
+  .deliver {
+    cursor: pointer;
+    width: 532px;
+    height: 93px;
+    background: #ffffff;
+    border: 1px solid rgba(0, 0, 0, 0.11);
+    transition: 0.5s;
+    border-radius: 3px;
+    margin: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    padding: 0 20px;
+    float: left;
+    .log {
+      width: 60px;
+      height: 60px;
+      background: #ffffff;
+      border: 1px solid #e2e2e2;
+      border-radius: 4px;
+      overflow: hidden;
+      img {
+        width: 100%;
+        height: 100%;
+      }
+    }
+    .center {
+      width: 340px;
+      h3 {
+        color: #1a1a1a;
+        margin-bottom: 10px;
+        font-size: 20px;
+        font-family: 'SourceHanSansCN';
+      }
+      p {
+        color: #666666;
+        font-size: 14px;
+        line-height: 20px;
+      }
+    }
+    .right-box {
+      display: flex;
+      flex-direction: column;
+      justify-content: right;
+      span {
+        text-align: right;
+      }
+      .pir {
+        color: #ef651f;
+        font-size: 20px;
+      }
+      .time {
+        color: #999999;
+        font-size: 14px;
+      }
+    }
+  }
+}
+</style>