feat:求职记录界面样式更改

package/records/records.vue

@@ -1,416 +1,535 @@
 <template>
-	<view>
-		<view class="gwList flex justify-center" v-if="dataList.length>0">
-			<view class="gwList-box">
-				<view class="gwList-box-item flex justify-center" @click="gotoInfo(item.postPushId)"
-					v-for="(item,index) in dataList" :key="index">
-					<view class="gwList-box-item-box">
-						<view v-if="item" class="gwList-box-item-box-title flex justify-between align-center">
-							<text>{{item.stationName}}</text>
-							<text>{{item.salaryRange}}</text>
-						</view>
-						<view class="gwList-box-item-box-label flex align-center flex-wrap">
-							<text
-								style="color: #666666;font-size: 26rpx;padding: 10rpx 25rpx 10rpx 25rpx;background-color: #F6F6F6;border-radius: 8rpx;margin-right: 20rpx;margin-bottom: 20rpx;"
-								v-for="(ite,ind) in item.positionWelfare" :key="ind">{{ite}}</text>
-						</view>
-						<block v-if="title=='我的收藏'">
-							<view class="gwList-box-item-box-name flex justify-between align-center">
-								<text>{{item.companyName?item.companyName:'匿名公司'}}</text>
-								<text v-if="item.companyPeople">{{item.companyPeople}}</text>
-							</view>
-							<view class="gwList-box-item-box-line"></view>
-							<view class="gwList-box-item-box-info flex justify-between align-center">
-								<view class="gwList-box-item-box-info-l flex align-center">
-									<image :src="item.companyLogo?item.companyLogo:'../../static/logo.png'"
-										style="width: 58rpx;height: 58rpx;border-radius: 50%;margin-right: 20rpx;"
-										mode=""></image>
-									<text v-if="item.companyLegalPerson">{{item.companyLegalPerson}}·创始人</text>
-								</view>
-								<view class="gwList-box-item-box-info-r">
-									{{item.county}}
-									{{item.address}}
+  <view>
+    <view class="qz-record">
+      <view class="qz-title">求职记录</view>
+      <view class="qz-desc"
+        >当前记录仅自己可见，招聘者无法看到你所浏览过或投递过的
+        其他岗位，当前数据仅保留半年的记录。</view
+      >
+    </view>
+    <u-tabs :list="list" @change="tabClick" :current="tabIndex" class="tab-list"></u-tabs>
+    <view class="gwList flex justify-center" v-if="dataList.length > 0">
+      <view class="gwList-box">
+        <view
+          class="gwList-box-item flex justify-center"
+          @click="gotoInfo(item.postPushId)"
+          v-for="(item, index) in dataList"
+          :key="index"
+        >
+          <view class="gwList-box-item-box">
+            <view
+              v-if="item"
+              class="gwList-box-item-box-title flex justify-between align-center"
+            >
+              <text>{{ item.stationName }}</text>
+              <text>{{ item.salaryRange }}</text>
+            </view>
+            <block v-if="title == '我的收藏'">
+              <view class="gwList-box-item-box-name">
+                <text>{{ item.companyName ? item.companyName : "匿名公司" }}</text>
+                <text v-if="item.companyPeople">{{ item.companyPeople }}</text>
+              </view>
+              <view class="gwList-box-item-box-label flex align-center flex-wrap">
+                <view
+                  class="gw-tag"
+                  v-for="(ite, ind) in item.positionWelfare"
+                  :key="ind"
+                  >{{ ite }}</view
+                >
+              </view>
+              <view class="gwList-box-item-box-info flex justify-between align-center">
+                <view class="gwList-box-item-box-info-l flex align-center">
+                  <image
+                    :src="item.companyLogo ? item.companyLogo : '../../static/logo.png'"
+                    class="user-info-img"
+                    mode=""
+                  ></image>
+                  <text v-if="item.companyLegalPerson"
+                    >{{ item.companyLegalPerson }}·创始人</text
+                  >
+                  <view class="info-tag">3分钟前回复</view>
+                </view>
+                <view class="gwList-box-item-box-info-r">
+                  {{ item.county }}
+                  {{ item.address }}
+                </view>
+              </view>
+            </block>
+            <block v-else-if="title == '浏览记录'">
+              <view class="gwList-box-item-box-name">
+                <text>{{ item.companyName ? item.companyName : "匿名公司" }}</text>
+                <text>{{ item.companyPeople ? item.companyPeople : 0 }}</text>
+              </view>
+              <view class="gwList-box-item-box-label flex align-center flex-wrap">
+                <view
+                  class="gw-tag"
+                  v-for="(ite, ind) in item.positionWelfare"
+                  :key="ind"
+                  >{{ ite }}</view
+                >
+              </view>
+              <view class="gwList-box-item-box-info flex justify-between align-center">
+                <view class="gwList-box-item-box-info-l flex align-center">
+                  <image
+                    :src="item.companyLogo ? item.companyLogo : '../../static/logo.png'"
+                    class="user-info-img"
+                    mode=""
+                  ></image>
+                  <text v-if="item.companyLegalPerson"
+                    >{{ item.companyLegalPerson }}·创始人</text
+                  >
+                  <view class="info-tag">3分钟前回复</view>
+                </view>
+                <view class="gwList-box-item-box-info-r">
+                  {{ item.county }}
+                  {{ item.address }}
+                </view>
+              </view>
+            </block>
+            <block v-else>
+              <view class="gwList-box-item-box-name">
+                <text>{{ item.companyName ? item.companyName : "匿名公司" }}</text>
+                <text v-if="item.companyPeople">{{ item.companyPeople }}</text>
+              </view>
+              <view class="gwList-box-item-box-label flex align-center flex-wrap">
+                <view
+                  class="gw-tag"
+                  v-for="(ite, ind) in item.positionWelfare"
+                  :key="ind"
+                  >{{ ite }}</view
+                >
+              </view>
+              <view class="gwList-box-item-box-info flex justify-between align-center">
+                <view class="gwList-box-item-box-info-l flex align-center">
+                  <image
+                    :src="item.companyLogo ? item.companyLogo : '../../static/logo.png'"
+                    class="user-info-img"
+                    mode=""
+                  ></image>
+                  <text v-if="item.companyLegalPerson"
+                    >{{ item.companyLegalPerson }}·创始人</text
+                  >
+                  <view class="info-tag">3分钟前回复</view>
+                </view>
+                <view class="gwList-box-item-box-info-r">
+                  {{ item.county }}
+                  {{ item.address }}
+                </view>
+              </view>
+            </block>
+          </view>
+        </view>
+      </view>
+    </view>
 
-								</view>
-							</view>
-						</block>
-						<block v-else-if="title=='浏览记录'">
-							<view class="gwList-box-item-box-name flex justify-between align-center">
-								<text>{{item.companyName?item.companyName:'匿名公司'}}</text>
-								<text>{{item.companyPeople?item.companyPeople:0}}</text>
-							</view>
-							<view class="gwList-box-item-box-line"></view>
-							<view class="gwList-box-item-box-info flex justify-between align-center">
-								<view class="gwList-box-item-box-info-l flex align-center">
-									<image :src="item.companyLogo?item.companyLogo:'../../static/logo.png'"
-										style="width: 58rpx;height: 58rpx;border-radius: 50%;margin-right: 20rpx;"
-										mode=""></image>
-									<text v-if="item.companyLegalPerson">{{item.companyLegalPerson}}·创始人</text>
-								</view>
-								<view class="gwList-box-item-box-info-r">
-									{{item.county}}
-									{{item.address}}
-
-								</view>
-							</view>
-						</block>
-						<block v-else>
-							<view class="gwList-box-item-box-name flex justify-between align-center">
-								<text>{{item.companyName?item.companyName:'匿名公司'}}</text>
-								<text v-if="item.companyPeople">{{item.companyPeople}}</text>
-							</view>
-							<view class="gwList-box-item-box-line"></view>
-							<view class="gwList-box-item-box-info flex justify-between align-center">
-								<view class="gwList-box-item-box-info-l flex align-center">
-									<image :src="item.companyLogo?item.companyLogo:'../../static/logo.png'"
-										style="width: 58rpx;height: 58rpx;border-radius: 50%;margin-right: 20rpx;"
-										mode=""></image>
-									<text v-if="item.companyLegalPerson">{{item.companyLegalPerson}}·创始人</text>
-								</view>
-								<view class="gwList-box-item-box-info-r">
-									{{item.county}}
-									{{item.address}}
-								</view>
-							</view>
-						</block>
-
-					</view>
-				</view>
-			</view>
-		</view>
-
-		<!-- 暂无数据 -->
-		<view class="gwList" v-else>
-			<empty />
-		</view>
-		<!-- 筛选悬浮 -->
-		<view class="filterSe" @click="goScreen()">
-			<image src="../../static/images/my/filterSe.png" mode=""></image>
-		</view>
-	</view>
+    <!-- 暂无数据 -->
+    <view class="gwList" v-else>
+      <empty />
+    </view>
+    <!-- 筛选悬浮 -->
+    <view class="filterSe" @click="goScreen()">
+      <image src="../../static/images/my/filterSe.png" mode=""></image>
+    </view>
+  </view>
 </template>
 
 <script>
-	import empty from '../../components/empty.vue'
-	export default {
-		components: {
-			empty
-		},
-		data() {
-			return {
-				dataList: [],
-				page: 1,
-				limit: 10,
-				pages: '',
-				title: '',
-				filter: {
-					education: '', //学历
-					salaryRange: '', //薪资
-					experience: '', //经验
-					companyPeople: '', //公司规模
-					industry: '', //行业
-				}
-			};
-		},
-		onLoad(option) {
-			uni.setNavigationBarTitle({
-				title: option.title
-			})
-			uni.showLoading({
-				title: '加载中'
-			})
-			this.title = option.title
-			if (option.title == '我的收藏') {
-				this.getMyCollectionList()
-			} else if (option.title == '浏览记录') {
-				this.getDataList()
-			} else {
-				this.getDataLists()
-			}
-
-		},
-		onUnload() {
-			uni.removeStorageSync('browse')
-		},
-		watch: {
-			filter: {
-				handler() {
-					this.page = 1
-					if (this.title == '我的收藏') {
-						this.getMyCollectionList()
-					} else if (this.title == '浏览记录') {
-						this.getDataList()
-					} else {
-						this.getDataLists()
-					}
-				},
-				deep: true,
-				immediate: true
-			}
-		},
-		onShow() {
-			if (uni.getStorageSync('browse') && (uni.getStorageSync('browse')).length > 0) {
-				let browse = uni.getStorageSync('browse')
-				console.log(browse, '2222222222')
-				browse.map(item => {
-					let arr = []
-					item.list.map(ite => {
-						if (ite.value != '不限') {
-							arr.push(ite.value)
-						}
-					})
-					switch (item.name) {
-						case '学历':
-							this.filter.education = arr.join(',')
-							break;
-						case '薪资':
-							this.filter.salaryRange = arr.join(',')
-							break;
-						case '经验':
-							this.filter.experience = arr.join(',')
-							break;
-						case '公司规模':
-							this.filter.companyPeople = arr.join(',')
-							break;
-						case '行业':
-							this.filter.industry = arr.join(',')
-							break;
-					}
-
-				})
-			} else {
-				this.filter.education = '' //学历
-				this.filter.experience = '' //经验
-				this.filter.industry = '' //行业
-				this.filter.salaryRange = '' //薪资
-				this.filter.companyPeople = '' //公司规模
-			}
-		},
-		onReachBottom() {
-			if (this.page < this.pages) {
-				this.page += 1
-				if (this.title == '我的收藏') {
-					this.getMyCollectionList()
-				} else if (this.title == '浏览记录') {
-					this.getDataList()
-				} else {
-					this.getDataLists()
-				}
-			}
-		},
-		onPullDownRefresh() {
-			this.page = 1
-			if (this.title == '我的收藏') {
-				this.getMyCollectionList()
-			} else if (this.title == '浏览记录') {
-				this.getDataList()
-			} else {
-				this.getDataLists()
-			}
-		},
-		methods: {
-			// 去筛选
-			goScreen() {
-				uni.navigateTo({
-					url: '/package/screen/screen?isBrowse=1'
-				})
-			},
-			/**
-			 * 我的收藏记录列表
-			 */
-			getMyCollectionList() {
-				let data = {
-					page: this.page,
-					limit: this.limit,
-					education: this.filter.education, //学历
-					salaryRange: this.filter.salaryRange, //薪资
-					experience: this.filter.experience, //经验
-					companyPeople: this.filter.companyPeople, //公司规模
-					industry: this.filter.industry, //行业
-				}
-				this.$Request.getT('/app/myCollection/getMyCollectionListV2', data).then(res => {
-					uni.stopPullDownRefresh()
-					uni.hideLoading()
-					if (res.code == 0) {
-						res.data.records.map(item => {
-							if (item.positionWelfare) {
-								item.positionWelfare = item.positionWelfare.split(',')
-							}
-						})
-						this.pages = res.data.pages
-						if (this.page == 1) {
-							this.dataList = res.data.records
-						} else {
-							this.dataList = [...this.dataList, ...res.data.records]
-						}
-					}
-				})
-			},
-			gotoInfo(postPushId) {
-				if (!postPushId) {
-					uni.showToast({
-						title: '岗位不存在',
-						icon: 'none'
-					})
-					return
-				}
-				uni.navigateTo({
-					url: '/pages/index/game/order?postPushId=' + postPushId
-				})
-			},
-			getDataLists() {
-				let data = {
-					page: this.page,
-					limit: this.limit,
-					userId: uni.getStorageSync('userId'),
-					education: this.filter.education, //学历
-					salaryRange: this.filter.salaryRange, //薪资
-					experience: this.filter.experience, //经验
-					companyPeople: this.filter.companyPeople, //公司规模
-					industry: this.filter.industry, //行业
-				}
-				this.$Request.getT('/app/sendRecord/getMyRecordListV2', data).then(res => {
-					uni.stopPullDownRefresh()
-					uni.hideLoading()
-					if (res.code == 0) {
-						res.data.records.map(item => {
-							if (item.positionWelfare) {
-								item.positionWelfare = item.positionWelfare.split(',')
-							}
-						})
-						this.pages = res.data.pages
-						if (this.page == 1) {
-							this.dataList = res.data.records
-						} else {
-							this.dataList = [...this.dataList, ...res.data.records]
-						}
-					}
-				})
-			},
-			getDataList() {
-				let data = {
-					page: this.page,
-					limit: this.limit,
-					education: this.filter.education, //学历
-					salaryRange: this.filter.salaryRange, //薪资
-					experience: this.filter.experience, //经验
-					companyPeople: this.filter.companyPeople, //公司规模
-					industry: this.filter.industry, //行业
-					// browseType:1
-				}
-				this.$Request.getT('/app/userBrowse/selectMyBrowseV2', data).then(res => {
-					uni.stopPullDownRefresh()
-					uni.hideLoading()
-					if (res.code == 0) {
-						res.data.records.map(item => {
-							if (item.positionWelfare) {
-								item.positionWelfare = item.positionWelfare.split(',')
-							} else {
-								item.positionWelfare = []
-							}
-						})
-						this.pages = res.data.pages
-						if (this.page == 1) {
-							this.dataList = res.data.records
-						} else {
-							this.dataList = [...this.dataList, ...res.data.records]
-						}
-					}
-				})
-			},
-		},
-	}
+import empty from "../../components/empty.vue";
+export default {
+  components: {
+    empty,
+  },
+  data() {
+    return {
+      dataList: [],
+      page: 1,
+      limit: 10,
+      pages: "",
+      title: "",
+      tabIndex: 0, //tab选中的索引
+      filter: {
+        education: "", //学历
+        salaryRange: "", //薪资
+        experience: "", //经验
+        companyPeople: "", //公司规模
+        industry: "", //行业
+      },
+      list: [
+        {
+          name: "我看过",
+        },
+        {
+          name: "沟通过",
+        },
+        {
+          name: "面试过",
+        },
+        {
+          name: "收藏职位",
+        },
+      ],
+    };
+  },
+  onLoad(option) {
+    uni.setNavigationBarTitle({
+      title: option.title,
+    });
+    uni.showLoading({
+      title: "加载中",
+    });
+    this.title = option.title;
+    if (option.title == "我的收藏") {
+      this.getMyCollectionList();
+    } else if (option.title == "浏览记录") {
+      this.getDataList();
+    } else {
+      this.getDataLists();
+    }
+  },
+  onUnload() {
+    uni.removeStorageSync("browse");
+  },
+  watch: {
+    filter: {
+      handler() {
+        this.page = 1;
+        if (this.title == "我的收藏") {
+          this.getMyCollectionList();
+        } else if (this.title == "浏览记录") {
+          this.getDataList();
+        } else {
+          this.getDataLists();
+        }
+      },
+      deep: true,
+      immediate: true,
+    },
+  },
+  onShow() {
+    if (uni.getStorageSync("browse") && uni.getStorageSync("browse").length > 0) {
+      let browse = uni.getStorageSync("browse");
+      console.log(browse, "2222222222");
+      browse.map((item) => {
+        let arr = [];
+        item.list.map((ite) => {
+          if (ite.value != "不限") {
+            arr.push(ite.value);
+          }
+        });
+        switch (item.name) {
+          case "学历":
+            this.filter.education = arr.join(",");
+            break;
+          case "薪资":
+            this.filter.salaryRange = arr.join(",");
+            break;
+          case "经验":
+            this.filter.experience = arr.join(",");
+            break;
+          case "公司规模":
+            this.filter.companyPeople = arr.join(",");
+            break;
+          case "行业":
+            this.filter.industry = arr.join(",");
+            break;
+        }
+      });
+    } else {
+      this.filter.education = ""; //学历
+      this.filter.experience = ""; //经验
+      this.filter.industry = ""; //行业
+      this.filter.salaryRange = ""; //薪资
+      this.filter.companyPeople = ""; //公司规模
+    }
+  },
+  onReachBottom() {
+    if (this.page < this.pages) {
+      this.page += 1;
+      if (this.title == "我的收藏") {
+        this.getMyCollectionList();
+      } else if (this.title == "浏览记录") {
+        this.getDataList();
+      } else {
+        this.getDataLists();
+      }
+    }
+  },
+  onPullDownRefresh() {
+    this.page = 1;
+    if (this.title == "我的收藏") {
+      this.getMyCollectionList();
+    } else if (this.title == "浏览记录") {
+      this.getDataList();
+    } else {
+      this.getDataLists();
+    }
+  },
+  methods: {
+    // 去筛选
+    goScreen() {
+      uni.navigateTo({
+        url: "/package/screen/screen?isBrowse=1",
+      });
+    },
+    tabClick(e) {
+      this.tabIndex = e;
+    },
+    /**
+     * 我的收藏记录列表
+     */
+    getMyCollectionList() {
+      let data = {
+        page: this.page,
+        limit: this.limit,
+        education: this.filter.education, //学历
+        salaryRange: this.filter.salaryRange, //薪资
+        experience: this.filter.experience, //经验
+        companyPeople: this.filter.companyPeople, //公司规模
+        industry: this.filter.industry, //行业
+      };
+      this.$Request.getT("/app/myCollection/getMyCollectionListV2", data).then((res) => {
+        uni.stopPullDownRefresh();
+        uni.hideLoading();
+        if (res.code == 0) {
+          res.data.records.map((item) => {
+            if (item.positionWelfare) {
+              item.positionWelfare = item.positionWelfare.split(",");
+            }
+          });
+          this.pages = res.data.pages;
+          if (this.page == 1) {
+            this.dataList = res.data.records;
+          } else {
+            this.dataList = [...this.dataList, ...res.data.records];
+          }
+        }
+      });
+    },
+    gotoInfo(postPushId) {
+      if (!postPushId) {
+        uni.showToast({
+          title: "岗位不存在",
+          icon: "none",
+        });
+        return;
+      }
+      uni.navigateTo({
+        url: "/pages/index/game/order?postPushId=" + postPushId,
+      });
+    },
+    getDataLists() {
+      let data = {
+        page: this.page,
+        limit: this.limit,
+        userId: uni.getStorageSync("userId"),
+        education: this.filter.education, //学历
+        salaryRange: this.filter.salaryRange, //薪资
+        experience: this.filter.experience, //经验
+        companyPeople: this.filter.companyPeople, //公司规模
+        industry: this.filter.industry, //行业
+      };
+      this.$Request.getT("/app/sendRecord/getMyRecordListV2", data).then((res) => {
+        uni.stopPullDownRefresh();
+        uni.hideLoading();
+        if (res.code == 0) {
+          res.data.records.map((item) => {
+            if (item.positionWelfare) {
+              item.positionWelfare = item.positionWelfare.split(",");
+            }
+          });
+          this.pages = res.data.pages;
+          if (this.page == 1) {
+            this.dataList = res.data.records;
+          } else {
+            this.dataList = [...this.dataList, ...res.data.records];
+          }
+        }
+      });
+    },
+    getDataList() {
+      let data = {
+        page: this.page,
+        limit: this.limit,
+        education: this.filter.education, //学历
+        salaryRange: this.filter.salaryRange, //薪资
+        experience: this.filter.experience, //经验
+        companyPeople: this.filter.companyPeople, //公司规模
+        industry: this.filter.industry, //行业
+        // browseType:1
+      };
+      this.$Request.getT("/app/userBrowse/selectMyBrowseV2", data).then((res) => {
+        uni.stopPullDownRefresh();
+        uni.hideLoading();
+        if (res.code == 0) {
+          res.data.records.map((item) => {
+            if (item.positionWelfare) {
+              item.positionWelfare = item.positionWelfare.split(",");
+            } else {
+              item.positionWelfare = [];
+            }
+          });
+          this.pages = res.data.pages;
+          if (this.page == 1) {
+            this.dataList = res.data.records;
+          } else {
+            this.dataList = [...this.dataList, ...res.data.records];
+          }
+        }
+      });
+    },
+  },
+};
 </script>
 
-<style lang="scss">
-	page {
-		background: #F2F2F7;
-	}
-
-	.filterSe {
-		position: fixed;
-		bottom: 10vh;
-		right: 30rpx;
-
-		image {
-			width: 100rpx;
-			height: 100rpx;
-			// border-radius: 50%;
-		}
-	}
-
-	.gwList {
-		width: 100%;
-
-		.gwList-box {
-			width: 686rpx;
-			height: 100%;
-
-			.gwList-box-item {
-				width: 100%;
-				// height: 329rpx;
-				background-color: #ffffff;
-				border-radius: 24rpx;
-				margin-bottom: 20rpx;
-				padding-bottom: 20rpx;
-				margin-top: 20rpx;
-			}
-
-			.gwList-box-item-box {
-				width: 623rpx;
-				height: 100%;
+<style lang="scss" scoped>
+page {
+  background: #fff;
+}
 
-				.gwList-box-item-box-title {
-					margin-top: 30rpx;
+.filterSe {
+  position: fixed;
+  bottom: 10vh;
+  right: 30rpx;
 
-					text:nth-of-type(1) {
-						color: #1F1F1F;
-						font-size: 38rpx;
-						font-weight: 800;
-					}
+  image {
+    width: 100rpx;
+    height: 100rpx;
+    // border-radius: 50%;
+  }
+}
+.tab-list {
+  margin-bottom: 20rpx;
+}
+.gwList {
+  width: 100%;
 
-					text:nth-of-type(2) {
-						color: #00B88F;
-						font-size: 38rpx;
-						font-weight: bold;
-					}
-				}
+  .gwList-box {
+    width: 686rpx;
+    height: 100%;
 
-				.gwList-box-item-box-label {
-					margin-top: 30rpx;
-				}
+    .gwList-box-item {
+      width: 100%;
+      box-sizing: border-box;
+      border: 1rpx solid rgba(227, 231, 236, 1);
+      border-radius: 12rpx;
+      background: #fdfdfd;
+      padding: 36rpx;
+      margin-bottom: 20rpx;
+    }
 
-				.gwList-box-item-box-name {
-					margin-top: 24rpx;
-					color: #999999;
-					font-size: 28rpx;
-					font-weight: 500;
+    .gwList-box-item-box {
+      width: 623rpx;
+      height: 100%;
 
-					text:nth-of-type(1) {
-						width: 450rpx;
-					}
-				}
+      .gwList-box-item-box-title {
+        text:nth-of-type(1) {
+          color: #171725;
+          font-family: DM Sans;
+          font-size: 32rpx;
+          font-weight: 700;
+          line-height: 48rpx;
+        }
 
-				.gwList-box-item-box-line {
-					width: 100%;
-					border: 1rpx solid #E6E6E6;
-					margin-top: 30rpx;
-					margin-bottom: 20rpx;
-				}
+        text:nth-of-type(2) {
+          color: #016bf6;
+          font-family: DM Sans;
+          font-size: 24rpx;
+          font-weight: 700;
+          line-height: 40rpx;
+        }
+      }
 
-				.gwList-box-item-box-info {
-					font-size: 26rpx;
+      .gwList-box-item-box-label {
+        display: flex;
+        align-items: center;
+        gap: 8rpx;
+        .gw-tag {
+          /* 自动布局 */
+          display: flex;
+          justify-content: center;
+          align-items: center;
+          padding: 8rpx;
+          border-radius: 8rpx;
+          box-sizing: border-box;
+          background: #c6c6c61a;
+          color: rgba(153, 153, 153, 1);
+          font-family: DM Sans;
+          font-size: 20rpx;
+          font-weight: 400;
+          line-height: 20rpx;
+        }
+      }
 
-					.gwList-box-item-box-info-l {
-						color: #1A1A1A;
-					}
+      .gwList-box-item-box-name {
+        color: #9ca4ab;
+        font-family: DM Sans;
+        font-size: 24rpx;
+        font-weight: 400;
+        line-height: 40rpx;
+        padding: 6rpx 0;
+        box-sizing: border-box;
+        text {
+          margin-right: 8rpx;
+        }
+        // text:nth-of-type(1) {
+        //   width: 450rpx;
+        // }
+      }
+      .gwList-box-item-box-info {
+        font-size: 26rpx;
+        padding-top: 20rpx;
+        box-sizing: border-box;
+        color: #9ca4ab;
+        font-family: DM Sans;
+        font-size: 16rpx;
+        font-weight: 400;
+        line-height: 40rpx;
+        text-align: left;
+        .gwList-box-item-box-info-l {
+          .info-tag {
+            border-radius: 8rpx;
+            background: rgba(236, 225, 253, 1);
+            padding: 8rpx;
+            box-sizing: border-box;
+            font-family: DM Sans;
+            color: #7659d2;
+            font-size: 16rpx;
+            font-weight: 400;
+            line-height: 20rpx;
+            margin-left: 8rpx;
+          }
+          .user-info-img {
+            width: 40rpx;
+            height: 40rpx;
+            border: 1rpx solid rgba(240, 240, 240, 1);
+            border-radius: 50%;
+            margin-right: 8.62rpx;
+          }
+        }
 
-					.gwList-box-item-box-info-r {
-						color: #999999;
-						max-width: 340rpx;
-					}
-				}
-			}
-		}
-	}
-</style>
+        .gwList-box-item-box-info-r {
+          max-width: 340rpx;
+        }
+      }
+    }
+  }
+}
+.qz-record {
+  padding: 20rpx 40rpx;
+  box-sizing: border-box;
+  .qz-title {
+    font-family: DM Sans;
+    font-size: 60rpx;
+    color: rgba(51, 51, 51, 1);
+    font-weight: 800;
+  }
+  .qz-desc {
+    color: rgba(102, 102, 102, 1);
+    font-family: DM Sans;
+    font-size: 24rpx;
+    font-weight: 400;
+    line-height: 32rpx;
+    margin-top: 20rpx;
+  }
+}
+</style>