🎉 init: 上传图片
|
@ -27,7 +27,8 @@
|
|||
<view class="headline-box">
|
||||
<view class="card" v-for="(item, index) in item.content" style="width: 4rem">
|
||||
<view class="icon">
|
||||
<uni-icons type="image-filled" size="30" color="#3c9bff"></uni-icons>
|
||||
<!-- <uni-icons type="image-filled" size="30" color="#3c9bff"></uni-icons> -->
|
||||
<image :src="item.icon" style="width: 2.5rem; height: 2.5rem"></image>
|
||||
</view>
|
||||
<view
|
||||
class="text"
|
||||
|
@ -96,47 +97,47 @@ const functionList = ref([
|
|||
content: [
|
||||
{
|
||||
txt: '新车注册登记',
|
||||
icon: '',
|
||||
icon: '../../../static/业务中心/1/1.png',
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
txt: '新车选号',
|
||||
icon: '',
|
||||
icon: '@/static/业务中心/1/2.png',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
txt: '在用车选号',
|
||||
icon: '',
|
||||
icon: '@/static/业务中心/1/3.png',
|
||||
id: 2
|
||||
},
|
||||
{
|
||||
txt: '号牌号段公布',
|
||||
icon: '',
|
||||
icon: '@/static/业务中心/1/4.png',
|
||||
id: 3
|
||||
},
|
||||
{
|
||||
txt: '备案非本人机动车',
|
||||
icon: '',
|
||||
icon: '@/static/业务中心/1/5.png',
|
||||
id: 4
|
||||
},
|
||||
{
|
||||
txt: '机动车转籍申请',
|
||||
icon: '',
|
||||
icon: '@/static/业务中心/1/6.png',
|
||||
id: 5
|
||||
},
|
||||
{
|
||||
txt: '异常选号资料修改',
|
||||
icon: '',
|
||||
icon: '@/static/业务中心/1/7.png',
|
||||
id: 6
|
||||
},
|
||||
{
|
||||
txt: '申请新车临时号牌',
|
||||
icon: '',
|
||||
icon: '@/static/业务中心/1/8.png',
|
||||
id: 7
|
||||
},
|
||||
{
|
||||
txt: '城市货车通行码申领',
|
||||
icon: '',
|
||||
icon: '@/static/业务中心/1/9.png',
|
||||
id: 8
|
||||
}
|
||||
]
|
||||
|
@ -266,7 +267,6 @@ const gotoBack = () => {
|
|||
.text {
|
||||
text-align: center;
|
||||
font-size: 0.5rem;
|
||||
margin-top: 0.4rem;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -217,7 +217,6 @@ onMounted(() => {
|
|||
|
||||
.content {
|
||||
width: 689rpx;
|
||||
height: 100%;
|
||||
padding: 20rpx 30rpx;
|
||||
background-color: #f4f3f8;
|
||||
|
||||
|
|
|
@ -14,10 +14,12 @@
|
|||
<view v-for="item in serve" :key="item.id" class="userlist">
|
||||
<view :class="{ active: item.id === 5 }">
|
||||
<view class="userlist-box">
|
||||
<view style="margin: 0 0.8rem"><uni-icons color="#c1c1c3" :type="item.icon" size="26"></uni-icons></view>
|
||||
<view style="margin: 0 0.8rem">
|
||||
<image :src="item.icon" :style="{ width: item.id == 0 ? '1.25rem' : '1.45rem', height: '1.45rem', transform: 'translateY(0.2rem)' }"></image>
|
||||
</view>
|
||||
<view class="userlist-box-text" :style="{ 'border-bottom': item.id == 5 || item.id == 4 ? 'node' : '1rpx solid #eee' }">
|
||||
<view>{{ item.text }}</view>
|
||||
<view style="margin-right: 0.7rem"><uni-icons color="#c1c1c3" type="forward" size="24"></uni-icons></view>
|
||||
<view :style="{ transform: item.id == 0 ? 'translateX(0.2rem)' : '' }">{{ item.text }}</view>
|
||||
<view style="margin-right: 0.7rem"><uni-icons color="#c1c1c3" type="forward" size="18"></uni-icons></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
@ -32,44 +34,44 @@ const { safeAreaInsets } = uni.getSystemInfoSync();
|
|||
const serve = ref([
|
||||
{
|
||||
text: '登录密码修改',
|
||||
icon: 'location-filled',
|
||||
icon: '../../../../static/我的设置/1.png',
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
text: '手势密码修改',
|
||||
icon: 'location-filled',
|
||||
icon: '../../../../static/我的设置/2.png',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
text: '删除帐号',
|
||||
icon: 'location-filled',
|
||||
icon: '../../../../static/我的设置/3.png',
|
||||
id: 2
|
||||
},
|
||||
{
|
||||
text: '帐号迁移',
|
||||
icon: 'heart-filled',
|
||||
user: '',
|
||||
icon: '../../../../static/我的设置/4.png',
|
||||
|
||||
id: 3
|
||||
},
|
||||
{
|
||||
text: '大字版',
|
||||
icon: 'heart-filled',
|
||||
user: '',
|
||||
icon: '../../../../static/我的设置/5.png',
|
||||
|
||||
id: 4
|
||||
},
|
||||
{
|
||||
text: '分享12123给好友',
|
||||
icon: 'heart-filled',
|
||||
icon: '../../../../static/我的设置/6.png',
|
||||
id: 5
|
||||
},
|
||||
{
|
||||
text: '清理缓存',
|
||||
icon: 'heart-filled',
|
||||
icon: '../../../../static/我的设置/7.png',
|
||||
id: 6
|
||||
},
|
||||
{
|
||||
text: '关于',
|
||||
icon: 'heart-filled',
|
||||
icon: '../../../../static/我的设置/8.png',
|
||||
id: 7
|
||||
}
|
||||
]);
|
||||
|
|
|
@ -15,12 +15,25 @@
|
|||
<view v-for="item in serve" :key="item.id" class="userlist">
|
||||
<view class="userlist-box">
|
||||
<view class="userlist-box-text">
|
||||
<view><uni-icons color="#1f579a" :type="item.icon" size="26"></uni-icons></view>
|
||||
<view>
|
||||
<!-- <uni-icons color="#1f579a" :type="item.icon" size="26"></uni-icons> -->
|
||||
<image
|
||||
:src="item.icon"
|
||||
:style="{
|
||||
width: item.id === 5 ? '1.5rem' : item.id === 4 ? '1.2rem' : item.id == 2 ? '1.4rem' : ' 1.45rem',
|
||||
height: item.id === 5 ? '1.4rem' : item.id == 2 ? '1.2rem' : ' 1.45rem',
|
||||
transform: item.id === 4 ? 'translate(0.15rem,0.15rem)' : 'translateY(0.15rem)'
|
||||
}"
|
||||
></image>
|
||||
</view>
|
||||
<view style="margin-left: 1rem">{{ item.text }}</view>
|
||||
</view>
|
||||
<view><uni-icons type="forward" color="#bfbfbf" size="24"></uni-icons></view>
|
||||
<view>
|
||||
<uni-icons style="margin-right: 0.8rem" fontFamily="CustomFont" color="#bfbfbf" size="16">{{ item.queenicon }}</uni-icons>
|
||||
</view>
|
||||
</view>
|
||||
<view style="width: 92%; border-bottom: 1rpx solid #e2e2e2; margin-left: 8%"></view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
@ -29,56 +42,67 @@ import { ref } from 'vue';
|
|||
const serve = ref([
|
||||
{
|
||||
text: '实人认证',
|
||||
icon: 'location-filled',
|
||||
icon: '../../static/我的/1.png',
|
||||
queenicon: '',
|
||||
user: '',
|
||||
id: 0
|
||||
},
|
||||
{
|
||||
text: '我的证件',
|
||||
icon: 'location-filled',
|
||||
icon: '../../static/我的/2.png',
|
||||
queenicon: '',
|
||||
user: '',
|
||||
id: 1
|
||||
},
|
||||
{
|
||||
text: '证件号码',
|
||||
icon: 'spinner-cycle',
|
||||
icon: '../../static/我的/3.png',
|
||||
queenicon: '',
|
||||
user: '',
|
||||
id: 2
|
||||
},
|
||||
{
|
||||
text: '有效期限',
|
||||
icon: 'star-filled',
|
||||
icon: '../../static/我的/4.png',
|
||||
queenicon: '\ue612',
|
||||
user: '',
|
||||
id: 3
|
||||
},
|
||||
{
|
||||
text: '手机号码',
|
||||
icon: 'star-filled',
|
||||
icon: '../../static/我的/5.png',
|
||||
queenicon: '\ue612',
|
||||
user: '',
|
||||
id: 4
|
||||
},
|
||||
{
|
||||
text: '邮寄地址',
|
||||
icon: 'refresh-filled',
|
||||
icon: '../../static/我的/6.png',
|
||||
queenicon: '\ue612',
|
||||
id: 5
|
||||
},
|
||||
{
|
||||
text: '电子文书',
|
||||
icon: 'refresh-filled',
|
||||
icon: '../../static/我的/7.png',
|
||||
queenicon: '\ue612',
|
||||
id: 6
|
||||
},
|
||||
{
|
||||
text: '信息申诉',
|
||||
icon: 'refresh-filled',
|
||||
icon: '../../static/我的/8.png',
|
||||
queenicon: '\ue612',
|
||||
id: 7
|
||||
},
|
||||
{
|
||||
text: '交管小安',
|
||||
icon: 'refresh-filled',
|
||||
icon: '',
|
||||
queenicon: '\ue612',
|
||||
id: 8
|
||||
},
|
||||
{
|
||||
text: '咨询反馈',
|
||||
icon: 'refresh-filled',
|
||||
icon: '../../static/我的/10.png',
|
||||
queenicon: '\ue612',
|
||||
id: 9
|
||||
}
|
||||
]);
|
||||
|
@ -90,7 +114,11 @@ const set = () => {
|
|||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
<style lang="scss">
|
||||
@font-face {
|
||||
font-family: CustomFont;
|
||||
src: url('../../static/我的/iconfont.ttf');
|
||||
}
|
||||
.user {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
@ -113,8 +141,7 @@ const set = () => {
|
|||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 1rem 0;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
padding: 0.8rem 0;
|
||||
.userlist-box-text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
|
@ -15,10 +15,30 @@
|
|||
<view :style="{ left: cursorPosition + 'px' }" class="custom-tabs-cursor"></view>
|
||||
</view>
|
||||
<view class="content-area">
|
||||
<view v-if="tabIndex === 0">暂无数据</view>
|
||||
<view v-else-if="tabIndex === 1">暂无数据</view>
|
||||
<view v-else-if="tabIndex === 2">暂无数据</view>
|
||||
<view v-else-if="tabIndex === 3">暂无数据</view>
|
||||
<view v-if="tabIndex === 0">
|
||||
<view class="noData">
|
||||
<image src="../../static/网办进度/oe.png" style="width: 7.8rem; height: 5rem"></image>
|
||||
<view style="font-size: 0.75rem; margin-top: 0.5rem; color: #767676">暂无数据</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else-if="tabIndex === 1">
|
||||
<view class="noData">
|
||||
<image src="../../static/网办进度/oe.png" style="width: 7.8rem; height: 5rem"></image>
|
||||
<view style="font-size: 0.75rem; margin-top: 0.5rem; color: #767676">暂无数据</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else-if="tabIndex === 2">
|
||||
<view class="noData">
|
||||
<image src="../../static/网办进度/oe.png" style="width: 7.8rem; height: 5rem"></image>
|
||||
<view style="font-size: 0.75rem; margin-top: 0.5rem; color: #767676">暂无数据</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else-if="tabIndex === 3">
|
||||
<view class="noData">
|
||||
<image src="../../static/网办进度/oe.png" style="width: 7.8rem; height: 5rem"></image>
|
||||
<view style="font-size: 0.75rem; margin-top: 0.5rem; color: #767676">暂无数据</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
@ -43,7 +63,7 @@ const cursorPosition = computed(() => {
|
|||
if (tabbarRect.value.length === 0) return;
|
||||
// 获取tabbar的宽度和left的值
|
||||
const { width, left } = tabbarRect.value[tabIndex.value];
|
||||
return (width - 80) / 2 + left;
|
||||
return (width - 76) / 2 + left;
|
||||
});
|
||||
onMounted(() => {
|
||||
// 1. 创建查询器
|
||||
|
@ -119,4 +139,11 @@ function onTabChange(index, item) {
|
|||
transition: all 0.3s ease-out;
|
||||
}
|
||||
}
|
||||
.noData {
|
||||
height: 70vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
</style>
|
||||
|
|
BIN
static/业务中心/1/1.png
Normal file
After Width: | Height: | Size: 9.6 KiB |
BIN
static/业务中心/1/2.png
Normal file
After Width: | Height: | Size: 3.5 KiB |
BIN
static/业务中心/1/3.png
Normal file
After Width: | Height: | Size: 3.4 KiB |
BIN
static/业务中心/1/5.png
Normal file
After Width: | Height: | Size: 2.9 KiB |
BIN
static/业务中心/1/7.png
Normal file
After Width: | Height: | Size: 3.3 KiB |
BIN
static/业务中心/1/8.png
Normal file
After Width: | Height: | Size: 3.7 KiB |
BIN
static/业务中心/1/9.png
Normal file
After Width: | Height: | Size: 3.0 KiB |
BIN
static/业务中心/2/1.png
Normal file
After Width: | Height: | Size: 2.9 KiB |
BIN
static/业务中心/2/2.png
Normal file
After Width: | Height: | Size: 2.9 KiB |
BIN
static/业务中心/2/3.png
Normal file
After Width: | Height: | Size: 3.0 KiB |
BIN
static/业务中心/2/4.png
Normal file
After Width: | Height: | Size: 3.1 KiB |
BIN
static/业务中心/2/5.png
Normal file
After Width: | Height: | Size: 2.6 KiB |
BIN
static/业务中心/2/6.png
Normal file
After Width: | Height: | Size: 3.2 KiB |
BIN
static/业务中心/3/1.png
Normal file
After Width: | Height: | Size: 3.3 KiB |
BIN
static/业务中心/3/2.png
Normal file
After Width: | Height: | Size: 2.9 KiB |
BIN
static/业务中心/4/1.png
Normal file
After Width: | Height: | Size: 3.6 KiB |
BIN
static/业务中心/4/2.png
Normal file
After Width: | Height: | Size: 3.1 KiB |
BIN
static/业务中心/4/3.png
Normal file
After Width: | Height: | Size: 3.3 KiB |
BIN
static/业务中心/4/5.png
Normal file
After Width: | Height: | Size: 2.9 KiB |
BIN
static/业务中心/5/1.png
Normal file
After Width: | Height: | Size: 2.9 KiB |
BIN
static/业务中心/5/2.png
Normal file
After Width: | Height: | Size: 3.2 KiB |
BIN
static/业务中心/5/3.png
Normal file
After Width: | Height: | Size: 2.9 KiB |
BIN
static/业务中心/5/4.png
Normal file
After Width: | Height: | Size: 2.9 KiB |
BIN
static/业务中心/6/1.png
Normal file
After Width: | Height: | Size: 3.5 KiB |
BIN
static/业务中心/6/2.png
Normal file
After Width: | Height: | Size: 2.5 KiB |
BIN
static/业务中心/6/3.png
Normal file
After Width: | Height: | Size: 2.7 KiB |
BIN
static/业务中心/6/4.png
Normal file
After Width: | Height: | Size: 2.7 KiB |
BIN
static/我的/1.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
static/我的/10.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
BIN
static/我的/2.png
Normal file
After Width: | Height: | Size: 1.2 KiB |
BIN
static/我的/3.png
Normal file
After Width: | Height: | Size: 1.1 KiB |
BIN
static/我的/4.png
Normal file
After Width: | Height: | Size: 1.3 KiB |
BIN
static/我的/5.png
Normal file
After Width: | Height: | Size: 412 B |
BIN
static/我的/6.png
Normal file
After Width: | Height: | Size: 802 B |
BIN
static/我的/7.png
Normal file
After Width: | Height: | Size: 776 B |
BIN
static/我的/8.png
Normal file
After Width: | Height: | Size: 1015 B |
BIN
static/我的/9.png
Normal file
After Width: | Height: | Size: 5.0 KiB |
BIN
static/我的/iconfont.ttf
Normal file
BIN
static/我的设置/1.png
Normal file
After Width: | Height: | Size: 863 B |
BIN
static/我的设置/2.png
Normal file
After Width: | Height: | Size: 1.4 KiB |
BIN
static/我的设置/3.png
Normal file
After Width: | Height: | Size: 1.7 KiB |
BIN
static/我的设置/4.png
Normal file
After Width: | Height: | Size: 1.6 KiB |
BIN
static/我的设置/5.png
Normal file
After Width: | Height: | Size: 2.1 KiB |
BIN
static/我的设置/6.png
Normal file
After Width: | Height: | Size: 633 B |
BIN
static/我的设置/7.png
Normal file
After Width: | Height: | Size: 665 B |
BIN
static/我的设置/8.png
Normal file
After Width: | Height: | Size: 1.9 KiB |
BIN
static/网办进度/oe.png
Normal file
After Width: | Height: | Size: 12 KiB |