|
@@ -10,93 +10,39 @@
|
|
|
<template>
|
|
|
<view class="containe">
|
|
|
<!-- 渐变色 -->
|
|
|
- <view class="top-content px-6 pt-8">
|
|
|
+ <view class="top-content">
|
|
|
<view class="user-box flex">
|
|
|
<!-- 左边 -->
|
|
|
<view class="flex">
|
|
|
<image src="../../static/logo.png" mode="scaleToFill" class="imgs" />
|
|
|
<view class="user-text pt-4">
|
|
|
<text>好闪闪</text>
|
|
|
- <view>技术部:888888</view>
|
|
|
+ <view>牧场-兽医部-技术员</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
<!-- 右边 -->
|
|
|
- <!-- <view>hhhh</view> -->
|
|
|
+ <!-- <view>消息</view> -->
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
<!-- 工具 -->
|
|
|
<view class="px-4">
|
|
|
<view class="tool px-4 pt-2 pb-2">
|
|
|
<view class="title">工具栏</view>
|
|
|
<view class="tool-box">
|
|
|
- <view class="tool-item">
|
|
|
- <image class="icon pb-1" src="../../static/images/tool/lanya.png" mode="scaleToFill" />
|
|
|
- <view>蓝牙</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="tool-item">
|
|
|
- <image
|
|
|
- class="icon pb-1"
|
|
|
- src="../../static/images/tool/editPsd.png"
|
|
|
- mode="scaleToFill"
|
|
|
- />
|
|
|
- <view>扫一扫</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="tool-item">
|
|
|
- <image
|
|
|
- class="icon pb-1"
|
|
|
- src="../../static/images/work/bohuanjiechu.png"
|
|
|
- mode="scaleToFill"
|
|
|
- />
|
|
|
- <view>探牛棒</view>
|
|
|
- </view>
|
|
|
-
|
|
|
- <view class="tool-item">
|
|
|
- <image
|
|
|
- class="icon pb-1"
|
|
|
- src="../../static/images/work/zhuanqun.png"
|
|
|
- mode="scaleToFill"
|
|
|
- />
|
|
|
- <view>脖环</view>
|
|
|
+ <view class="tool-item" v-for="(item, index) in workList" :key="index">
|
|
|
+ <i class="iconfont icon" :class="item.icon"></i>
|
|
|
+ <view class="mt-1">{{ item.name }}</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
-
|
|
|
<!-- 个人信息 -->
|
|
|
- <view class="user-tool px-4 pt-1 pb-1 flex mb-2">
|
|
|
- <view>
|
|
|
- <image class="icons mr-1" src="../../static/images/tool/editPsd.png" mode="scaleToFill" />
|
|
|
- 修改密码
|
|
|
- </view>
|
|
|
- <navigator url="/pages/editPassword/editPassword">
|
|
|
- <wd-icon name="arrow-right" color="#8e8e8e" size="22px"></wd-icon>
|
|
|
- </navigator>
|
|
|
- </view>
|
|
|
- <view class="user-tool px-4 pt-1 pb-1 flex mb-2">
|
|
|
- <view>
|
|
|
- <image class="icons mr-1" src="../../static/images/tool/user.png" mode="scaleToFill" />
|
|
|
- 客服服务
|
|
|
- </view>
|
|
|
- <wd-icon name="arrow-right" color="#8e8e8e" size="22px"></wd-icon>
|
|
|
- </view>
|
|
|
- <view class="user-tool px-4 pt-1 pb-1 flex">
|
|
|
- <view>
|
|
|
- <image class="icons mr-1" src="../../static/images/tool/advice.png" mode="scaleToFill" />
|
|
|
- 服务条款
|
|
|
- </view>
|
|
|
- <navigator url="/pages/serviceText/serviceText">
|
|
|
- <wd-icon name="arrow-right" color="#8e8e8e" size="20px"></wd-icon>
|
|
|
- </navigator>
|
|
|
- </view>
|
|
|
- <view class="user-tool px-4 pt-1 pb-1 flex">
|
|
|
+ <view class="user-tool px-4 pt-1 pb-1 flex mb-2" v-for="(item, index) in userList" :key="index">
|
|
|
<view>
|
|
|
- <image class="icons mr-1" src="../../static/images/tool/service.png" mode="scaleToFill" />
|
|
|
- 意见反馈
|
|
|
+ <image class="icons mr-1" :src="item.img" mode="scaleToFill" />
|
|
|
+ {{ item.name }}
|
|
|
</view>
|
|
|
- <navigator url="/pages/feedBack/feedBack">
|
|
|
+ <navigator :url="item.url">
|
|
|
<wd-icon name="arrow-right" color="#8e8e8e" size="22px"></wd-icon>
|
|
|
</navigator>
|
|
|
</view>
|
|
@@ -104,36 +50,69 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup>
|
|
|
+import { ref } from 'vue'
|
|
|
defineOptions({
|
|
|
name: 'Home',
|
|
|
})
|
|
|
|
|
|
+const workList = ref([
|
|
|
+ { id: 1, name: '消息', icon: 'icon-xiaoxi1' },
|
|
|
+ { id: 2, name: '工作日志', icon: 'icon-rizhiguanli' },
|
|
|
+])
|
|
|
+
|
|
|
+const userList = ref([
|
|
|
+ {
|
|
|
+ id: 1,
|
|
|
+ name: '修改密码',
|
|
|
+ img: '../../static/images/tool/editPsd.png',
|
|
|
+ url: '/pages/editPassword/editPassword',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 2,
|
|
|
+ name: '客服服务',
|
|
|
+ img: '../../static/images/tool/user.png',
|
|
|
+ url: '/pages/editPassword/editPassword',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 3,
|
|
|
+ name: '意见反馈',
|
|
|
+ img: '../../static/images/tool/advice.png',
|
|
|
+ url: '/pages/feedBack/feedBack',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ id: 4,
|
|
|
+ name: '服务条款',
|
|
|
+ img: '../../static/images/tool/service.png',
|
|
|
+ url: '/pages/serviceText/serviceText',
|
|
|
+ },
|
|
|
+])
|
|
|
onMounted(() => {})
|
|
|
|
|
|
onLoad(() => {})
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
+.icon {
|
|
|
+ font-size: 32px !important;
|
|
|
+ color: #f59e0b;
|
|
|
+}
|
|
|
.containe {
|
|
|
- font-size: 24rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
color: #333;
|
|
|
}
|
|
|
.top-content {
|
|
|
- position: fixed;
|
|
|
- top: 0;
|
|
|
- right: 0;
|
|
|
- left: 0;
|
|
|
- z-index: -1;
|
|
|
- height: 260rpx;
|
|
|
- // border: 1px solid red;
|
|
|
+ height: 340rpx;
|
|
|
+ margin-bottom: 20rpx;
|
|
|
+ overflow: hidden;
|
|
|
color: #fbeed8;
|
|
|
text-align: center;
|
|
|
background: linear-gradient(to bottom, #f59e0b, #f6c986);
|
|
|
}
|
|
|
.user-box {
|
|
|
justify-content: space-between;
|
|
|
- height: 260rpx;
|
|
|
- // border: 4px solid #000;
|
|
|
+ width: 100;
|
|
|
+ padding-left: 40rpx;
|
|
|
+ margin-top: 100rpx;
|
|
|
.imgs {
|
|
|
width: 140rpx;
|
|
|
height: 140rpx;
|
|
@@ -143,30 +122,34 @@ onLoad(() => {})
|
|
|
border-radius: 50%;
|
|
|
}
|
|
|
.user-text {
|
|
|
+ font-size: 28rpx;
|
|
|
color: #fff;
|
|
|
text-align: left;
|
|
|
}
|
|
|
}
|
|
|
.tool {
|
|
|
position: relative;
|
|
|
- top: -60rpx;
|
|
|
- margin-top: 400rpx;
|
|
|
- font-size: 24rpx;
|
|
|
+ top: -80rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
background: #fff;
|
|
|
border-radius: 28rpx;
|
|
|
box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.1);
|
|
|
}
|
|
|
.title {
|
|
|
+ padding-bottom: 10rpx;
|
|
|
margin-bottom: 20rpx;
|
|
|
font-size: 32rpx;
|
|
|
+ font-weight: 450;
|
|
|
+ border-bottom: 1px dotted #eee;
|
|
|
}
|
|
|
.icon {
|
|
|
width: 80rpx;
|
|
|
height: 80rpx;
|
|
|
}
|
|
|
.icons {
|
|
|
- width: 60rpx;
|
|
|
- height: 60rpx;
|
|
|
+ top: -4rpx;
|
|
|
+ width: 56rpx;
|
|
|
+ height: 56rpx;
|
|
|
}
|
|
|
.tool-item {
|
|
|
width: 22%;
|
|
@@ -184,10 +167,10 @@ onLoad(() => {})
|
|
|
|
|
|
.user-tool {
|
|
|
justify-content: space-between;
|
|
|
- height: 60rpx;
|
|
|
+ height: 80rpx;
|
|
|
margin-bottom: 1rpx;
|
|
|
- font-size: 24rpx;
|
|
|
- line-height: 60rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
background-color: #fff;
|
|
|
border-bottom: 1px dotted #f5f5f5;
|
|
|
}
|