list.vue 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607
  1. <template>
  2. <view>
  3. <!-- 第一种样式 人员管理-->
  4. <block v-if="datainfo.length>0">
  5. <block v-if="type=='mycar'">
  6. <view class="carlist pr" v-for="(ite,idx) in datainfo" :key="idx" @click="getDetail(ite.carId)"
  7. :data-idx="idx"
  8. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+ite.right+'px'"
  9. >
  10. <view class="delleft" style="padding: 0 24rpx;">
  11. <view class="carltop flexc">
  12. <view class="flex1">
  13. <view class="tit mb6" :class="ite.vehicleType=='新能源'?'co16':'co01'">{{ite.plateNumber}}</view>
  14. <view class="txt flexc">
  15. {{kaType(ite.vehicleBrand,clcxList)}}
  16. <view class="txtbtn flexcc">{{ite.vehicleType}}</view>
  17. <!-- <view class="txtbtn flexcc" v-if="ite.vehicleType==2">新能源</view> -->
  18. </view>
  19. </view>
  20. <image :src="carb" class="carb" v-if="ite.vehicleType=='新能源'"></image>
  21. <image :src="cara" class="cara" v-else></image>
  22. </view>
  23. <view class="carlf">
  24. <view class="clflist">发动机号码 :{{ite.engineNumber}}</view>
  25. <view class="clflist">车辆识别代号:{{ite.identificationNumber}}</view>
  26. <view class="flexc">
  27. <view class="clflist w50">注册日期:{{ite.registrationDate}}</view>
  28. <view class="clflist w50">发证日期:{{ite.issueDate}}</view>
  29. </view>
  30. </view>
  31. </view>
  32. <view class="spdel" v-if="ite.right>0&&checkPermi(['wuYe:car:remove'])" @click.stop="getDelFn(ite.carId)">删除</view>
  33. </view>
  34. </block>
  35. <!-- 地址 -->
  36. <block v-if="type=='address'">
  37. <view class="adrlist flexc" :class="ite.isdefault?'act':''" v-for="(ite,idx) in datainfo" :key="idx">
  38. <view class="adrl flex1">
  39. <view class="tit mb5">安徽省 合肥市 蜀山区 高新技术产业开发区</view>
  40. <view class="txt mb5">幸福大街88号幸福小区12#1304</view>
  41. <view class="txts flexc">袁玥 <text class="ml8">18305687768</text>
  42. <text class="ml8 btns" v-if="ite.isdefault">默认</text>
  43. <text class="ml8 btns" v-if="ite.isuser">最近使用</text>
  44. </view>
  45. </view>
  46. <view class="adrr flexcc">
  47. <image :src="edit"></image>
  48. </view>
  49. </view>
  50. </block>
  51. <!-- 快递 -->
  52. <block v-if="type=='delivery'">
  53. <view class="kdlists flex" v-for="(ite,idx) in datainfo" :key="idx" @click="getDetail">
  54. <image :src="noiconpimg" class="kdll"></image>
  55. <view class="kdlr over flex1">
  56. <view class="over tit">已发货</view>
  57. <view class="over tits">包裹正在等待揽收</view>
  58. <view class="over txt">淘宝 | 白色晚礼服平时可穿毕业洋装小白裙…</view>
  59. </view>
  60. </view>
  61. </block>
  62. <!-- 步骤条 -->
  63. <block v-if="type=='kdstep'">
  64. <view class="hfstep">
  65. <view class="hfslist flex">
  66. <view class="limg flexccc">
  67. <image :src="cira" class="imga"></image>
  68. </view>
  69. <view class="flex1">
  70. <view class="hfstit co01">运输中 11-25 12:24</view>
  71. <view class="hfstxt co27">【合肥市】快件已到达 合肥蜀山新产业园</view>
  72. </view>
  73. </view>
  74. <view class="hfslist flex">
  75. <view class="limg flexccc">
  76. <image :src="cirb" class="imgb"></image>
  77. </view>
  78. <view class="flex1">
  79. <view class="hfstit">11-25 07:23</view>
  80. <view class="hfstxt">【合肥市】快件已发往 合肥蜀山新产业园</view>
  81. </view>
  82. </view>
  83. <view class="hfslist flex">
  84. <view class="limg flexccc">
  85. <image :src="cirb" class="imgb"></image>
  86. </view>
  87. <view class="flex1">
  88. <view class="hfstit">11-25 07:20</view>
  89. <view class="hfstxt">【合肥市】快件已到达 合肥转运中心</view>
  90. </view>
  91. </view>
  92. </view>
  93. </block>
  94. <!-- 人员管理 -->
  95. <block v-if="type=='people'">
  96. <view class="carlist peolist" v-for="(ite,idx) in datainfo" :key="idx">
  97. <view class="ctop flexc">
  98. <image :src="house" class="imgs" v-if="ite.houseStatus==1"></image>
  99. <image :src="housea" class="imgs" v-if="ite.houseStatus==2"></image>
  100. <image :src="houseb" class="imgs" v-if="ite.houseStatus==3"></image>
  101. <image :src="housec" class="imgs" v-if="ite.houseStatus==4"></image>
  102. <view class="tit">{{ite.detailedAddress}}</view>
  103. <view class="flex1"></view>
  104. <view class="txt ca" v-if="ite.houseStatus==1">自住</view>
  105. <view class="txt cb" v-if="ite.houseStatus==2">出租</view>
  106. <view class="txt cc" v-if="ite.houseStatus==3">空闲</view>
  107. <view class="txt co6" v-if="ite.houseStatus==4">代售</view>
  108. </view>
  109. <view class="plists">
  110. <block v-for="(aite,aidx) in ite.residentInfoList">
  111. <view class="flexc pr mb12" :key="`peo${aidx}`" v-if="aidx==0" @click="getDetail(aite.residentId)"
  112. :data-idx="idx" :data-aidx="aidx" data-type="peo"
  113. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+aite.right+'px'"
  114. >
  115. <view class="plist flexc">
  116. <image :src="man" class="head" v-if="aite.residentGender==1"></image>
  117. <image :src="woman" class="head" v-else></image>
  118. <view class="flex1">
  119. <view class="ptit">{{aite.residentName}}
  120. <view class="btn btnc ml10" v-if="aite.isHouseholder=='Y'">户主</view>
  121. </view>
  122. <view class="ptxt">身份证号 | {{aite.residentIdCard}}</view>
  123. <view class="flexc">
  124. <view class="ptxt">性别 | {{aite.residentGender==1?'男':'女'}}</view>
  125. <view class="ptxt">年龄 | {{getAgeFromID(aite.residentIdCard)}}岁</view>
  126. </view>
  127. <view class="flexc" v-if="aite.residentAppearance">
  128. <view class="ptxt">人员面貌 | {{kaType(aite.residentAppearance,rymmList)}}</view>
  129. </view>
  130. </view>
  131. </view>
  132. <view class="spdel" v-if="aite.right>0&&checkPermi(['wuYe:residentInfo:remove'])" @click.stop="getDelFn(aite.residentId)">删除</view>
  133. </view>
  134. <view class="flexc pr mb12" :key="`peo${aidx}`" v-if="aidx>0&&ite.zhanflag" @click="getDetail(aite.residentId)"
  135. :data-idx="idx"
  136. :data-aidx="aidx" data-type="peo"
  137. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+aite.right+'px'"
  138. >
  139. <view class="plist flexc">
  140. <image :src="man" class="head" v-if="aite.residentGender==1"></image>
  141. <image :src="woman" class="head" v-else></image>
  142. <view class="flex1">
  143. <view class="ptit">{{aite.residentName}}
  144. <view class="btn btnc ml10" v-if="aite.isHouseholder=='Y'">户主</view>
  145. </view>
  146. <view class="ptxt">身份证号 | {{aite.residentIdCard}}</view>
  147. <view class="flexc">
  148. <view class="ptxt">性别 | {{aite.residentGender==1?'男':'女'}}</view>
  149. <view class="ptxt">年龄 | {{getAgeFromID(aite.residentIdCard)}}岁</view>
  150. </view>
  151. <view class="flexc" v-if="aite.residentAppearance">
  152. <view class="ptxt">人员面貌 | {{kaType(aite.residentAppearance,rymmList)}}</view>
  153. </view>
  154. </view>
  155. </view>
  156. <view class="spdel" v-if="aite.right>0&&checkPermi(['wuYe:residentInfo:remove'])" @click.stop="getDelFn(aite.residentId)">删除</view>
  157. </view>
  158. </block>
  159. <image :src="upimg" v-if="ite.residentInfoList.length>1" :class="ite.zhanflag?'act':''" class="upimg" @click="getZhan(idx)"></image>
  160. </view>
  161. </view>
  162. </block>
  163. <!-- 我的互动 -->
  164. <block v-if="type=='myhd'">
  165. <view class="mb12 pr" v-for="(ite,idx) in datainfo" :key="idx"
  166. :data-idx="idx"
  167. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+ite.right+'px'"
  168. >
  169. <view class="hdlist pd12 flex">
  170. <image :src="man" class="mhead flex0"></image>
  171. <view class="flex1 overh">
  172. <view class="flexc mb6">
  173. <view class="name flex1 over">喜欢耶耶耶</view>
  174. <view class="tit flex0 ml10">点赞了你的文章</view>
  175. <view class="time flex0 ml10">02-26</view>
  176. </view>
  177. <view class="flexc overh mb4">
  178. <view class="line bga"></view>
  179. <view class="txt over flex1">物业服务费缴费公告</view>
  180. <image :src="rimg" class="rimg ml10"></image>
  181. </view>
  182. </view>
  183. </view>
  184. <view class="spdel" v-if="ite.right>0&&checkPermi(['wuYe:residentInfo:remove'])" @click.stop="getDelFn(ite.residentId)">删除</view>
  185. </view>
  186. </block>
  187. <block v-if="type=='plsh'">
  188. <view class="mb12 pr" v-for="(ite,idx) in datainfo" :key="idx"
  189. :data-idx="idx"
  190. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+ite.right+'px'"
  191. >
  192. <view class="hdlist ">
  193. <view class="pd12 flex">
  194. <image :src="ite.avatar?baseUrl+ite.avatar:man" class="mhead flex0"></image>
  195. <view class="flex1 overh">
  196. <view class="flexc mb6">
  197. <view class="name flex1 over">{{ite.nickName}}</view>
  198. <view class="time flex0 ml10">02-26</view>
  199. </view>
  200. <view class="txt mb8">{{ite.commentContent}}</view>
  201. <view class="flexc overh mb2">
  202. <view class="line bgd"></view>
  203. <view class="txta over flex1">{{ite.communityTitle}}</view>
  204. <image :src="rimg" class="rimg ml10"></image>
  205. </view>
  206. </view>
  207. </view>
  208. <view class="shbtns flexc pd12" >
  209. <view class="btn bga" @click="getSh('4',ite.contentId)">不予展示</view>
  210. <view class="flex1"></view>
  211. <view class="btn bgb" @click="getSh('3',ite.contentId)">不通过</view>
  212. <view class="btn bgc" @click="getSh('2',ite.contentId)">通过</view>
  213. </view>
  214. </view>
  215. <view class="spdel" v-if="ite.right>0&&checkPermi(['wuYe:residentInfo:remove'])" @click.stop="getDelFn(ite.residentId)">删除</view>
  216. </view>
  217. </block>
  218. <!-- 我的点赞,收藏,评论 -->
  219. <block v-if="type=='wdhd'">
  220. <view class="mb12 pr" v-for="(ite,idx) in datainfo" :key="idx"
  221. :data-idx="idx"
  222. @touchstart="drawStart" @touchmove="drawMove" @touchend="drawEnd" :style="'right:'+ite.right+'px'">
  223. <view class="hdlist ">
  224. <view class="pd12 flex">
  225. <image :src="ite.avatar?baseUrl+ite.avatar:man" class="mhead flex0"></image>
  226. <view class="flex1 overh">
  227. <view class="flexc mb6">
  228. <view class="name flex1 over">{{ite.nickName}}</view>
  229. <view class="time flex0 ml10">{{ite.createTime}}</view>
  230. </view>
  231. <view class="txt mb8">{{ite.commentContent}}</view>
  232. <view class="flexc overh mb2">
  233. <view class="line bgd"></view>
  234. <view class="txta over flex1" v-if="tabval=='mypl'">{{ite.communityTitle}}</view>
  235. <view class="txta over flex1" v-else>{{ite.targetTitle}}</view>
  236. <image :src="rimg" class="rimg ml10"></image>
  237. </view>
  238. </view>
  239. </view>
  240. </view>
  241. <view class="spdel" v-if="ite.right>0&&checkPermi(['wuYe:residentInfo:remove'])" @click.stop="getDelFn(ite.residentId)">删除</view>
  242. </view>
  243. </block>
  244. <view class="shax" v-if="wtdt">{{wtdt}}</view>
  245. </block>
  246. <!-- 无数据 -->
  247. <view class="nodata" v-else>
  248. <image :src="noiconpimg"></image>
  249. <view>
  250. 暂无数据
  251. </view>
  252. </view>
  253. </view>
  254. </template>
  255. <script>
  256. import {selectDictValue} from "@/utils/common.js"
  257. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  258. import config from '@/config'
  259. export default{
  260. props:{
  261. datainfo: {
  262. type: Array,
  263. default () {
  264. return []
  265. }
  266. },
  267. wtdt:{
  268. type:String,
  269. default () {
  270. return ''
  271. }
  272. },
  273. type:{
  274. type:String,
  275. default () {
  276. return 0
  277. }
  278. },
  279. clcxList:{
  280. type: Array,
  281. default () {
  282. return []
  283. }
  284. },
  285. rymmList:{
  286. type: Array,
  287. default () {
  288. return []
  289. }
  290. },
  291. tabval:{
  292. type:String,
  293. default () {
  294. return ''
  295. }
  296. }
  297. },
  298. data(){
  299. return{
  300. house:require("@/health/static/house.png"),
  301. housea:require("@/health/static/housea.png"),
  302. houseb:require("@/health/static/houseb.png"),
  303. housec:require("@/health/static/housec.png"),
  304. noiconpimg:require("@/static/images/nodata.png"),
  305. upimg:require("@/mine/static/house/up.png"),
  306. cara:require("@/mine/static/house/cara.png"),
  307. carb:require("@/mine/static/house/carb.png"),
  308. edit:require("@/mine/static/edit.png"),
  309. cira:require('@/news/static/complaint/cira.png'),
  310. cirb:require('@/news/static/complaint/cirb.png'),
  311. man:require("@/health/static/man.png"),
  312. woman:require("@/health/static/woman.png"),
  313. rimg:require("@/static/images/rimga.png"),
  314. baseUrl:config.baseUrl,
  315. delBtnWidth:66,//左滑默认宽度
  316. }
  317. },
  318. mounted() {
  319. },
  320. methods:{
  321. checkPermi, checkRole,
  322. kaType(data, list) {
  323. return selectDictValue(list, data);
  324. },
  325. getDetail(e){
  326. this.$emit('getDetail',e)
  327. },
  328. getDelFn(e){
  329. var that=this;
  330. uni.showModal({
  331. title: '确认删除',
  332. content: "是否确认删除",
  333. cancelText: '取消',
  334. confirmText: '确认',
  335. success: function(res) {
  336. if (res.confirm) {
  337. that.$emit('getDelFn',e)
  338. } else if (res.cancel) {
  339. }
  340. }
  341. });
  342. },
  343. getSh(type,id){
  344. var that=this;
  345. var str="";
  346. if(type=='2'){
  347. str="通过"
  348. }else if(type=='3'){
  349. str="不通过"
  350. }else if(type=='4'){
  351. str="下架"
  352. }
  353. uni.showModal({
  354. title: '确认'+str,
  355. content: "是否确认"+str,
  356. cancelText: '取消',
  357. confirmText: '确认',
  358. success: function(res) {
  359. if (res.confirm) {
  360. var obj={
  361. status:type,
  362. contentId:id
  363. }
  364. that.$emit('getSh',obj)
  365. } else if (res.cancel) {
  366. }
  367. }
  368. });
  369. },
  370. getZhan(idx){
  371. // var obj=JSON.parse(JSON.stringify(this.datainfo))[idx]
  372. // obj.zhanflag=!obj.zhanflag;
  373. // this.datainfo.splice(idx,1,obj);
  374. this.datainfo[idx].zhanflag=!this.datainfo[idx].zhanflag
  375. },
  376. getDelFn(id){
  377. var that=this;
  378. uni.showModal({
  379. title: '确认删除',
  380. content: "是否确认删除",
  381. cancelText: '取消',
  382. confirmText: '确认',
  383. success: function(res) {
  384. if (res.confirm) {
  385. that.$emit('getDelFn',id)
  386. } else if (res.cancel) {
  387. }
  388. }
  389. });
  390. },
  391. getAgeFromID(idNumber) {
  392. if(idNumber){
  393. const birthDateStr = idNumber.substring(6, 14);
  394. const birthYear = parseInt(birthDateStr.substring(0, 4));
  395. const birthMonth = parseInt(birthDateStr.substring(4, 6));
  396. const birthDay = parseInt(birthDateStr.substring(6, 8));
  397. const today = new Date();
  398. const currentYear = today.getFullYear();
  399. const currentMonth = today.getMonth() + 1;
  400. const currentDay = today.getDate();
  401. let age = currentYear - birthYear;
  402. if (currentMonth < birthMonth || (currentMonth === birthMonth && currentDay < birthDay)) {
  403. age--;
  404. }
  405. return age;
  406. }
  407. },
  408. getPreview(idx,arr) {
  409. var newArr=[];
  410. arr.forEach(ite=>{
  411. var ds=this.baseUrl+ite
  412. newArr.push(ds)
  413. })
  414. uni.previewImage({
  415. urls: newArr,
  416. current:idx,
  417. success: function(data) {},
  418. fail: function(err) {}
  419. });
  420. },
  421. //开始触摸滑动
  422. drawStart(e) {
  423. // console.log("开始触发");
  424. var touch = e.touches[0];
  425. this.startX = touch.clientX;
  426. },
  427. //触摸滑动
  428. drawMove(e) {
  429. var idx=e.currentTarget.dataset.idx
  430. var aidx=e.currentTarget.dataset.aidx
  431. var type=e.currentTarget.dataset.type;
  432. for (var index in this.datainfo) {
  433. if(type&&type=='peo'){
  434. for(var i in this.datainfo[idx].residentInfoList){
  435. this.$set(this.datainfo[idx].residentInfoList[i],'right',0);
  436. }
  437. }else{
  438. this.$set(this.datainfo[index],'right',0);
  439. }
  440. }
  441. var touch = e.touches[0];
  442. var item = this.datainfo[idx];
  443. var disX = this.startX - touch.clientX;
  444. if (disX >= 20) {
  445. if (disX > this.delBtnWidth) {
  446. disX = this.delBtnWidth;
  447. }
  448. if(type&&type=='peo'){
  449. this.$set(this.datainfo[idx].residentInfoList[aidx],'right',disX);
  450. }else{
  451. this.$set(this.datainfo[idx],'right',disX);
  452. }
  453. // this.csListArrl[idx].right=disX
  454. } else {
  455. // this.csListArrl[idx].right=0
  456. this.$set(this.datainfo[idx],'right',0);
  457. }
  458. },
  459. //触摸滑动结束
  460. drawEnd(e) {
  461. // console.log("滑动结束");
  462. var idx=e.currentTarget.dataset.idx
  463. var item = this.datainfo[idx];
  464. if (item.right >= this.delBtnWidth / 2) {
  465. // this.datainfo[idx].right=this.delBtnWidth
  466. // this.$set(this.datainfo[idx],'right',this.delBtnWidth);
  467. } else {
  468. this.datainfo[idx].right=0
  469. }
  470. },
  471. }
  472. }
  473. </script>
  474. <style lang="scss" scoped>
  475. .flex{display: flex;}
  476. .flexc{display: flex;align-items: center;}
  477. .mb10{margin-bottom: 20rpx;}
  478. .carlist{background: #FFFFFF;border-radius: 20rpx;margin-bottom: 24rpx;
  479. .carltop{min-height: 154rpx;border-bottom: 2rpx solid #E5E5E5;
  480. .tit{font-weight: bold;font-size: 32rpx;}
  481. .txt{font-weight: 500;font-size: 26rpx;color: #272727;}
  482. .txtbtn{min-width: 82rpx;
  483. height: 32rpx;font-weight: 500;font-size: 20rpx;color: #45CB99;
  484. border-radius: 16rpx;border: 1px solid #45CB99;margin-left: 12rpx;}
  485. .cara{flex: 0 0 auto;width: 232rpx;height: 74rpx;margin-right: 40rpx;}
  486. .carb{flex: 0 0 auto;width: 278rpx;height: 130rpx;}
  487. }
  488. .carlf{padding:26rpx 0 10rpx;
  489. .clflist{font-weight: 500;font-size: 26rpx;color: #666666;margin-bottom: 16rpx;}
  490. }
  491. }
  492. // 收货地址
  493. .adrlist{border-bottom: 2rpx solid #E5E5E5;padding: 34rpx 0 34rpx 8rpx;
  494. .tit{font-weight: 500;font-size: 22rpx;color: #666666;}
  495. .txt{font-size: 28rpx;color: #272727;font-weight: bold;}
  496. .txts{font-weight: 500;font-size: 26rpx;color: #272727;}
  497. .btns{font-weight: 500;font-size: 22rpx;color: #0256FD;padding: 2rpx 14rpx;display:inline-block;background: #C9DBFF;
  498. border-radius: 10rpx;}
  499. .adrr{width: 40rpx;height: 40rpx;flex: 0 0 auto;margin-left: 12rpx;
  500. image{width: 22rpx;height: 22rpx;}
  501. }
  502. &.act{
  503. .tit{color: #0256FD;}
  504. .txt{color: #0256FD;}
  505. .txts{color: #0256FD;}
  506. }
  507. }
  508. // 快递
  509. .kdlists{padding: 24rpx 26rpx;background-color: #FFFFFF;border-radius: 20rpx;margin-bottom: 24rpx;
  510. .kdll{width: 140rpx;height: 140rpx;border-radius: 10rpx;margin-right: 32rpx;flex: 0 0 auto;}
  511. .kdlr{
  512. .tit{font-size: 30rpx;color: #272727;font-weight: bold;margin-bottom: 18rpx;margin-top: 4rpx;}
  513. .tits{font-size: 24rpx;color: #272727;font-weight: 500;margin-bottom: 14rpx;}
  514. .txt{font-weight: 500;font-size: 24rpx;color: #AAAAAA;}
  515. }
  516. }
  517. // 快递步骤条
  518. .hfstep{padding: 0 32rpx 44rpx 32rpx;
  519. .hfslist{padding-bottom: 44rpx;position: relative;
  520. &::before{content: '';position: absolute;left: 14rpx;top:14rpx;height: 100%;width: 2rpx;background: #E6E6E6;}
  521. .limg{width: 30rpx;height: 30rpx;margin-right: 22rpx;flex: 0 0 auto;margin-top:3rpx;
  522. .imga{width: 30rpx;height: 30rpx;}
  523. .imgb{width: 18rpx;height: 18rpx;}
  524. }
  525. .hfstit{font-weight: bold;font-size: 26rpx;color: #666666;line-height: 36rpx;margin-bottom: 24rpx;}
  526. .hfstxt{font-weight: 500;font-size: 26rpx;color: #666666;line-height: 36rpx;padding-left: 8rpx;}
  527. }
  528. }
  529. .carlist{background: #FFFFFF;border-radius: 20rpx;margin-bottom: 24rpx;
  530. .ctop{border-bottom: 2rpx solid #E5E5E5;padding:26rpx 24rpx;
  531. .imgs{width: 40rpx;height: 42rpx;margin-right: 30rpx;}
  532. .tit{font-size: 32rpx;color: #272727;font-weight: bold;margin-right: 14rpx;}
  533. .txt{font-weight: 500;font-size: 26rpx;
  534. &.ca{color: #3565ED;}
  535. &.cb{color: #FE5A0E;}
  536. &.cc{color: #28C529;}
  537. }
  538. .txta{font-weight: 500;font-size: 24rpx;color: #AAAAAA;}
  539. .num{font-size: 24rpx;color: #AAAAAA;}
  540. }
  541. .btn{height: 34rpx;border-radius: 18rpx;display: flex;align-items: center;justify-content: center;padding: 0 10rpx;font-size: 22rpx;margin-right: 24rpx;
  542. &.btna{border: 2rpx solid #06C770;color: #06C770;}
  543. &.btnb{border: 2rpx solid #3565ED;color: #3565ED;}
  544. &.btnc{border: 2rpx solid #FE5A0E;color: #FE5A0E;}
  545. &.btnbga{border: 1px solid #0156FE;color: #3565ED;background: #DFEAFF;height: 36rpx;}
  546. &.btnbgb{border: 1px solid #C1C1C1;color: #666666;background: #F1F1F1;height: 36rpx;}
  547. &.btnbgc{border: 1px solid #FE5A0E;color:#FE5A0E;background:#FFEEE6;height: 36rpx;}
  548. }
  549. }
  550. // 人员
  551. .peolist{
  552. .ctop{padding: 24rpx 24rpx 22rpx;}
  553. .imgs{margin-right: 16rpx !important;}
  554. .tit{font-size: 28rpx !important;}
  555. .plists{padding: 30rpx 24rpx 6rpx;
  556. .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;
  557. .head{width: 96rpx;height: 98rpx;margin-right: 32rpx;flex: 0 0 auto;}
  558. .ptit{font-weight: bold;font-size: 30rpx;color: #272727;display: flex;align-items: center;margin-bottom: 14rpx;}
  559. .ptxt{font-weight: 500;font-size: 26rpx;color: #666666;line-height: 36rpx;margin-bottom: 14rpx;min-width: 176rpx;}
  560. }
  561. }
  562. .upimg{width: 26rpx;height: 22rpx;display: block;transform: rotate(180deg);transition: all 0.3s;margin: 0 auto 18rpx;
  563. &.act{transform: rotate(0deg);}
  564. }
  565. }
  566. // 互动
  567. .pd12{padding: 24rpx;}
  568. .hdlist{background: #FFFFFF;border-radius: 20rpx;position: relative;z-index: 1;
  569. .mhead{width: 56rpx;height: 56rpx;margin-right: 20rpx;}
  570. .name{font-size: 28rpx;font-weight: bold;color: #272727;height: 56rpx;line-height: 56rpx;}
  571. .tit{font-weight: 500;font-size: 22rpx;color: #666666;}
  572. .time{font-weight: 500;font-size: 22rpx;color: #666666;}
  573. .line{width: 6rpx;height: 28rpx;border-radius: 4rpx;margin-right: 12rpx;
  574. &.bga{background: #FACA7D;}
  575. &.bgb{background: #86AFFF;}
  576. &.bgc{background: #93E9C2;}
  577. &.bgd{background: #DADADA;}
  578. }
  579. .txt{font-weight: 500;font-size: 26rpx;color: #272727;line-height: 36rpx;}
  580. .txta{font-weight: 500;font-size: 26rpx;color: #666666;}
  581. .rimg{width: 12rpx;height: 22rpx;}
  582. .shbtns{border-top: 2rpx solid #DADADA;
  583. .btn{border-radius: 20rpx;min-width: 110rpx;box-sizing: border-box;padding: 0 16rpx;
  584. height: 52rpx;display: flex;align-items: center;justify-content: center;flex:0 0 auto;margin-left: 20rpx;
  585. &.bga{border: 2rpx solid #06C770;background: #DAEFE6;color: #06C770;margin-left: 0;}
  586. &.bgb{border: 2rpx solid #FF6969;;background: #FFE7E7;color: #FF6969;}
  587. &.bgc{background: #0256FD;color: #FFFFFF;}
  588. }
  589. }
  590. }
  591. // 无数据
  592. .nodata{display: flex;flex-direction: column;align-items: center;
  593. image{width: 440rpx;height: 440rpx;}
  594. view{font-size: 30rpx;color: #666666;font-weight: bold;}
  595. }
  596. </style>