suojin
/
hitap-chat
22
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

init

Browse Source
main
ethan 2 years ago
parent ec4e01ee5e
commit 0b1c126fbf
19 changed files with 1632 additions and 184 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      src/App.vue
  2. 765
      src/common/css.css
  3. 58
      src/components/no-data/index.vue
  4. 340
      src/pages/home/indexOrigin.vue
  5. 430
      src/pages/investigation/index.vue
  6. 222
      src/pages/investigation/indexOrigin.vue
  7. BIN
      src/static/image/mine/chat.png
  8. BIN
      src/static/image/mine/insurance.png
  9. BIN
      src/static/image/mine/insuranceBG.png
  10. BIN
      src/static/image/mine/jobfind.png
  11. BIN
      src/static/image/mine/lean.png
  12. BIN
      src/static/image/mine/mineBG.png
  13. BIN
      src/static/image/mine/plus.png
  14. BIN
      src/static/image/mine/review.png
  15. BIN
      src/static/image/mine/search.png
  16. BIN
      src/static/image/mine/setting.png
  17. BIN
      src/static/image/mine/train.png
  18. BIN
      src/static/image/mine/userinfo.png
  19. BIN
      src/static/image/nodata1.png

1
src/App.vue
Unescape View File

@ -59,6 +59,7 @@
<style lang="scss">
@import '@/uni_modules/uni-scss/index.scss';
@import "./common/css.css";
/* #ifndef APP-PLUS-NVUE */
/* uni.css - 通用组件、模板样式库，可以当作一套ui库应用 */
@import './common/uni.css';

765
src/common/css.css
Unescape View File

@ -0,0 +1,765 @@
/* 所有页面的背景色 */
html{
/* 网页全部设置灰色 */
/*-webkit-filter: grayscale(100%);*/
/*filter: grayscale(100%);*/
}
body {
/* background: #F6F8FA; */
}
image {
display: block;
}
button{ line-height: 100%;}
uni-button:after{
border: none!important;
}
input{
background-color: transparent;
border: none;
}
input,textarea,button{
outline: none;
}
.BorderBox {
box-sizing: border-box;
}
/*公共样式*/
/*宽度*/
.Width100{
width: 100%!important;
}
.Width98{
width: 98%!important;
}
.Width95{
width: 95%;
}
.Width92{
width: 92%;
}
.Width90{
width: 90%;
}
.Width88{
width: 88%;
}
.Width85{
width: 85%;
}
.Width80{
width: 80%;
}
.Width70{
width: 70%;
}
.Width50{
width: 50%;
}
/*高度*/
.Height100{
height: 100% !important;
}
/*返回图片*/
.Width_100rpx{
width: 100rpx;
}
/*过渡*/
.Transition_100ms{
transition: all 100ms linear;
}
.Transition_200ms{
transition: all 200ms linear;
}
/*字体颜色*/
.Color_FFFFFF{
color: #FFFFFF;
}
.Color_95CDFD{
color: #95CDFD;
}
.Color_000000{
color: #000000;
}
.Color_605F72{
color: #605F72;
}
.Color_DF5F58{
color: #DF5F58;
}
.Color_0B256E{
color: #0B256E;
}
.Color_333333{
color: #333333;
}
.Color_999999{
color: #999999;
}
.Color_B4BAC9{
color: #B4BAC9;
}
.Color_1A1F39{
color: #1A1F39;
}
.Color_F99E00{
color: #F99E00;
}
.Color_F79E2C{
color: #F79E2C;
}
.Color_191F3B{
color: #191F3B;
}
.Color_333333{
color: #333333;
}
.Color_0064FF{
color: #0064FF;
}
.Color_FF3B30{
color: #FF3B30;
}
.Color_FF0000{
color: #FF0000;
}
/*子级居中*/
.AlignSelf_Center{
align-self: center;
}
/*文字超出省略号-单行*/
.TextHidden{
overflow: hidden;/*超出部分隐藏*/
text-overflow:ellipsis;/* 超出部分显示省略号 */
white-space: nowrap;/*规定段落中的文本不进行换行 */
}
/*背景色*/
.BG_FFFFFF{
background-color: #FFFFFF;
}
.BG_EDEDED{
background-color: #EDEDED;
}
.BG_F6F7FB{
background-color: #F6F7FB;
}
.BG_000000{
background-color: #000000;
}
.BG_0064FF{
background-color: #0064FF;
}
.BG_CCE0FF{
background-color: #CCE0FF;
}
.BG_T{
background-color: transparent!important;
}
/*模块通用投影*/
.BoxS_Module{
box-shadow: 0rpx 0rpx 26rpx 0rpx rgba(127, 127, 127, 0.1);
}
.BorderNone{
border: none;
}
/*圆角*/
.BorderR_6rpx{
border-radius: 6rpx;
}
.BorderR_10rpx{
border-radius: 10rpx;
}
.BorderR_8rpx{
border-radius: 8rpx;
}
.BorderR_12rpx{
border-radius: 12rpx;
}
.BorderR_14rpx{
border-radius: 14rpx;
}
.BorderR_16rpx{
border-radius: 16rpx;
}
.BorderR_18rpx{
border-radius: 18rpx;
}
.BorderR_20rpx{
border-radius: 20rpx;
}
.BorderR_30rpx{
border-radius: 30rpx;
}
.BorderR_50{
border-radius:50%;
}
/*块级居中*/
.MarginAuto{
margin: 0 auto;
}
/*定位居中*/
.PositionCenter{
left: 50%;
top: 50%;
transform: translate(-50%,-50%);
}
/*块级*/
.Block{
display: block;
}
/*隐藏*/
.None{
display: none;
}
/*内联块级*/
.InlineBlock{
display: inline-block;
}
/*弹性布局*/
.Flex{
display: flex;
}
/*布局1-垂直居中-靠两边平均分散*/
.Flex_C_S-B{
align-items: center;
justify-content: space-between;
}
.Flex_C_S-BET{
justify-content: space-between;
}
/*布局1-垂直居中-空两边平均分散*/
.Flex_C_S-A{
align-items: center;
justify-content: space-around;
}
/*布局1-垂直居中*/
.Flex_C_S-Center{
align-items: center;
}
/*换行*/
.Flex_Warp{
flex-wrap: wrap;
}
/*英文换行*/
.Warp_E{
word-break:break-all;
}
/*文字分散*/
.TextJ{
text-align-last: justify;
text-align: justify;
}
/*文字透明度*/
.TextOP028{
color: rgba(0,0,0,0.28);
}
.TextOP03{
color: rgba(0,0,0,0.3);
}
.TextOP04{
color: rgba(0,0,0,0.4);
}
.TextOP05{
color: rgba(0,0,0,0.5);
}
.TextOP06{
color: rgba(0,0,0,0.6);
}
.TextOP07{
color: rgba(0,0,0,0.7);
}
.TextOP085{
color: rgba(0,0,0,0.85);
}
.TextOP1{
color: rgba(0,0,0,1);
}
/*纵向滚动*/
.OverF_Y_A{
overflow-y: auto;
}
/*隐藏*/
.OverH{
overflow: hidden;
}
/*相对定位*/
.PositionR{
position: relative;
}
/*绝对定位*/
.PositionA{
position: absolute;
}
/*文字下划线*/
.TextLine{
text-decoration: underline;
}
/*文本居中*/
.TextCenter{
text-align: center;
}
.TextRight{
text-align: right;
}
.TextLeft{
text-align: left;
}
/*字体缩进*/
.TextIndent_1em{
text-indent: 1em;
}
.TextIndent_2em{
text-indent: 2em;
}
/*全部换行*/
.WordWarpAll{
word-break: break-all;
}
/*字体间距*/
.FontSpace_2rpx{
letter-spacing: 4rpx;
}
/*左边外间距*/
.MarginL_5rpx{
margin-left: 5rpx;
}
.MarginL_8rpx{
margin-left: 8rpx;
}
.MarginL_10rpx{
margin-left: 10rpx;
}
.MarginL_14rpx{
margin-left: 14rpx;
}
.MarginL_15rpx{
margin-left: 15rpx;
}
.MarginL_20rpx{
margin-left: 20rpx;
}
.MarginL_24rpx{
margin-left: 24rpx;
}
.MarginL_28rpx{
margin-left: 28rpx;
}
.MarginL_30rpx{
margin-left: 30rpx;
}
.MarginL_32rpx{
margin-left: 32rpx;
}
.MarginL_36rpx{
margin-left: 36rpx;
}
.MarginL_40rpx{
margin-left: 40rpx;
}
.MarginL_50rpx{
margin-left: 50rpx;
}
.MarginL_60rpx{
margin-left: 60rpx;
}
.MarginL_82rpx{
margin-left: 82rpx;
}
.MarginL_100rpx{
margin-left: 100rpx;
}
.MarginL_160rpx{
margin-left: 160rpx;
}
/*右边外间距*/
.MarginR_10rpx{
margin-right: 10rpx;
}
.MarginR_15rpx{
margin-right: 15rpx;
}
.MarginR_20rpx{
margin-right: 20rpx;
}
.MarginR_30rpx{
margin-right: 30rpx;
}
.MarginR_32rpx{
margin-right: 32rpx;
}
.MarginR_40rpx{
margin-right: 40rpx;
}
.MarginR_50rpx{
margin-right: 50rpx;
}
.MarginR_60rpx{
margin-right: 60rpx;
}
.MarginR_70rpx{
margin-right: 70rpx;
}
/*顶部外间距*/
.MarginT_2rpx{
margin-top: 2rpx;
}
.MarginT_5rpx{
margin-top: 5rpx;
}
.MarginT_6rpx{
margin-top: 6rpx;
}
.MarginT_7rpx{
margin-top: 7rpx;
}
.MarginT_8rpx{
margin-top: 8rpx;
}
.MarginT_10rpx{
margin-top: 10rpx;
}
.MarginT_12rpx{
margin-top: 12rpx;
}
.MarginT_15rpx{
margin-top: 15rpx;
}
.MarginT_16rpx{
margin-top: 16rpx;
}
.MarginT_18rpx{
margin-top: 18rpx;
}
.MarginT_20rpx{
margin-top: 20rpx;
}
.MarginT_25rpx{
margin-top: 25rpx;
}
.MarginT_26rpx{
margin-top: 26rpx;
}
.MarginT_27rpx{
margin-top: 27rpx;
}
.MarginT_30rpx{
margin-top: 30rpx;
}
.MarginT_32rpx{
margin-top: 32rpx;
}
.MarginT_35rpx{
margin-top: 35rpx;
}
.MarginT_40rpx{
margin-top: 40rpx;
}
.MarginT_42rpx{
margin-top: 42rpx;
}
.MarginT_46rpx{
margin-top: 46rpx;
}
.MarginT_50rpx{
margin-top: 50rpx;
}
.MarginT_55rpx{
margin-top: 55rpx;
}
.MarginT_60rpx{
margin-top: 60rpx;
}
.MarginT_70rpx{
margin-top: 70rpx;
}
.MarginT_75rpx{
margin-top: 75rpx;
}
.MarginT_80rpx{
margin-top: 80rpx;
}
.MarginT_88rpx{
margin-top: 88rpx;
}
.MarginT_90rpx{
margin-top: 90rpx;
}
.MarginT_100rpx{
margin-top: 100rpx;
}
.MarginT_98rpx{
margin-top: 98rpx;
}
.MarginT_120rpx{
margin-top: 120rpx;
}
.MarginT_160rpx{
margin-top: 160rpx;
}
.MarginT_200rpx{
margin-top: 200rpx;
}
.MarginT_260rpx{
margin-top: 260rpx;
}
.MarginT_310rpx{
margin-top: 310rpx;
}
/*底部外间距*/
.MarginB_30rpx{
margin-bottom: 30rpx;
}
/*内间距-上*/
.PaddingT_1rpx{
padding-top: 1rpx;
}
.PaddingT_10rpx{
padding-top: 10rpx;
}
.PaddingT_20rpx{
padding-top: 20rpx;
}
.PaddingT_24rpx{
padding-top: 24rpx;
}
.PaddingT_28rpx{
padding-top: 28rpx;
}
.PaddingT_30rpx{
padding-top: 30rpx;
}
.PaddingT_32rpx{
padding-top: 32rpx;
}
.PaddingT_34rpx{
padding-top: 34rpx;
}
.PaddingT_36rpx{
padding-top: 36rpx;
}
.PaddingT_40rpx{
padding-top: 40rpx;
}
.PaddingT_44rpx{
padding-top: 44rpx;
}
.PaddingT_50rpx{
padding-top: 50rpx;
}
.PaddingT_80rpx{
padding-top: 80rpx;
}
/*内间距-下*/
.PaddingB_10rpx{
padding-bottom: 10rpx;
}
.PaddingB_14rpx{
padding-bottom: 14rpx;
}
.PaddingB_16rpx{
padding-bottom: 16rpx;
}
.PaddingB_20rpx{
padding-bottom: 20rpx;
}
.PaddingB_24rpx{
padding-bottom: 24rpx;
}
.PaddingB_28rpx{
padding-bottom: 28rpx;
}
.PaddingB_30rpx{
padding-bottom: 30rpx;
}
.PaddingB_32rpx{
padding-bottom: 32rpx;
}
.PaddingB_36rpx{
padding-bottom: 36rpx;
}
.PaddingB_40rpx{
padding-bottom: 40rpx;
}
.PaddingB_44rpx{
padding-bottom: 44rpx;
}
.PaddingB_50rpx{
padding-bottom: 50rpx;
}
.PaddingB_60rpx{
padding-bottom: 60rpx;
}
.PaddingB_80rpx{
padding-bottom: 80rpx;
}
.PaddingB_200rpx{
padding-bottom: 200rpx;
}
/*内间距-左*/
.PaddingL_10rpx{
padding-left: 10rpx;
}
.PaddingL_20rpx{
padding-left: 20rpx;
}
.PaddingL_30rpx{
padding-left: 30rpx;
}
/*内间距-右*/
.PaddingR_10rpx{
padding-right: 10rpx;
}
.PaddingR_20rpx{
padding-right: 20rpx;
}
.PaddingR_30rpx{
padding-right: 30rpx;
}
/*全边框*/
.BorderA_1px_999999{
border: 1px solid #999999;
}
.BorderA_1px_DDDBDB{
border: 1px solid #DDDBDB;
}
.BorderA_1px_F2F2F2{
border: 1px solid #F2F2F2;
}
/*透明全边框-用来解决边距联动问题*/
.BorderT{
border: 1px solid transparent;
}
/*下边框*/
.BorderB_1px_E5E5E5{
border-bottom: 1px solid #E5E5E5;
}
.BorderB_1px_E1E1E1{
border-bottom: 1px solid #E1E1E1;
}
.BorderB_1px_F6F5F5{
border-bottom: 1px solid #F6F5F5;
}
/*顶边框*/
.BorderT_1px_E1E1E1{
border-top: 1px solid #E1E1E1;
}
/*右边框*/
.BorderR_1px_F6F6F6{
border-right: 1px solid #F6F6F6;
}
/*字体大小*/
.FontS_14rpx{
font-size: 14rpx;
}
.FontS_16rpx{
font-size: 16rpx;
}
.FontS_18rpx{
font-size: 18rpx;
}
.FontS_20rpx{
font-size: 20rpx;
}
.FontS_22rpx{
font-size: 22rpx;
}
.FontS_24rpx{
font-size: 24rpx;
}
.FontS_26rpx{
font-size: 26rpx;
}
.FontS_28rpx{
font-size: 28rpx;
}
.FontS_30rpx{
font-size: 30rpx;
}
.FontS_32rpx{
font-size: 32rpx;
}
.FontS_34rpx{
font-size: 34rpx;
}
.FontS_36rpx{
font-size: 36rpx;
}
.FontS_38rpx{
font-size: 38rpx;
}
.FontS_40rpx{
font-size: 40rpx;
}
.FontS_42rpx{
font-size: 42rpx;
}
.FontS_44rpx{
font-size: 44rpx;
}
.FontS_46rpx{
font-size: 46rpx;
}
.FontS_48rpx{
font-size: 48rpx;
}
.FontS_50rpx{
font-size: 50rpx;
}
.FontS_56rpx{
font-size: 56rpx;
}
.FontS_60rpx{
font-size: 60rpx;
}
/*字体加粗*/
.FontBold{
font-weight: bold;
}
.FontNormal{
font-weight: normal;
}
/*文字单行超出省略号*/
.Text_Omit_2{
overflow: hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
/*浮动*/
.FloatL{
/*左浮动*/
float: left;
}
.FloatR{
/*右浮动*/
float: right;
}
/*清除浮动*/
.ClearB{
clear: both;
}
/*内边框*/
.InsideB{
box-sizing: border-box;
}
/*通用按钮样式1*/
.BtnAll1{
height: 90rpx;
line-height: 90rpx;
}
.BtnAll2{
height: 70rpx;
line-height: 70rpx;
}

58
src/components/no-data/index.vue
Unescape View File

@ -0,0 +1,58 @@
<template>
<!--顶部-->
<view class="Width100">
<image :src="'../../static/image/nodate1.png'" mode="aspectFit" class="Img Block" :style="'margin-top:' + marginTop + 'rpx;'"></image>
<text class="Block TextCenter FontS_26rpx Color_B4BAC9 MarginT_20rpx">{{text}}</text>
</view>
</template>
<script>
export default {
name: "no-data",
props: {
marginTop:{
type:Number,
default:300
},
text:{
type:String,
default:'暂无数据'
}
},
data() {
return {
navHeight:88,
topHeight:0,
$:this.$,
}
},
mounted(){
},
computed:{
},
methods: {
// 获取url
getCurPage() {
let pages = getCurrentPages();
let curPage = pages[pages.length - 1];
return curPage
},
// 返回
backPage(){
this.$emit('backPage')
},
// 跳转页面
skipPage(item) {
this.$emit('skipPage', item.pageUrl)
},
},
}
</script>
<style scoped lang="scss">
.Img{
width: 512rpx;
height: 440rpx;
margin: 0 auto;
}
</style>

340
src/pages/home/indexOrigin.vue
Unescape View File

@ -0,0 +1,340 @@
<template>
<view class="home">
<!-- <page-head title="待排查任务" :warnNum='1' :isFixed="true" :isRight="true"></page-head> -->
<!-- 轮播图 -->
<view class="swiper-container">
<swiper :indicator-dots="true" :autoplay="true" :interval="4000" :duration="500">
<swiper-item v-for="(item, index) in swiperList" :key="index">
<image :src="item.imgurl" class="swiper-image"></image>
</swiper-item>
</swiper>
</view>
<view class="data">
<view class="left">
<image src="/static/home/pend.png" mode="" class="pend"></image>
</view>
<view class="right">
<view class="imgBox">
<image src="/static/home/month.png" mode="" class="img" ></image>
</view>
<view class="imgBox">
<image src="/static/home/finish.png" mode="" class="img"></image>
</view>
</view>
</view>
<view class="knowContent" @click="goToKnowledge">
<image src="/static/know.png" mode="" class="know"></image>
</view>
<view class="pendding">
待办任务
</view>
<view class="ListBox">
<view class="ListItem" v-for="(item,index) in data" @click="handleDetail(item)">
<view class="isTime" :style="{ backgroundColor: item.isTime == 0 ? '#cc2936' : '#e68a0b' }">{{item.isTime==0?'超期':'临期'}} </view>
<image :src="item.imgurl" mode="" class="car"></image>
<view class="textBox">
<view class="toptext">
{{item.title}}
</view>
<view class="bottomText">
<text class="paicha">{{item.paicha}} </text>
<text>{{item.createTime}}</text>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
title: '下拉刷新 + 加载更多',
data: [{ //window.PCRWList ||
id: 12121212,
title: 'G228火炬路与S503岙东路',
roadCode: 123,
roadName: 'G228火炬路与S503岙东路',
imgurl: '/static/car.png',
createTime: '超期2天', //2024-10-05
deptName: '支队级',
sessionId: 12121212,
paicha:"排查",
isTime:0
},
{ //window.PCRWList ||
id: 37020017407,
title: '金水路与合川路事故多发点段',
roadCode: 123,
roadName: '金水路与合川路',
imgurl: '/static/car.png',
createTime: '剩余2天',
deptName: '支队级',
sessionId: 37020017407,
paicha:"排查",
isTime:1
},
{
id: 37020017404,
title: '金水路与合川路事故多发点段',
roadCode: 123,
roadName: '金水路与合川路',
imgurl: '/static/car.png',
createTime: '超期2天',
deptName: '支队级',
sessionId: 37020017404,
paicha:"排查",
isTime:1
},
],
loadMoreText: "加载中...",
showLoadMore: false,
max: 0,
swiperList: [{
imgurl: '/static/banner/1.jpg'
},
{
imgurl: '/static/banner/2.jpg'
},
{
imgurl: '/static/banner/3.jpg'
},
{
imgurl: '/static/banner/4.jpg'
}
]
}
},
onLoad() {
this.initData();
},
onUnload() {
// this.max = 0,
// this.data = [],
// this.loadMoreText = "加载更多",
// this.showLoadMore = false;
},
onReachBottom() {
// console.log("onReachBottom");
// if (this.max > 40) {
// this.loadMoreText = "没有更多数据了!"
// return;
// }
// this.showLoadMore = true;
// setTimeout(() => {
// this.setListData();
// }, 300);
},
onPullDownRefresh() {
console.log('onPullDownRefresh');
this.initData();
},
methods: {
goToKnowledge() {
uni.navigateTo({
url: '/pages/home/knowledge'
})
},
initData() {
// setTimeout(() => {
// this.max = 0;
// this.data = [];
// let data = [];
// this.max += 20;
// for (var i = this.max - 19; i < this.max + 1; i++) {
// data.push(i)
// }
// this.data = this.data.concat(data);
// uni.stopPullDownRefresh();
// }, 300);
},
setListData() {
// let data = [];
// this.max += 10;
// for (var i = this.max - 9; i < this.max + 1; i++) {
// data.push(i)
// }
// this.data = this.data.concat(data);
},
// 跳转到详情页
handleDetail(item) {
this.$store.commit('setItemMessage', item)
uni.navigateTo({
// url: `/pages/home/detail?params=${encodeURIComponent(JSON.stringify(item))}`
url: '/pages/home/detail'
})
}
}
}
</script>
<style scoped lang="scss">
.home {
width: 100%;
.data{
display:flex;
background-color: #e6ecf4;
height:300rpx;
padding:10rpx 10rpx 20rpx 10px;
.left{
flex:1;
height: 300rpx;
.pend{
width:100%;
height:300rpx;
border-radius:10rpx;
over-flow:hidden;
// margin:0 5rpx;
}
}
.right{
flex:1;
display:flex;
flex-direction: column;
justify-content: space-between;
.imgBox{
width: 100%;
height:100%;
.img{
margin:0 5rpx;
height:140rpx;
width: 100%;
border-radius:10rpx;
over-flow:hidden;
}
}
}
}
.knowContent{
height:268rpx;
// width: 100%;
padding:0 10rpx;
background-color: #e6ecf4;
.know{
width:100%;
height:220rpx;
border-radius:20rpx;
overflow: hidden;
}
}
.pendding {
// margin:30rpx 0 ;
font-size: 40rpx;
height:85rpx;
line-height: 85rpx;
padding-left:20rpx;
background-color: #e6ecf4;
}
.ListBox{
background-color: #e6ecf4;
.ListItem{
height:180rpx;
background-color: #fff;
display:flex;
margin:13rpx 0;
align-items:center;
padding:20rpx;
position:relative;
.isTime{
position:absolute;
right:0;
top:-5rpx;
width: 100rpx;
height:45rpx;
color:#fff;
display: flex;
justify-content: center;
font-size:32rpx
// background-color: #fff;
}
.car{
width: 200rpx;
height:160rpx
}
.textBox{
padding-left:30rpx;
.toptext{
font-size:35rpx;
font-weight:600;
margin-bottom:20rpx
}
.bottomText{
.paicha{
margin-right:30rpx
}
}
}
}
}
.imgleft {
width: 80rpx;
margin-right: 20rpx;
max-height: 100%;
}
.swiper-container {
width: 100%;
// height: 300rpx; //
// margin-top: 20rpx; //
// background-color: #2663bf
}
.swiper-image {
width: 100%;
height: 300rpx;
// object-fit: cover;
}
.uni-padding-wrap {
height: 60vh;
.uni-list-item{
margin:20px 0;
height:190rpx
}
}
.content {
flex: 1;
display: flex;
flex-direction: column;
.title {
font-size: 32rpx;
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.bottom {
display: flex;
.text {
margin-right: 20rpx;
}
}
}
.right {
height: 100%;
display: flex;
align-items: center;
margin-left: 10px;
.btn {
width: 120rpx;
height: 70rpx;
line-height: 70rpx;
font-size: 28rpx;
}
}
}
</style>

430
src/pages/investigation/index.vue
Unescape View File

@ -1,222 +1,284 @@
<template>
<view class="investigation">
<!-- 排查 -->
<headerNavBar title="排查" :isBack="false"></headerNavBar>
<view class="tabs">
<view class="tab" @tap="switchTab(0)" :class="{active: currentTab === 0}">代办（{{ todoCount }}）</view>
<view class="tab" @tap="switchTab(1)" :class="{active: currentTab === 1}">正在办理（{{ processingCount }}）</view>
<view class="tab" @tap="switchTab(2)" :class="{active: currentTab === 2}">已完成（{{ completedCount }}）</view>
</view>
<view class="contentBox">
<!-- 代办内容 -->
<view class="uni-padding-wrap uni-common-mt">
<view class="text" v-for="(item,index) in data" :key="item.id+index">
<uni-list-item>
<template v-slot:header>
<view class="slot-box">
<image class="imgleft" :src="item.imgurl" mode="widthFix"></image>
</view>
</template>
<template v-slot:body>
<view class="content">
<text class="title">{{item.title}}</text>
<view class="bottom">
<text class="text">{{item.createTime}}</text>
<text class="text">{{item.deptName}}</text>
</view>
</view>
</template>
<template v-slot:footer>
<view class="right">
<button class="btn" @click="handleDetail(item)" type="primary">排查</button>
<view id="page">
<headerNavBar title="排查" :isBack="false">
<template slot='right'>
<image :src="'../../static/image/mine/search.png'" mode="aspectFit" class="InlineBlock img"></image>
<image :src="'../../static/image/mine/plus.png'" mode="aspectFit" class="InlineBlock img"></image>
</template>
</headerNavBar>
<view class="Width100 Box BorderBox">
<view class="tab">
<view class="tab-item" :class="tab === 1 ? 'active' : ''" @click='tab = 1'>
<text>待办</text>
<text>200</text>
</view>
<view class="tab-item" :class="tab === 2 ? 'active' : ''" @click='tab = 2'>
<text>正在办理</text>
<text>480</text>
</view>
<view class="tab-item" :class="tab === 3 ? 'active' : ''" @click='tab = 3'>
<text>已完成</text>
<text>182</text>
</view>
</view>
<view class="Content MarginAuto BorderBox">
<no-data v-if="isEmpty" />
<view v-else class="List Width100 BorderBox">
<view class="Unit FontBold BorderBox Width100 MarginT_30rpx BG_FFFFFF"
v-for="item in list" :key='item.id' @click='handleClick(item)'>
<image class="imgleft" :src="item.imgurl" mode="widthFix"></image>
<view class="right">
<view class="title">{{ item.title }}</view>
<view class="type">
<text>排查</text>
<text>超期2天</text>
</view>
</template>
</uni-list-item>
</view>
<view class="trapezoidal">
超期
</view>
</view>
</view>
<view class="uni-loadmore" v-if="showLoadMore">{{loadMoreText}}</view>
</view>
</view>
<!-- <view class="content" v-if="currentTab === 1">
</view>
<view class="content" v-if="currentTab === 2">
</view> -->
</view>
</template>
<script>
import NoData from "../../components/no-data/index.vue";
export default {
// 组件
components: {
NoData
},
data() {
return {
currentTab: 0, // 当前选中的 Tab，0: 代办, 1: 正在办理, 2: 已完成
todoCount: 0, // 代办数量
processingCount: 0, // 正在办理数量
completedCount: 0, // 已完成数量
data:window.PCRWList || [{
id: 12121212,
title: 'G228火炬路与S503岙东路',
roadCode: 123,
roadName: 'G228火炬路与S503岙东路',
imgurl: '/static/imge.png',
createTime: '2024-10-05',
deptName: '支队级',
sessionId: 12121212
},
{ //window.PCRWList ||
id: 37020017407,
title: '金水路与合川路事故多发点段',
roadCode: 123,
roadName: '金水路与合川路',
imgurl: '/static/imge.png',
createTime: '2024-10-11',
deptName: '支队级',
sessionId: 37020017404
},
// 公用的js
bgUrl1: '', // 登录信息背景图
list: [
{
id: 37020017404,
title: '金水路与合川路事故多发点段',
roadCode: 123,
roadName: '金水路与合川路',
imgurl: '/static/imge.png',
createTime: '2024-10-11',
deptName: '支队级',
sessionId: 37020017407
}
id: 1,
title: 'G228火炬路与S503岙东路路',
roadCode: 123,
roadName: 'G228火炬路与S503岙东路',
imgurl: '/static/imge.png',
createTime: '2024-10-05',
deptName: '支队级',
sessionId: 12121212
},
{
id: 2,
title: 'G228火炬路与S503岙东路路',
roadCode: 123,
roadName: 'G228火炬路与S503岙东路',
imgurl: '/static/imge.png',
createTime: '2024-10-05',
deptName: '支队级',
sessionId: 12121212
},
{
id: 3,
title: 'G228火炬路与S503岙东路路',
roadCode: 123,
roadName: 'G228火炬路与S503岙东路',
imgurl: '/static/imge.png',
createTime: '2024-10-05',
deptName: '支队级',
sessionId: 12121212
},
{
id: 4,
title: 'G228火炬路与S503岙东路路',
roadCode: 123,
roadName: 'G228火炬路与S503岙东路',
imgurl: '/static/imge.png',
createTime: '2024-10-05',
deptName: '支队级',
sessionId: 12121212
},
{
id: 5,
title: 'G228火炬路与S503岙东路路',
roadCode: 123,
roadName: 'G228火炬路与S503岙东路',
imgurl: '/static/imge.png',
createTime: '2024-10-05',
deptName: '支队级',
sessionId: 12121212
},
],
loadMoreText: "加载中...",
showLoadMore: false,
max: 0,
swiperList: [{
imgurl: '/static/c1.png'
},
{
imgurl: '/static/c2.png'
},
{
imgurl: '/static/c3.png'
},
{
imgurl: '/static/c4.png'
}
]
isEmpty: false,
isMore: true,
page: 1,
tab: 1
}
},
onLoad() {
this.initData();
},
onUnload() {
this.max = 0,
this.data = [],
this.loadMoreText = "加载更多",
this.showLoadMore = false;
},
onReachBottom() {
console.log("onReachBottom");
if (this.max > 40) {
this.loadMoreText = "没有更多数据了!"
return;
}
this.showLoadMore = true;
setTimeout(() => {
this.setListData();
}, 300);
},
onPullDownRefresh() {
console.log('onPullDownRefresh');
this.initData();
// 页面加载
onLoad(e) {
this.getList()
},
// 计算属性
computed: {},
// 方法
methods: {
initData() {
this.todoCount = 10;
this.processingCount = 5;
this.completedCount = 20;
getList() {
let datas = {
limit: 10,
page: 1,
}
// this.$request.globalRequest('/xxxxxxxx', datas, 'GET').then(res => {
// if (res.code == 0) {
// if (res.data.total === 0) {
// this.isEmpty = true;
// return false
// }
// this.list.push(...res.data.list)
// if (this.list.length >= res.data.total) {
// this.isMore = false
// }
// } else {
// this.$.toast(res.msg)
// }
// })
},
setListData() {
handleClick(row) {
console.log(row)
},
// 跳转到详情页
handleDetail(item) {
this.$store.commit('setItemMessage',item)
uni.navigateTo({
url: `/pages/home/detail`
})
// 跳转页面
skipPage(even) {
// this.$.open(even)
},
switchTab(index) {
this.currentTab = index;
}
},
onReady() {},
// 页面卸载
onUnload() {
}
},
// 触发下拉刷新
onPullDownRefresh() {
// 延迟关闭刷新动画
setTimeout(() => {
uni.stopPullDownRefresh();
}, 1500);
},
// 页面上拉触底事件的处理函数
onReachBottom() {
if (this.isMore) {
this.page++
this.getList()
}
},
}
</script>
<style scoped lang="scss">
.investigation {
.tabs {
display: flex;
justify-content: space-around;
height: 80rpx;
<style>
</style>
<style lang="scss" scoped>
page {
background: #F6F8FA;
}
.img {
width: 40rpx;
height: 40rpx;
margin-left: 30rpx;
}
.trapezoidal {
position: relative;
display: inline-block;
min-width: 2em;
text-align: center;
padding: 3rpx 20rpx 3rpx 18rpx;
}
.tab {
color: #895b5e;
width: 33.3%;
display: flex;
justify-content: center;
align-items: center;
background-color: #ffffff;
.trapezoidal::before,
.trapezoidal::after {
content: '';
position: absolute;
top: 0;
left: 0%;
width: 100%;
height: 100%;
border-radius: 0rpx 0 0 0;
background: #FF1111;
z-index: -1;
transform-origin: bottom;
transform: skew(18deg);
border: 0rpx solid #333;
box-sizing: border-box;
}
&.active {
border-bottom: 1px solid #019df0;
color: #895b5e;
font-weight: 700
}
.trapezoidal::after {
left: auto;
right: 0;
transform: skew(-0deg);
border-radius: 0 0rpx 0 0;
background-color: #FF1111;
border-left: 0 none;
}
.tab {
display: flex;
align-items: center;
justify-content: space-around;
font-weight: bold;
font-size: 16px;
height: 44px;
background: #ffffff;
box-shadow: 3px 0px 10px #ccc;
color: #666666;
position: relative;
.tab-item {
position: relative;
height: 41px;
line-height: 41px;
padding: 0 30rpx 0 30rpx;
border-bottom: 3px solid #fff;
&.active {
color: rgb(60, 109, 195);
border-color: rgb(60, 109, 195);
}
}
}
.imgleft {
width: 80rpx;
margin-right: 20rpx;
max-height: 100%;
.Box {
.Content {
width: calc(100% - 64rpx);
padding-bottom: 100rpx;
}
.content {
flex: 1;
.Unit {
padding: 36rpx;
display: flex;
flex-direction: column;
.title {
font-size: 32rpx;
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
justify-content: space-between;
align-items: center;
position: relative;
.trapezoidal {
position: absolute;
top: -4px;
right: 0;
color: #ffffff;
font-size: 14px;
font-weight: normal;
z-index: 1;
}
.bottom {
display: flex;
.text {
margin-right: 20rpx;
}
image {
width: 160rpx;
}
}
.right {
height: 100%;
display: flex;
align-items: center;
margin-left: 10px;
.btn {
width: 120rpx;
height: 70rpx;
line-height: 70rpx;
font-size: 28rpx;
.right {
flex: 1;
padding-left: 30rpx;
.title {
font-size: 16px;
}
.type {
font-size: 14px;
color: #666;
font-weight: normal;
text {
margin-right: 20rpx;
}
}
}
}
}
</style>
</style>

222
src/pages/investigation/indexOrigin.vue
Unescape View File

@ -0,0 +1,222 @@
<template>
<view class="investigation">
<!-- 排查 -->
<headerNavBar title="排查" :isBack="false"></headerNavBar>
<view class="tabs">
<view class="tab" @tap="switchTab(0)" :class="{active: currentTab === 0}">代办（{{ todoCount }}）</view>
<view class="tab" @tap="switchTab(1)" :class="{active: currentTab === 1}">正在办理（{{ processingCount }}）</view>
<view class="tab" @tap="switchTab(2)" :class="{active: currentTab === 2}">已完成（{{ completedCount }}）</view>
</view>
<view class="contentBox">
<!-- 代办内容 -->
<view class="uni-padding-wrap uni-common-mt">
<view class="text" v-for="(item,index) in data" :key="item.id+index">
<uni-list-item>
<template v-slot:header>
<view class="slot-box">
<image class="imgleft" :src="item.imgurl" mode="widthFix"></image>
</view>
</template>
<template v-slot:body>
<view class="content">
<text class="title">{{item.title}}</text>
<view class="bottom">
<text class="text">{{item.createTime}}</text>
<text class="text">{{item.deptName}}</text>
</view>
</view>
</template>
<template v-slot:footer>
<view class="right">
<button class="btn" @click="handleDetail(item)" type="primary">排查</button>
</view>
</template>
</uni-list-item>
</view>
<view class="uni-loadmore" v-if="showLoadMore">{{loadMoreText}}</view>
</view>
</view>
<!-- <view class="content" v-if="currentTab === 1">
</view>
<view class="content" v-if="currentTab === 2">
</view> -->
</view>
</template>
<script>
export default {
data() {
return {
currentTab: 0, // 当前选中的 Tab，0: 代办, 1: 正在办理, 2: 已完成
todoCount: 0, // 代办数量
processingCount: 0, // 正在办理数量
completedCount: 0, // 已完成数量
data:window.PCRWList || [{
id: 12121212,
title: 'G228火炬路与S503岙东路',
roadCode: 123,
roadName: 'G228火炬路与S503岙东路',
imgurl: '/static/imge.png',
createTime: '2024-10-05',
deptName: '支队级',
sessionId: 12121212
},
{ //window.PCRWList ||
id: 37020017407,
title: '金水路与合川路事故多发点段',
roadCode: 123,
roadName: '金水路与合川路',
imgurl: '/static/imge.png',
createTime: '2024-10-11',
deptName: '支队级',
sessionId: 37020017404
},
{
id: 37020017404,
title: '金水路与合川路事故多发点段',
roadCode: 123,
roadName: '金水路与合川路',
imgurl: '/static/imge.png',
createTime: '2024-10-11',
deptName: '支队级',
sessionId: 37020017407
}
],
loadMoreText: "加载中...",
showLoadMore: false,
max: 0,
swiperList: [{
imgurl: '/static/c1.png'
},
{
imgurl: '/static/c2.png'
},
{
imgurl: '/static/c3.png'
},
{
imgurl: '/static/c4.png'
}
]
}
},
onLoad() {
this.initData();
},
onUnload() {
this.max = 0,
this.data = [],
this.loadMoreText = "加载更多",
this.showLoadMore = false;
},
onReachBottom() {
console.log("onReachBottom");
if (this.max > 40) {
this.loadMoreText = "没有更多数据了!"
return;
}
this.showLoadMore = true;
setTimeout(() => {
this.setListData();
}, 300);
},
onPullDownRefresh() {
console.log('onPullDownRefresh');
this.initData();
},
methods: {
initData() {
this.todoCount = 10;
this.processingCount = 5;
this.completedCount = 20;
},
setListData() {
},
// 跳转到详情页
handleDetail(item) {
this.$store.commit('setItemMessage',item)
uni.navigateTo({
url: `/pages/home/detail`
})
},
switchTab(index) {
this.currentTab = index;
}
}
}
</script>
<style scoped lang="scss">
.investigation {
.tabs {
display: flex;
justify-content: space-around;
height: 80rpx;
.tab {
color: #895b5e;
width: 33.3%;
display: flex;
justify-content: center;
align-items: center;
background-color: #ffffff;
&.active {
border-bottom: 1px solid #019df0;
color: #895b5e;
font-weight: 700
}
}
}
.imgleft {
width: 80rpx;
margin-right: 20rpx;
max-height: 100%;
}
.content {
flex: 1;
display: flex;
flex-direction: column;
.title {
font-size: 32rpx;
width: 100%;
text-overflow: ellipsis;
overflow: hidden;
white-space: nowrap;
}
.bottom {
display: flex;
.text {
margin-right: 20rpx;
}
}
}
.right {
height: 100%;
display: flex;
align-items: center;
margin-left: 10px;
.btn {
width: 120rpx;
height: 70rpx;
line-height: 70rpx;
font-size: 28rpx;
}
}
}
</style>

BIN
src/static/image/mine/chat.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.4 KiB

BIN
src/static/image/mine/insurance.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.7 KiB

BIN
src/static/image/mine/insuranceBG.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 458 KiB

BIN
src/static/image/mine/jobfind.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.8 KiB

BIN
src/static/image/mine/lean.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
src/static/image/mine/mineBG.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 363 KiB

BIN
src/static/image/mine/plus.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 251 B

BIN
src/static/image/mine/review.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.2 KiB

BIN
src/static/image/mine/search.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
src/static/image/mine/setting.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.2 KiB

BIN
src/static/image/mine/train.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.5 KiB

BIN
src/static/image/mine/userinfo.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.7 KiB

BIN
src/static/image/nodata1.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 67 KiB

Write Preview
Loading…
Cancel
Save