<template > <view> <view :class="['custom-header', { 'is-back': isBack }, bgColor]"> <view class="back-container" @click="handleBack"> <view class="back-text">返回</view> </view> <view class="content-container"> <view class="content-text">{{title}}</view> </view> </view> <view class="line-box"> <view :style="[{top:CustomBar + 'px'}]"> <!-- <view class="tabs" v-if="md=='1'"> <view v-for="(tab, index) in tabs" :key="index" class="tab-item" :class="{ active: activeTab === index }" @click="switchTab(index)" > {{ tab.name }} </view> </view> <view class="search-box" > <view class="choose-box2" style="margin-top: 10rpx;"> <view style="width: 520rpx;"> <input type="text" placeholder="输入关键词产品或企业名称" v-model="searchForm.qyName" confirm-type="search" ></input> </view> <text style="padding-left: 40rpx;flex: 1;" class="cuIcon-search color-white" @click="doSearch"></text> </view> </view> --> <mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" :up="upOption" @up="upCallback"> <view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''" v-for="(item, index) in dataList" :key="index" @touchstart="ListTouchStart" @touchmove="ListTouchMove" @touchend="ListTouchEnd" :data-target="'move-box-' + index"> <view class="item-box" @click="gotoBuildInfo(item.id,item.phone)"> <view class="item-title"> 企业名称:{{item.qyName}} </view> <view class="item-title"> 提交时间:{{item.createDate}} </view> <view class="item-title"> 提交人:{{item.qyFzr}} </view> <view class="item-title"> 办结时间:{{item.des5||'----'}} </view> </view> </view> </mescroll-body> <uni-fab v-if="canAdd" :pattern=" { color: '#7A7E83', backgroundColor: '#fff', selectedColor: '#007AFF', buttonColor: '#007AFF' }" horizontal="right" vertical="bottom" @fabClick="add" ></uni-fab> <!-- <view @click="outlogin" class="fixed-bottom-right" v-if="isLogin!=null"> <image class="center-img2" src="/static/img/icon_logout.png"></image> </view> --> </view> </view> </view> </template> <script> import * as $auth from "../../common/auth" import loginService from "@/api/auth/loginService"; import uniFab from '@/components/uni-fab/uni-fab.vue'; import DoublePicker from '@/components/DoublePicker/DoublePicker.vue' import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js"; import MescrollMoreItemMixin from "@/components/mescroll-uni/mixins/mescroll-more-item.js"; import {mapActions} from 'vuex' export default { mixins: [MescrollMixin, MescrollMoreItemMixin], // 使用mixin (在main.js注册全局组件) name: "apps", components: { uniFab, DoublePicker }, data() { return { canAdd:false, userid:"", isLogin:"", pageInfo: {}, loginid:"", title:"问题诉求", isBack: true, // 是否显示返回按钮 bgColor: 'bg-blue', // 背景颜色 tabs: [ { name: '全部' }, { name: '供' }, { name: '需' } ], activeTab: 0, stype: "", // 企业 => 3 楼宇 => 2 园区 => 1 zfadmin => 4 admin=> 5 md:"1", searchForm: { des1:"", des10:"", qyName:"", }, curWord: "", //当前搜索关键词 dataList: [], // 数据列表 modalName: null, tablePage: { total: 0, currentPage: 1, pageSize: 10, orders: [] }, loading: false, parkId: '', parkList: [], parkList2: [], parkList3: [], parkList4: [], ddd1:"" , }; }, onLoad(query) { if(query!=undefined&&query!=null&&query!=''){ if(query.loginid!=undefined){ this.loginid=query.loginid this.autoLogin(); } if (query && query.w=='1' ) { this.md = "1"; this.title="问题诉求"; }else if(query && query.w=='2'){ this.md = "2"; this.title="问题诉求"; this.searchForm.des10="1"; } } //只有企业角色才能发起问题诉求 if($auth.getUserInfo().roleIds=="38a14f1f42ed424eab4cb5d489596b0d"){ this.canAdd =true; } }, onShow() { this.isLogin=this.$auth.checkisLogin(); }, created() { this.userid= $auth.getUserInfo().loginName; }, methods: { ...mapActions(['refreshUserInfo']), /*获取数据列表 */ upCallback(page) { this.loading = true loginService.getdzfQuestionList({ current: page.num, size: page.size, orders: [{ column: 'a.create_date', asc: false }], ...this.searchForm }).then(({ data }) => { let curPageData = data.records this.mescroll.endBySize(curPageData.length, data.total); //如果是第一页需手动制空列表 if (page.num == 1) this.dataList = []; //追加新数据 this.dataList = this.dataList.concat(curPageData); }).catch(e => { //联网失败, 结束加载 this.mescroll.endErr(); }) }, gotoBuildInfo(id,phone) { //此条信息的发起人是当前账号 if(phone==this.userid){ uni.navigateTo({ url: `/pages/question/questionAdd?id=${id}&ischeck=1` }) //此条信息是处理人 }else{ uni.navigateTo({ url: `/pages/question/questionInfo?id=${id}&ischeck=1` }) } }, updateCities(newCities) { this.cities = newCities; }, // 搜索 doSearch() { this.dataList = []; // 先清空列表,显示加载进度 this.mescroll.resetUpScroll(); }, totongxunlu(){ uni.navigateTo({ url: '/pages/comList/comList' }) }, totongxunlu2(){ uni.showModal({ title: '功能暂未开放,请至后台导入!', showCancel: true, success: (res) => { } }); }, getPageInfo() { loginService.InfoStatistics({}).then(({ data }) => { this.pageInfo = data; }); }, autoLogin(){ console.log("登录id"+this.loginid); loginService.loginid( this.loginid).then(({data}) => { this.$store.commit('SET_TOKEN',data.token); this.refreshUserInfo(); }).catch(e => { console.error(e) }) }, getRole() { let userInfo = uni.getStorageSync('WMS-userinfo') var officeId = userInfo.officeDTO.id; var roleIds = userInfo.roleIds; if (roleIds.indexOf("17bac1f980264e3e8193bc965538e2c6") != -1) { //// 管理员 this.stype = 5 uni.setStorageSync('stype', this.stype); } else if (roleIds.indexOf("ade960e8f02544998b07397304c059c1") != -1) { // 政府管理员 this.stype = 4 uni.setStorageSync('stype', this.stype); } else { console.log('==================>这里走了么','================>存一个stape') loginService .getOtherIdByOffceid({ officeid: officeId, }) .then(({ data }) => { console.log(data, "====================>getOtherIdByOffceid"); this.stype = data.stype; uni.setStorageSync('stype', this.stype); }); } }, outloginset(){ loginService.logout().then(({ data }) => { this.$store.commit('logout'); uni.clearStorage(); }) this.$store.commit('logout'); uni.clearStorage(); this.isLogin=this.$auth.checkisLogin(); uni.hideLoading() }, outlogin() { uni.showModal({ title: '您确认退出么?', showCancel: true, success: (res) => { if (res.confirm) { uni.showLoading() this.outloginset(); // uni.reLaunch({ // url: '/pages/login/login' // }) } } }); }, tces() { uni.navigateTo({ url: '/pages/index/AudioToWord' }) }, // ListTouch触摸开始 ListTouchStart(e) { this.listTouchStart = e.touches[0].pageX }, // ListTouch计算方向 ListTouchMove(e) { this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > -60 ? 'right' : 'left' }, // ListTouch计算滚动 ListTouchEnd(e) { if (this.listTouchDirection == 'left') { this.modalName = e.currentTarget.dataset.target } else { this.modalName = null } this.listTouchDirection = null }, handleBack() { // 返回逻辑,比如跳转至上一页 this.$router.go(-1); }, add(){ if(this.isLogin==null){ uni.showModal({ title: '您还未登录,现在去登录?', showCancel: true, success: (res) => { if (res.confirm) { uni.showLoading() uni.reLaunch({ url: '/pages/login/login' }) } } }); }else{ uni.navigateTo({ url: '/pages/question/questionAdd' }) } }, switchTab(index) { this.activeTab = index; if(this.activeTab==0){ this.searchForm.des1=""; }else{ this.searchForm.des1=this.activeTab; } this.doSearch(); } } } </script> <style> .page { height: 100vh; } .line-box { padding-left: 20rpx; padding-right: 20rpx; margin-top: 20rpx; } .mart-t { margin-top: 30rpx; } .center-box{ margin-top: 20rpx; width: 100%; border-radius: 25rpx; border-radius: 25rpx; background: #fff; box-shadow: 0px 8px 16px 2px rgba(101, 101, 101, 0.2); padding-bottom: 30rpx; display: flex; flex-wrap: wrap; } .center-left-box { width: 100%; padding-bottom: 30rpx; display: flex; flex-wrap: wrap; } .btn-box-text { flex:1; height: 20rpx; text-align: center; color: #000000; font-size: 14px; font-weight: 700; } .btn-box-1 { flex:1; height: 30rpx; text-align: center; color: #36A7F3; font-size: x-large; font-weight: 700; } .btn-box-2 { flex:1; height: 30rpx; text-align: center; color:#F3365A; font-size: x-large; font-weight: 700; } .btn-box-3 { flex:1; height: 30rpx; text-align: center; color:#15D578; font-size: x-large; font-weight: 700; } .btn-box-4 { flex:1; height: 30rpx; text-align: center; color:#F1A31B; font-size: x-large; font-weight: 700; } .btn-Imbox { flex:1; height: 150rpx; padding-top: 8rpx; text-align: center; display: flex; flex-direction: column; justify-content: center; /* 子元素内部内容竖向居中 */ align-items: center; /* 子元素内部内容水平居中 */ text-align: center; /* 文字居中 */ } .btn-Imbox p { font-size: 14px; /* 文字大小,可根据需要调整 */ margin: 0; /* 去掉默认的外边距 */ font-weight: 700; } .center-img{ width: 90rpx; height: 90rpx; margin-bottom: 10rpx; text-align: center; } .center-img2{ width: 70rpx; height: 70rpx; margin-top: 10rpx; margin-bottom: 20rpx; text-align: center; } .kuai-text{ color: #000000; font-weight: 900; font-size: 34rpx; padding-top: 20rpx; padding-left: 20rpx; } .btn-box-5 { width: 337rpx; height: 200rpx; background-image: url('../../static/img/btn3.png'); background-size: 100% 100%; } .btn-box-6 { width: 337rpx; height: 200rpx; background-image: url('../../static/img/btn6.png'); background-size: 100% 100%; } .h-200 { height: 200rpx; } .swiper { width: 750rpx; height: 310rpx; } .swiper-item { width: 750rpx; height: 310rpx; background-color: aliceblue; } .font-size-35 { font-size: 35px !important; } .img-size { width: 80rpx; height: 80rpx; } .content-box { width: 437rpx; height: 200rpx; } .my-app .padding-sm { padding: 6px; } .grid .padding-sm .bg-white { box-shadow: 0 1px 4px #f9f9f9, 1px 1px 40px rgba(0, 0, 0, .06); } .bg-blue { background: #fff; color: #0081ff !important; } .text-white, .line-white, .lines-white { color: #0081ff !important; } .cu-bar .search-form { background-color: white; } .item-box{ width: 710rpx; background: #FFFFFF; box-shadow: 0px 1px 3px 0px rgba(9,2,4,0.1); border-radius: 10px; padding-top: 12rpx; padding-left: 38rpx; padding-right: 10rpx; padding-bottom: 15rpx; margin-top: 20rpx; } .item-title{ font-size: 30rpx; margin-top: 12rpx; color: #010101; } .item-line{ display: flex; height: 48rpx; margin-top: 20rpx; } .item-line2{ height: 48rpx; margin-top: 20rpx; } .subtitle{ color: #E5880E; } .item-name{ margin-top: 5rpx; font-size: 29rpx; color: #666666; } .item-name2{ font-size: 29rpx; color: #676D99; height: 40rpx; /* 这里假设两行的高度是80rpx */ overflow: hidden; /* 超出部分隐藏 */ text-overflow: ellipsis; /* 超出部分显示省略号 */ display: -webkit-box; /* 使用Webkit的行盒模型 */ -webkit-line-clamp: 1; /* 限制最多显示2行 */ -webkit-box-orient: vertical; /* 垂直排列 */ } .item-name3{ display: flex; width: 100%; padding-right: 30rpx; flex: 1; justify-content: flex-end; font-size: 29rpx; color: #FF4500; } .item-name31{ display: flex; width: 100%; padding-right: 30rpx; flex: 1; justify-content: flex-end; font-size: 29rpx; color: #2E8B57; } .item-content{ color: #1497EF; font-size: 30rpx; } .btn-box{ display: flex; } .line-zs{ width: 2rpx; height: 30rpx; background: #36A7F3; } .edit-botton{ width: 100rpx; height: 48rpx; line-height: 48rpx; color: #fff; font-size: 28rpx; margin-right: 20rpx; border-radius: 10rpx; background: #5A9EE9; text-align: center; } .del-botton{ width: 100rpx; height: 48rpx; line-height: 48rpx; color: #fff; font-size: 28rpx; margin-right: 20rpx; border-radius: 10rpx; background: #F27C85; text-align: center; } .color-white{ color: #808080; font-size: 40rpx; line-height: 60rpx; } .search-box{ padding-left: 20rpx; padding-right: 20rpx; padding-top: 20rpx; margin-top: 20rpx; width: 100%; border-radius: 25rpx; border-radius: 25rpx; background: #fff; box-shadow: 0px 8px 16px 2px rgba(101, 101, 101, 0.2); padding-bottom: 30rpx; display: flex; flex-wrap: wrap; } .search-box1{ display: flex; } .input-box{ background: #fff; height: 65rpx; width: 640rpx; display: flex; align-items: center; border-radius: 30rpx; padding-left: 30rpx; margin-right: 20rpx; } .input-boxinput{ height: 75rpx; font-size: 15rpx; } .choose-box{ background: #fff; width: 325rpx; border-radius: 23rpx; height: 70rpx; display: flex; align-items: center; justify-content: center; margin-right: 20rpx; border: 1rpx solid #808080; } .choose-box2{ background: #fff; width: 100%; border-radius: 23rpx; height: 70rpx; display: flex; padding-left: 29rpx; align-items: center; border: 1rpx solid #808080; } .choose-box3{ display: flex; } .choose-boxp{ font-size: 32rpx; width: 80rpx; } .fixed-bottom-right { padding: 20rpx; position: fixed; bottom: 20px; /* 距离底部的距离 */ right: 20px; /* 距离右侧的距离 */ } .tabs { display: flex; justify-content: space-around; margin-bottom: 10px; } .tab-item { padding: 10px 10px; cursor: pointer; transition: all 0.3s; } .tab-item.active { color: #66b1ff; border-bottom: 2px solid #66b1ff; } .tab-content { padding: 20px; } .tab-item-content { display: none; } .tab-item-content.v-if { display: block; } .custom-header { display: flex; align-items: center; justify-content: center; padding: 10px; width: 100%; } .is-back { position: relative; } .back-container { position: absolute; left: 10px; cursor: pointer; } .back-text { color: white; /* 返回按钮文本颜色 */ } /* 背景颜色 */ .bg-blue { background-color: #4285f4; /* 假设这是一个蓝色背景 */ } .content-container { flex: 1; text-align: center; } .content-text { color: white; /* 标题文本颜色 */ font-weight: bold; } </style>