list.vue 21 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547
  1. <template>
  2. <view>
  3. <!-- 第一种样式 人员管理-->
  4. <block v-if="datainfo.length>0">
  5. <!-- 人员管理 -->
  6. <block v-if="type=='people'">
  7. <view class="carlist peolist" v-for="(ite,idx) in datainfo" :key="idx">
  8. <view class="ctop flexc">
  9. <image :src="house" class="imgs" v-if="ite.houseStatus==1"></image>
  10. <image :src="housea" class="imgs" v-if="ite.houseStatus==2"></image>
  11. <image :src="houseb" class="imgs" v-if="ite.houseStatus==3"></image>
  12. <image :src="housec" class="imgs" v-if="ite.houseStatus==4"></image>
  13. <!-- <image :src="hicoa" class="imgs" v-if="ite.type==1"></image>
  14. <image :src="hicob" class="imgs" v-if="ite.type==2"></image> -->
  15. <view class="tit">{{ite.detailedAddress}}</view>
  16. <view class="flex1"></view>
  17. <!-- <view class="txt ca" v-if="ite.type==1">业主</view>
  18. <view class="txt cb" v-if="ite.type==2">租户</view> -->
  19. <view class="txt ca" v-if="ite.houseStatus==1">自住</view>
  20. <view class="txt cb" v-if="ite.houseStatus==2">出租</view>
  21. <view class="txt cc" v-if="ite.houseStatus==3">空闲</view>
  22. <view class="txt co6" v-if="ite.houseStatus==4">代售</view>
  23. </view>
  24. <view class="plists">
  25. <block v-for="(aite,aidx) in ite.residentInfoList">
  26. <view class="flexc pr mb12" :key="`peo${aidx}`" v-if="aidx==0" @click="getDetail(aite.residentId)"
  27. :data-idx="idx" :data-aidx="aidx" data-type="peo"
  28. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+aite.right+'px'"
  29. >
  30. <view class="plist flexc">
  31. <image :src="man" class="head" v-if="aite.residentGender==1"></image>
  32. <image :src="woman" class="head" v-else></image>
  33. <view class="flex1">
  34. <view class="ptit">{{aite.residentName}}
  35. <view class="btn btnc ml10" v-if="aite.isHouseholder=='Y'">户主</view>
  36. </view>
  37. <view class="ptxt">身份证号 | {{aite.residentIdCard}}</view>
  38. <view class="flexc">
  39. <view class="ptxt">性别 | {{aite.residentGender==1?'男':'女'}}</view>
  40. <view class="ptxt">年龄 | {{getAgeFromID(aite.residentIdCard)}}岁</view>
  41. </view>
  42. <view class="flexc" v-if="aite.residentAppearance">
  43. <view class="ptxt">人员面貌 | {{kaType(aite.residentAppearance,rymmList)}}</view>
  44. </view>
  45. </view>
  46. </view>
  47. <view class="spdel" v-if="aite.right>0&&checkPermi(['wuYe:residentInfo:remove'])" @click.stop="getDelFn(aite.residentId)">删除</view>
  48. </view>
  49. <view class="flexc pr mb12" :key="`peo${aidx}`" v-if="aidx>0&&ite.zhanflag" @click="getDetail(aite.residentId)"
  50. :data-idx="idx" :data-aidx="aidx" data-type="peo"
  51. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+aite.right+'px'"
  52. >
  53. <view class="plist flexc">
  54. <image :src="man" class="head" v-if="aite.residentGender==1"></image>
  55. <image :src="woman" class="head" v-else></image>
  56. <view class="flex1">
  57. <view class="ptit">{{aite.residentName}}
  58. <view class="btn btnc ml10" v-if="aite.isHouseholder=='Y'">户主</view>
  59. </view>
  60. <view class="ptxt">身份证号 | {{aite.residentIdCard}}</view>
  61. <view class="flexc">
  62. <view class="ptxt">性别 | {{aite.residentGender==1?'男':'女'}}</view>
  63. <view class="ptxt">年龄 | {{getAgeFromID(aite.residentIdCard)}}岁</view>
  64. </view>
  65. <view class="flexc" v-if="aite.residentAppearance">
  66. <view class="ptxt">人员面貌 | {{kaType(aite.residentAppearance,rymmList)}}</view>
  67. </view>
  68. </view>
  69. </view>
  70. <view class="spdel" v-if="aite.right>0&&checkPermi(['wuYe:residentInfo:remove'])" @click.stop="getDelFn(aite.residentId)">删除</view>
  71. </view>
  72. </block>
  73. <image :src="upimg" v-if="ite.residentInfoList.length>1" :class="ite.zhanflag?'act':''" class="upimg" @click="getZhan(idx)"></image>
  74. </view>
  75. </view>
  76. </block>
  77. <!-- 维修人员管理 -->
  78. <view v-if="type=='staff'" class="flecw">
  79. <view class="stafflist" v-for="(ite,idx) in datainfo" :key="idx" @click="getDetail(ite.staffId)">
  80. <view class="statop">
  81. <image class="head" :src="man" v-if="ite.gender==1"></image>
  82. <image class="head" :src="woman" v-else></image>
  83. <view class="flex1">
  84. <view class="statit">{{ite.staffName}}</view>
  85. <view class="statxt flexc co06"><text class="cir" :class="{'bga':ite.status==1,'bgb':ite.status==2}"></text>{{kaType(ite.status,ygztList)}}</view>
  86. <!-- <view class="statxt flexc cof6"><text class="cir bgb"></text>指派中</view> -->
  87. </view>
  88. <image :src="pdel" class="stadel" @click.stop="getDelFn(ite.staffId)"></image>
  89. </view>
  90. <view class="stalist">
  91. <view class="imgs"><image :src="gzlx" class="gzlximg"></image></view>{{kaType(ite.staffCategory,yglbList)}}
  92. <view class="flex1"></view>
  93. <view class="flexcc eyes" @click.stop="getHideFn(idx)">
  94. <image :src="neye" class="neye" v-if="ite.hideflag"></image>
  95. <image :src="eye" class="eye" v-else></image>
  96. </view>
  97. </view>
  98. <view class="stalist">
  99. <view class="imgs"><image :src="mphone" class="mphone"></image></view>{{ite.hideflag?ite.phoneNumbera:ite.phoneNumber}}
  100. </view>
  101. <view class="stalist">
  102. <view class="imgs"><image :src="sfz" class="sfz"></image></view>{{ite.hideflag?ite.idCarda:ite.idCard}}
  103. </view>
  104. </view>
  105. </view>
  106. <!-- 来访管理 -->
  107. <block v-if="type=='comepeo'">
  108. <view class="carlist peolist pr" v-for="(ite,idx) in datainfo" :key="idx" @click="getDetail(ite)"
  109. :data-idx="idx"
  110. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+ite.right+'px'"
  111. >
  112. <view class="pbr">
  113. <view class="ctop flexc">
  114. <image :src="hicoa" class="imgs"></image>
  115. <!-- <image :src="hicob" class="imgs" v-if="ite.type==2"></image> -->
  116. <view class="tit">{{ite.houseAddress}}</view>
  117. <!-- <view class="btn" :class="{'btnbga':ite.status==1,'btnbgc':ite.status==2}">{{kaType(ite.status,visitorType)}}</view> -->
  118. <!-- <view class="btn btnbgc">临时</view> -->
  119. <view class="flex1"></view>
  120. <view class="txt cc" v-if="ite.isCar=='Y'">驾车</view>
  121. </view>
  122. <view class="clists">
  123. <!-- <view class="clist"><view class="tit">预约时间</view>{{ite.reserveTime}}</view> -->
  124. <view class="clist"><view class="tit">来访时间</view>{{ite.visitorTime}}</view>
  125. <view class="w50 flexc">
  126. <view class="clist"><view class="tit">访客姓名</view>{{ite.name}}</view>
  127. <view class="clist"><view class="tit">来访人数</view>{{ite.num}}人</view>
  128. </view>
  129. <view class="w50 flexc">
  130. <view class="clist"><view class="tit">来访事由</view>{{ite.reason}}</view>
  131. <view class="clist"><view class="tit">车牌号码</view>{{ite.plateNumber}}</view>
  132. </view>
  133. <view class="clist"><view class="tit">手机号码</view>{{ite.mobileNumber}}</view>
  134. </view>
  135. </view>
  136. <view class="spdel" v-if="ite.right>0" @click.stop="getDelFn(ite)">删除</view>
  137. </view>
  138. </block>
  139. <view class="shax">{{wtdt}}</view>
  140. </block>
  141. <!-- 无数据 -->
  142. <view class="nodata" v-else>
  143. <image :src="noiconpimg"></image>
  144. <view>
  145. 暂无数据
  146. </view>
  147. </view>
  148. </view>
  149. </template>
  150. <script>
  151. import {selectDictValue} from "@/utils/common.js"
  152. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  153. import config from '@/config'
  154. export default{
  155. props:{
  156. datainfo: {
  157. type: Array,
  158. default () {
  159. return []
  160. }
  161. },
  162. wtdt:{
  163. type:String,
  164. default () {
  165. return ''
  166. }
  167. },
  168. type:{
  169. type:String,
  170. default () {
  171. return 0
  172. }
  173. },
  174. visitorType:{
  175. type:Array,
  176. default () {
  177. return []
  178. }
  179. },
  180. yglbList:{//员工类别
  181. type:Array,
  182. default () {
  183. return []
  184. }
  185. },
  186. ygztList:{//员工状态
  187. type:Array,
  188. default () {
  189. return []
  190. }
  191. },
  192. tabval:{
  193. type:[Number,String],
  194. default () {
  195. return ''
  196. }
  197. },
  198. rymmList:{//人员面貌
  199. type:Array,
  200. default () {
  201. return []
  202. }
  203. }
  204. },
  205. data(){
  206. return{
  207. house:require("@/work/static/manage/house.png"),
  208. housea:require("@/work/static/manage/housea.png"),
  209. houseb:require("@/work/static/manage/houseb.png"),
  210. housec:require("@/work/static/manage/housec.png"),
  211. noiconpimg:require("@/static/nodata.png"),
  212. car:require("@/car/static/car/car.png"),
  213. cara:require("@/car/static/car/cara.png"),
  214. carb:require("@/car/static/car/carb.png"),
  215. hicoa:require("@/people/static/people/hicoa.png"),
  216. hicob:require("@/people/static/people/hicob.png"),
  217. man:require("@/people/static/people/man.png"),
  218. woman:require("@/people/static/people/woman.png"),
  219. rimg:require("@/people/static/people/rimg.png"),
  220. pdel:require("@/people/static/people/pdel.png"),
  221. gzlx:require("@/people/static/people/gzlx.png"),
  222. mphone:require("@/people/static/people/mphone.png"),
  223. sfz:require("@/people/static/people/sfz.png"),
  224. eye:require("@/people/static/people/eye.png"),
  225. neye:require("@/people/static/people/neye.png"),
  226. time:require("@/work/static/manage/time.png"),
  227. house:require("@/work/static/manage/house.png"),
  228. home:require("@/service/static/service/home.png"),
  229. upimg:require("@/static/images/home/up.png"),
  230. star:require('@/manage/static/community/star.png'),
  231. stara:require('@/manage/static/community/stara.png'),
  232. baseUrl:config.baseUrl,
  233. delBtnWidth:66,//左滑默认宽度
  234. }
  235. },
  236. mounted() {
  237. },
  238. methods:{
  239. checkPermi, checkRole,
  240. kaType(data, list) {
  241. return selectDictValue(list, data);
  242. },
  243. getAgeFromID(idNumber) {
  244. if(idNumber){
  245. const birthDateStr = idNumber.substring(6, 14);
  246. const birthYear = parseInt(birthDateStr.substring(0, 4));
  247. const birthMonth = parseInt(birthDateStr.substring(4, 6));
  248. const birthDay = parseInt(birthDateStr.substring(6, 8));
  249. const today = new Date();
  250. const currentYear = today.getFullYear();
  251. const currentMonth = today.getMonth() + 1;
  252. const currentDay = today.getDate();
  253. let age = currentYear - birthYear;
  254. if (currentMonth < birthMonth || (currentMonth === birthMonth && currentDay < birthDay)) {
  255. age--;
  256. }
  257. return age;
  258. }
  259. },
  260. getDetail(e){
  261. this.$emit('getDetail',e)
  262. },
  263. getAddFn(e){
  264. this.$emit('getAddFn',e)
  265. },
  266. getReadlist(e){
  267. this.$emit('getReadlist',e)
  268. },
  269. getDelFn(e){
  270. var that=this;
  271. uni.showModal({
  272. title: '确认删除',
  273. content: "是否确认删除",
  274. cancelText: '取消',
  275. confirmText: '确认',
  276. success: function(res) {
  277. if (res.confirm) {
  278. that.$emit('getDelFn',e)
  279. } else if (res.cancel) {
  280. }
  281. }
  282. });
  283. },
  284. getZhan(idx){
  285. // var obj=JSON.parse(JSON.stringify(this.datainfo))[idx]
  286. // obj.zhanflag=!obj.zhanflag;
  287. // this.datainfo.splice(idx,1,obj);
  288. this.datainfo[idx].zhanflag=!this.datainfo[idx].zhanflag
  289. },
  290. getHideFn(idx){
  291. this.datainfo[idx].hideflag=!this.datainfo[idx].hideflag
  292. },
  293. getPreview(idx,arr) {
  294. var newArr=[];
  295. arr.forEach(ite=>{
  296. var ds=this.baseUrl+ite
  297. newArr.push(ds)
  298. })
  299. uni.previewImage({
  300. urls: newArr,
  301. current:idx,
  302. success: function(data) {},
  303. fail: function(err) {}
  304. });
  305. },
  306. //开始触摸滑动
  307. drawStart(e) {
  308. // console.log("开始触发");
  309. var touch = e.touches[0];
  310. this.startX = touch.clientX;
  311. },
  312. //触摸滑动
  313. drawMove(e) {
  314. var idx=e.currentTarget.dataset.idx
  315. var aidx=e.currentTarget.dataset.aidx
  316. var type=e.currentTarget.dataset.type;
  317. for (var index in this.datainfo) {
  318. if(type&&type=='peo'){
  319. for(var i in this.datainfo[idx].residentInfoList){
  320. this.$set(this.datainfo[idx].residentInfoList[i],'right',0);
  321. }
  322. }else{
  323. this.$set(this.datainfo[index],'right',0);
  324. }
  325. }
  326. var touch = e.touches[0];
  327. var item = this.datainfo[idx];
  328. var disX = this.startX - touch.clientX;
  329. if (disX >= 20) {
  330. if (disX > this.delBtnWidth) {
  331. disX = this.delBtnWidth;
  332. }
  333. if(type&&type=='peo'){
  334. this.$set(this.datainfo[idx].residentInfoList[aidx],'right',disX);
  335. }else{
  336. this.$set(this.datainfo[idx],'right',disX);
  337. }
  338. // this.csListArrl[idx].right=disX
  339. } else {
  340. // this.csListArrl[idx].right=0
  341. this.$set(this.datainfo[idx],'right',0);
  342. }
  343. },
  344. //触摸滑动结束
  345. drawEnd(e) {
  346. // console.log("滑动结束");
  347. var idx=e.currentTarget.dataset.idx
  348. var item = this.datainfo[idx];
  349. if (item.right >= this.delBtnWidth / 2) {
  350. // this.datainfo[idx].right=this.delBtnWidth
  351. // this.$set(this.datainfo[idx],'right',this.delBtnWidth);
  352. } else {
  353. this.datainfo[idx].right=0
  354. }
  355. },
  356. }
  357. }
  358. </script>
  359. <style lang="scss" scoped>
  360. .flex{display: flex;}
  361. .flexc{display: flex;align-items: center;}
  362. .mb10{margin-bottom: 20rpx;}
  363. .carlist{background: #FFFFFF;border-radius: 20rpx;margin-bottom: 24rpx;
  364. .ctop{border-bottom: 2rpx solid #E5E5E5;padding:26rpx 24rpx;
  365. .imgs{width: 40rpx;height: 42rpx;margin-right: 30rpx;}
  366. .tit{font-size: 32rpx;color: #272727;font-weight: bold;margin-right: 14rpx;}
  367. .txt{font-weight: 500;font-size: 26rpx;
  368. &.ca{color: #3565ED;}
  369. &.cb{color: #FE5A0E;}
  370. &.cc{color: #28C529;}
  371. }
  372. .txta{font-weight: 500;font-size: 24rpx;color: #AAAAAA;}
  373. .num{font-size: 24rpx;color: #AAAAAA;}
  374. }
  375. .btn{height: 34rpx;border-radius: 18rpx;display: flex;align-items: center;justify-content: center;padding: 0 10rpx;font-size: 22rpx;margin-right: 24rpx;
  376. &.btna{border: 2rpx solid #06C770;color: #06C770;}
  377. &.btnb{border: 2rpx solid #3565ED;color: #3565ED;}
  378. &.btnc{border: 2rpx solid #FE5A0E;color: #FE5A0E;}
  379. &.btnbga{border: 1px solid #0156FE;color: #3565ED;background: #DFEAFF;height: 36rpx;}
  380. &.btnbgb{border: 1px solid #C1C1C1;color: #666666;background: #F1F1F1;height: 36rpx;}
  381. &.btnbgc{border: 1px solid #FE5A0E;color:#FE5A0E;background:#FFEEE6;height: 36rpx;}
  382. }
  383. .clists{padding: 24rpx 24rpx 8rpx;
  384. .clist{font-weight: 500;margin-bottom: 16rpx;
  385. font-size: 26rpx;color: #272727;display: flex;line-height: 34rpx;
  386. .tit{font-size: 26rpx;color: #AAAAAA;flex: 0 0 auto;margin-right: 16rpx;min-width: 108rpx;text-align-last: justify;}
  387. .imgas{display: flex;align-items: center;flex-wrap: wrap;
  388. image{width: 142rpx;height: 142rpx;margin-right: 30rpx;margin-top: 8rpx;}
  389. }
  390. }
  391. .w50{
  392. .clist{width: 50%;}
  393. }
  394. }
  395. }
  396. // 人员
  397. .peolist{
  398. .ctop{padding: 24rpx 24rpx 22rpx;}
  399. .imgs{margin-right: 16rpx !important;}
  400. .tit{font-size: 28rpx !important;}
  401. .plists{padding: 30rpx 24rpx 6rpx;
  402. .plist{background: linear-gradient(-90deg, #F2F5FF 0%, #FBFDFF 100%);border-radius: 20rpx;border: 2rpx solid #E6E6E6;padding: 18rpx 26rpx 4rpx;width: 100%;z-index: 1;
  403. .head{width: 96rpx;height: 98rpx;margin-right: 32rpx;flex: 0 0 auto;}
  404. .ptit{font-weight: bold;font-size: 30rpx;color: #272727;display: flex;align-items: center;margin-bottom: 14rpx;}
  405. .ptxt{font-weight: 500;font-size: 26rpx;color: #666666;line-height: 36rpx;margin-bottom: 14rpx;min-width: 176rpx;}
  406. }
  407. }
  408. .upimg{width: 26rpx;height: 22rpx;display: block;transform: rotate(180deg);transition: all 0.3s;margin: 0 auto 18rpx;
  409. &.act{transform: rotate(0deg);}
  410. }
  411. }
  412. // 物业费
  413. .mlistl{width: 40%;display: flex;flex-direction: column;align-items: center;flex: 0 0 auto;
  414. .mltit{font-weight: 500;font-size: 26rpx;color: #666666;margin-bottom: 18rpx;}
  415. .mltxt{font-weight: bold;font-size: 32rpx;color: #0156FE;}
  416. }
  417. .houselist{
  418. .clists{padding-bottom: 2rpx !important;}
  419. .clist{margin-bottom: 22rpx !important;}
  420. }
  421. // 巡更地点
  422. .patlist{background: #FFFFFF;border-radius: 20rpx;margin-bottom: 24rpx;padding: 0 24rpx 30rpx;
  423. .pattop{padding:22rpx 30rpx;margin-bottom: 2rpx;
  424. .imgs{width: 28rpx;height: 28rpx;margin-right: 12rpx;}
  425. .tit{font-size: 30rpx;color: #272727;font-weight: bold;margin-right: 14rpx;}
  426. .txt{font-weight: 500;font-size:24rpx;
  427. &.ca{color: #3565ED;}
  428. &.cb{color: #FE5A0E;}
  429. &.cc{color: #28C529;}
  430. &.cd{color: #FF6969;}
  431. }
  432. }
  433. .patlistr{background: #EFF4FF;border-radius: 20rpx;padding: 20rpx 32rpx;
  434. .clist{font-weight: 500;font-size: 26rpx;color: #272727;display: flex;line-height: 50rpx;
  435. .tit{font-size: 26rpx;flex: 0 0 auto;min-width: 108rpx;text-align-last: justify;font-weight: bold;}
  436. }
  437. }
  438. .patbtns{display: flex;justify-content: flex-end;align-items: center;flex-wrap: wrap;
  439. view{min-width: 156rpx;height: 52rpx;font-weight: 500;font-size: 26rpx;background: #FFFFFF;border-radius: 20rpx;box-sizing: border-box;display: flex;align-items: center;justify-content: center;padding: 0 10rpx;margin-left: 24rpx;margin-top: 24rpx;
  440. &.btna{border: 2rpx solid #0256FD;color: #0256FD;}
  441. &.btnb{background: #0256FD;color: #ffffff;}
  442. }
  443. }
  444. }
  445. // 报修
  446. .walists{background: #FFFFFF;border-radius: 20rpx;margin-bottom: 24rpx; position: relative;
  447. .watop{
  448. padding: 0 36rpx 8rpx 38rpx;
  449. .watit{padding: 24rpx 0;margin-bottom: 4rpx;display: flex;
  450. .tit{font-weight: bold;font-size: 28rpx;color: #272727;flex: 1;
  451. .cir{width: 14rpx;margin-left: 8rpx;margin-bottom: 10rpx;height: 14rpx;display: inline-block;background: #FF6969;border-radius: 8rpx;}
  452. }
  453. .txt{font-weight: bold;font-size: 26rpx;flex: 0 0 auto;
  454. }
  455. }
  456. }
  457. .walist{display: flex;font-weight: 500;font-size: 24rpx;color: #666666;margin-bottom: 16rpx;
  458. .tit{min-width: 100rpx;text-align-last: justify}
  459. }
  460. .wabtn{display: flex;align-items: center;justify-content: space-between;border-top: 2rpx solid #E5E5E5;height: 80rpx;padding: 0 38rpx;
  461. view{font-weight: 500;font-size: 24rpx;color: #666666;}
  462. image{width: 16rpx;height: 28rpx;}
  463. }
  464. }
  465. // 维修人员
  466. .stafflist{width: 344rpx;min-height: 256rpx;background: #FFFFFF;border-radius: 20rpx;margin:0 12rpx 24rpx 12rpx;padding-bottom: 20rpx;box-sizing: border-box;
  467. // &:nth-of-type(2n){margin-right: 0;}
  468. .statop{border-bottom: 2rpx solid #E5E5E5;display: flex;padding: 24rpx 24rpx 22rpx;
  469. .head{width: 80rpx;height: 82rpx;margin-right: 24rpx;flex: 0 0 auto;}
  470. .stadel{width: 30rpx;height: 30rpx;flex: 0 0 auto;margin-left: 12rpx;}
  471. .statit{font-weight: bold;font-size: 30rpx;color: #272727;margin-bottom: 4rpx;}
  472. .statxt{font-weight: 500;font-size: 26rpx;
  473. .cir{width: 10rpx;height: 10rpx;border-radius: 50%;margin-right: 14rpx;display: inline-block;
  474. &.bga{background: #06C770;}
  475. &.bgb{background: #FF6969;}
  476. }
  477. }
  478. }
  479. .stalist{font-weight: 500;font-size: 26rpx;color: #272727;display: flex;align-items: center;padding: 20rpx 24rpx 0;
  480. .imgs{width: 24rpx;height: 30rpx;margin-right: 22rpx;flex: 0 0 auto;display: flex;align-items: center;justify-content: center;
  481. .gzlximg{width: 24rpx;height: 28rpx;}
  482. .mphone{width: 18rpx;height: 30rpx;}
  483. .sfz{width: 20rpx;height: 18rpx;}
  484. }
  485. .eyes{width: 34rpx;height: 34rpx;
  486. .eye{width: 22rpx;height: 15rpx;}
  487. .neye{width: 24rpx;height: 24rpx;}
  488. }
  489. }
  490. }
  491. .watopcom{background-color: #ffffff;border-radius: 20rpx;position: relative;z-index: 1;padding-bottom: 30rpx !important;
  492. .watopcoma{font-weight: 500;font-size: 26rpx;color: #666666;line-height: 36rpx;margin-bottom: 24rpx;}
  493. .watopcomb{font-weight: 500;font-size: 24rpx;color: #AAAAAA;}
  494. }
  495. //资讯
  496. .newlists{
  497. background: #FFFFFF;padding: 22rpx 24rpx;margin-bottom: 24rpx;
  498. border-radius: 20rpx;
  499. .tit{font-size: 32rpx;font-weight: bold;color: #272727;line-height: 48rpx;margin-bottom:16rpx;}
  500. .txt{font-size: 24rpx;color: #666666;line-height: 36rpx;margin-bottom: 32rpx;}
  501. .stabox{
  502. .time{font-weight: 500;font-size: 24rpx;color: #AAAAAA;line-height: 36rpx;}
  503. .btns{font-weight: 500;font-size: 22rpx;color: #666666;line-height: 36rpx;min-width: 100rpx;box-sizing: border-box;margin-left: 20rpx;
  504. .imga{width: 24rpx;height: 22rpx;margin-right: 8rpx;}
  505. .imgb{width: 24rpx;height: 18rpx;margin-right: 10rpx;}
  506. }
  507. }
  508. }
  509. // 视频
  510. .videolists{
  511. background: #FFFFFF;margin-bottom: 24rpx;border-radius: 20rpx;
  512. .titbox{padding-top: 16rpx;padding-right: 38rpx;}
  513. .videos{width: 260rpx;height: 180rpx;}
  514. .tit{font-weight: bold;font-size: 14px;color: #272727;text-align: left;margin-bottom: 10rpx;}
  515. .num{font-weight: 500;font-size: 20rpx;color: #666666;min-width: 68rpx;padding: 0 8rpx;box-sizing: border-box;
  516. height: 28rpx;background: #E6E6E6;border-radius: 14rpx;line-height: 28rpx;text-align: center;}
  517. .time{font-weight: 500;font-size: 24rpx;color: #AAAAAA;margin-top: 44rpx;}
  518. }
  519. // 名单
  520. .readlist{background: #FFFFFF;border-radius: 20rpx;border: 2rpx solid #E6E6E6;margin-bottom: 24rpx;padding: 24rpx;display: flex;align-items: center;box-sizing: border-box;
  521. .head{width: 96rpx;height: 96rpx;margin-right: 28rpx;flex: 0 0 auto;}
  522. .tit{font-weight: bold;font-size: 30rpx;color: #272727;margin-bottom: 12rpx;}
  523. .time{font-weight: 500;font-size: 26rpx;color: #666666;line-height: 36rpx;
  524. text{margin-right: 12rpx;display: inline-block;}
  525. }
  526. }
  527. .spdel{width: 164rpx;background: #EA2D2D;font-weight: bold;font-size: 26rpx;color: #FFFFFF;display: flex;align-items: center;justify-content: center;position: absolute;right: -146rpx;top: 0;bottom: 0;padding-left: 14rpx;}
  528. // 无数据
  529. .nodata{display: flex;flex-direction: column;align-items: center;
  530. image{width: 440rpx;height: 440rpx;}
  531. view{font-size: 30rpx;color: #666666;font-weight: bold;}
  532. }
  533. </style>