mine.vue 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854
  1. <template>
  2. <view>
  3. <u-navbar back-text="我的" back-icon-size="0" :customBack="customBack" back-icon-color="#ffffff"
  4. :background="{backgroundColor: '#2795FD',}" :back-text-style="{color: '#ffffff'}"></u-navbar>
  5. <view class="top">
  6. <view class="photo">
  7. <u-avatar :src="src" :gender="userInfo.gender" ></u-avatar>
  8. </view>
  9. <!-- <view class="login">
  10. 请登录
  11. </view> -->
  12. <!-- 已登录 -->
  13. <view class="logined">
  14. <view class="name">
  15. <template v-if="userInfo&&userInfo.id">
  16. 你好,{{userInfo.realName?userInfo.realName:'用户'+userInfo.id.slice(0,3)}}
  17. </template>
  18. <template v-else>
  19. 未登录
  20. </template>
  21. <view class="img-box" v-if="userInfo.status==1">
  22. <img src="@/assets/img/riFill-shield-user-fill@1x.png" alt="">
  23. </view>
  24. </view>
  25. <view class="tel" @click="changePhone" v-if="userInfo&&userInfo.id">
  26. {{userInfo.phone}}
  27. <img src="@/pages/tab/as-components/riLine-edit-2-line.svg">
  28. </view>
  29. </view>
  30. </view>
  31. <!-- 求职信息 -->
  32. <view class="card card1">
  33. <view class="title">
  34. 求职信息
  35. <u-icon size="34" v-if="ck1()" name="checkmark-circle-fill" style="color: #54b86c;"></u-icon>
  36. <u-icon size="34" @click="showIcon(1)" v-else name="error-circle-fill" style="color: #dc4441;"></u-icon>
  37. </view>
  38. <u-grid :col="3" :border="false">
  39. <u-grid-item @click="gotoUrl0('pages/packages/mine/myJobInformation/myJobInformation')">
  40. <u-badge :count="num3==2?0:(num3==0?'未创建':'审批中')"
  41. :type="num3==0?'error':'warning'"
  42. size="mini" :offset="[18,4]"></u-badge>
  43. <view class="icon">
  44. <img src="@/assets/img/riLine-folder-user-line@1x.png" alt="">
  45. </view>
  46. <view class="grid-text">我的简历</view>
  47. </u-grid-item>
  48. <u-grid-item @click="gotoUrl1('pages/packages/mine/myJobInformation/myRegistration?c=0')">
  49. <view class="icon">
  50. <img src="@/assets/img/riLine-todo-line@1x.png" alt="">
  51. </view>
  52. <view class="grid-text">我的报名</view>
  53. </u-grid-item>
  54. <u-grid-item @click="gotoUrl1('pages/packages/mine/myJobInformation/myRegistration?c=1')">
  55. <u-badge :count="num1" size="mini" :offset="[28,34]"></u-badge>
  56. <view class="icon">
  57. <img src="@/assets/img/riLine-mail-star-line@1x.png" alt="">
  58. </view>
  59. <view class="grid-text">收到邀请</view>
  60. </u-grid-item>
  61. <u-grid-item
  62. @click="gotoUrl0('pages/packages/mine/privacy')">
  63. <view class="icon">
  64. <img src="@/assets/img/riLine-shield-keyhole-line@3x.png" alt="">
  65. </view>
  66. <view class="grid-text">隐私设置</view>
  67. </u-grid-item>
  68. </u-grid>
  69. </view>
  70. <!-- 用工服务 -->
  71. <view class="card ">
  72. <view class="title">
  73. 用工服务
  74. <u-icon size="34" v-if="ck2()" name="checkmark-circle-fill" style="color: #54b86c;"></u-icon>
  75. <u-icon size="34" @click="showIcon(2)" v-else name="error-circle-fill" style="color: #dc4441;"></u-icon>
  76. </view>
  77. <u-grid :col="4" :border="false">
  78. <u-grid-item @click="gotoUrl2('pages/packages/mine/employmentService/laborManagement/laborManagement')">
  79. <view class="icon">
  80. <img src="@/assets/img/riLine-folder-2-line@1x.png" alt="">
  81. </view>
  82. <view class="grid-text">用工管理</view>
  83. </u-grid-item>
  84. <u-grid-item @click="gotoUrl2('pages/packages/mine/employmentService/receiveRegistration?c=0')">
  85. <u-badge :count="num2" size="mini" :offset="[28,34]"></u-badge>
  86. <view class="icon">
  87. <img src="@/assets/img/riLine-inbox-archive-line@1x.png" alt="">
  88. </view>
  89. <view class="grid-text">收到报名</view>
  90. </u-grid-item>
  91. <u-grid-item @click="gotoUrl2('pages/packages/mine/employmentService/receiveRegistration?c=1')">
  92. <view class="icon">
  93. <img src="@/assets/img/riLine-time-line@1x.png" alt="">
  94. </view>
  95. <view class="grid-text">邀请记录</view>
  96. </u-grid-item>
  97. <u-grid-item @click="gotoUrl2('pages/packages/mine/employmentService/shareEmployment')">
  98. <view class="icon">
  99. <img src="@/assets/img/riLine-service-line@1x.png" alt="">
  100. </view>
  101. <view class="grid-text">共享用工</view>
  102. </u-grid-item>
  103. </u-grid>
  104. </view>
  105. <!-- 其他服务 -->
  106. <view class="card ">
  107. <view class="title">
  108. 其他服务
  109. </view>
  110. <u-grid :col="3" :border="false">
  111. <u-grid-item @click="toAuthentication">
  112. <u-icon v-if="ck1()||ck2()" name="checkmark-circle-fill" style="color: #54b86c;"
  113. class="checked"></u-icon>
  114. <u-icon v-else name="error-circle-fill" style="color: #dc4441;" class="badge-icon"></u-icon>
  115. <view class="icon">
  116. <img src="@/assets/img/riLine-shield-user-line@1x.png" alt="">
  117. </view>
  118. <view class="grid-text">实名认证</view>
  119. </u-grid-item>
  120. <!-- <u-grid-item @click="showPhoneMethod">
  121. <view class="icon">
  122. <img src="@/assets/img/riLine-customer-service-line@1x.png" alt="">
  123. </view>
  124. <view class="grid-text">联系客服</view>
  125. </u-grid-item> -->
  126. <u-grid-item >
  127. <button class="btncontact" open-type="contact">
  128. <view class="icon">
  129. <img src="@/assets/img/riLine-customer-service-line@1x.png" alt="">
  130. </view>
  131. <view class="grid-text">联系客服</view>
  132. </button>
  133. </u-grid-item>
  134. <!-- <u-grid-item>
  135. <view class="icon">
  136. <img src="@/assets/img/riLine-logout-box-r-line@1x.png" alt="">
  137. </view>
  138. <view class="grid-text">退出登录</view>
  139. </u-grid-item> -->
  140. </u-grid>
  141. </view>
  142. <!-- 登录弹窗 -->
  143. <u-popup v-model="show" mode="center" border-radius="24" :closeable="true" @close="close">
  144. <view class="u-mode-center-main">
  145. <view class="title">
  146. 登录荆州经开区共享用工平台
  147. </view>
  148. <view>
  149. <button class="login-btn" @click="decryptPhoneNumberH5" open-type="getPhoneNumber"
  150. @getphonenumber="decryptPhoneNumber">
  151. <u-icon name="phone-fill" size="46"></u-icon> <text>手机号码一键登录</text>
  152. </button>
  153. </view>
  154. <view class="radio" v-if="false">
  155. <!-- <radio></radio>
  156. <view class="agreement">
  157. 阅读并同意<text style="color: #2795FD">《用户隐私协议》</text>
  158. </view> -->
  159. <u-radio-group v-model="value">
  160. <u-radio active-color="red">阅读并同意<text style="color: #2795FD">《用户隐私协议》</text></u-radio>
  161. </u-radio-group>
  162. </view>
  163. </view>
  164. </u-popup>
  165. <u-modal v-model="showPhone" @confirm="confirmPhone" :confirm-text="confirmText" confirm-color="#606266"
  166. :show-cancel-button="true" ref="uModal" :asyncClose="true" title="客服电话" :content="content"
  167. :content-style="{fontSize: '24px',color: '#101010'}"></u-modal>
  168. <tabbar :current="4"></tabbar>
  169. </view>
  170. </template>
  171. <script>
  172. import * as API from '@/apis/pagejs/tab.js'
  173. import * as API_weixin from '@/apis/weixin.js'
  174. import tabbar from "@/components/Tabbar.vue"
  175. export default {
  176. components: {
  177. tabbar
  178. },
  179. data() {
  180. return {
  181. src: '',
  182. show: false,
  183. value: 'false',
  184. userInfo: {},
  185. showPhone: false,
  186. confirmText: '拨打电话',
  187. content: "",
  188. num1: 0,
  189. num2: 0,
  190. num3: 0,//0 未创建 ,1 审批中, 2 成功
  191. isReady:false,
  192. updateintention:false,
  193. intentionList:[
  194. {
  195. value: '1',
  196. label: '求职中'
  197. },
  198. {
  199. value: '2',
  200. label: '已入职/勿扰'
  201. }
  202. ],
  203. }
  204. },
  205. onLoad() {
  206. this.userInfo = this.carhelp.getPersonInfo()
  207. this.findByOpenId();
  208. },
  209. onShow(){
  210. if(this.isReady){
  211. this.findByOpenId();
  212. }
  213. },
  214. methods: {
  215. changePhone(){
  216. var _this=this;
  217. uni.showModal({
  218. title: '提示',
  219. content: '是否修改当前手机号',
  220. //confirmText:"",
  221. showCancel: true,
  222. success: function(res) {
  223. if (res.confirm) {
  224. _this.show=true
  225. //uni.navigateBack()
  226. } else if (res.cancel) {
  227. //.log('用户点击取消');
  228. }
  229. }
  230. });
  231. },
  232. updateintentionBtn(e){
  233. console.log(e);
  234. var intention=e[0].value
  235. uni.showLoading({
  236. title: "加载中",
  237. mask: true,
  238. })
  239. API.updateIntention({
  240. intention: intention
  241. }).then((res) => {
  242. uni.hideLoading();
  243. this.userInfo.intention=intention;
  244. }).catch(error => {
  245. this.showPhone = false;
  246. uni.hideLoading();
  247. })
  248. },
  249. showIcon(i) {
  250. if (i == 1) {
  251. uni.showToast({
  252. title: "未进行实名认证",
  253. icon: "none"
  254. })
  255. }
  256. if (i == 2) {
  257. uni.showToast({
  258. title: "未进行企业认证",
  259. icon: "none"
  260. })
  261. }
  262. },
  263. ck1() {
  264. var user = this.carhelp.getPersonInfo();
  265. if (user.status != 1) {
  266. return false
  267. }
  268. return true
  269. },
  270. ck2() {
  271. var enterpriseInfo = this.carhelp.getPersonInfoPlus().enterpriseInfo;
  272. if (!enterpriseInfo || enterpriseInfo.status != 1) {
  273. return false
  274. }
  275. return true
  276. },
  277. gotoUrl1(url) {
  278. if (this.ck1()) {
  279. } else {
  280. uni.showToast({
  281. icon: 'none',
  282. title: "当前操作需要实名认证"
  283. })
  284. return
  285. }
  286. uni.navigateTo({
  287. url: "/" + url
  288. })
  289. },
  290. gotoUrl0(url) {
  291. var user = this.carhelp.getPersonInfo();
  292. if (!user.id) {
  293. uni.showToast({
  294. title:"请登录",
  295. icon:"none"
  296. })
  297. return false
  298. }
  299. uni.navigateTo({
  300. url: "/" + url
  301. })
  302. },
  303. gotoUrl2(url) {
  304. if (this.ck2()) {
  305. } else {
  306. uni.showToast({
  307. icon: 'none',
  308. title: "当前操作需要进行企业认证"
  309. })
  310. return
  311. }
  312. uni.navigateTo({
  313. url: "/" + url
  314. })
  315. },
  316. gotoMyJobInformation() {
  317. //zkx 需要认证
  318. uni.navigateTo({
  319. url: "/pages/packages/mine/myJobInformation/myJobInformation"
  320. })
  321. },
  322. confirmPhone() {
  323. this.showPhone = false;
  324. uni.makePhoneCall({
  325. phoneNumber: this.content //仅为示例
  326. });
  327. },
  328. showPhoneMethod() {
  329. if (this.content == "") {
  330. uni.showLoading({
  331. title: "加载中",
  332. mask: true,
  333. })
  334. API_weixin.findValueByName({
  335. name: '客服电话'
  336. }).then((res) => {
  337. this.content = res.data
  338. uni.hideLoading();
  339. this.showPhone = true;
  340. }).catch(error => {
  341. this.showPhone = false;
  342. uni.hideLoading();
  343. })
  344. } else {
  345. this.showPhone = true;
  346. }
  347. },
  348. getNum1() {
  349. API.myRegistrationNotReadNum().then((res) => {
  350. this.num1 = res.data.notReadNum
  351. }).catch(error => {
  352. //.log(error)
  353. })
  354. },
  355. getNum2() {
  356. API.myReceivedRegistrationNotReadNum().then((res) => {
  357. this.num2 = res.data.notReadNum
  358. }).catch(error => {
  359. //.log(error)
  360. })
  361. },
  362. findByOpenId() {
  363. uni.showLoading({
  364. title: "加载中",
  365. mask: true,
  366. })
  367. API_weixin.findByOpenId({
  368. openId: this.carhelp.getOpenId(),
  369. noerror: true
  370. }).then((res) => {
  371. this.isReady=true;
  372. this.carhelp.setPersonInfo(res.data.regUser);
  373. this.carhelp.setToken(res.data.token);
  374. this.carhelp.setPersonInfoPlus(res.data);
  375. this.userInfo = res.data.regUser;
  376. this.src = this.userInfo.photo
  377. uni.hideLoading();
  378. this.show = false;
  379. var jobInformationInfo = this.carhelp.getPersonInfoPlus().jobInformationInfo;
  380. if(jobInformationInfo==null){
  381. this.num3=0
  382. }else{
  383. if(jobInformationInfo.status==1){
  384. this.num3=2
  385. }else{
  386. this.num3=1
  387. }
  388. }
  389. if (this.ck1()) {
  390. this.getNum1()
  391. }
  392. if (this.ck2()) {
  393. this.getNum2()
  394. }
  395. }).catch(error => {
  396. //.log("11111")
  397. this.carhelp.logoff();
  398. this.userInfo = {};
  399. uni.hideLoading();
  400. this.show = true;
  401. this.isReady=true;
  402. // uni.showToast({icon: 'none',
  403. // title: error
  404. // })
  405. //this.getPhone()
  406. })
  407. },
  408. close() {
  409. // #ifdef MP-WEIXIN
  410. if (this.userInfo.id) {
  411. } else {
  412. uni.reLaunch({
  413. url: "/"
  414. })
  415. }
  416. // #endif
  417. },
  418. changePhoneUser(phone) {
  419. console.log("createUser",phone)
  420. API.changePhone(phone).then((res2) => {
  421. this.findByOpenId()
  422. }).catch(error2 => {
  423. uni.showToast({
  424. icon: 'none',
  425. title: error2
  426. })
  427. })
  428. },
  429. createUser(phone) {
  430. console.log("createUser",phone)
  431. API.createUser({
  432. phone: phone,
  433. openId: this.carhelp.getOpenId()
  434. }).then((res2) => {
  435. API_weixin.saveLoginRecord({
  436. openId:this.carhelp.getOpenId()
  437. }).then((res) => {
  438. console.log('App createUser 记录用户登陆')
  439. }).catch(error => {
  440. console.log('App createUser 记录用户登陆 失败')
  441. })
  442. this.findByOpenId()
  443. }).catch(error2 => {
  444. uni.showToast({
  445. icon: 'none',
  446. title: error2
  447. })
  448. })
  449. },
  450. decryptPhoneNumberH5() {
  451. // #ifdef H5
  452. this.show = false
  453. var _this = this
  454. uni.showModal({
  455. title: '输入手机号测试',
  456. editable: true,
  457. //content: '这是一个模态弹窗',
  458. success: function(res) {
  459. if (res.confirm) {
  460. //_this.createUser(res.content)
  461. if (_this.userInfo.id) {
  462. _this.changePhoneUser(res.content)
  463. } else{
  464. _this.createUser(res.content)
  465. }
  466. } else if (res.cancel) {
  467. //.log('用户点击取消');
  468. }
  469. }
  470. });
  471. // #endif
  472. },
  473. decryptPhoneNumber(e) {
  474. console.log(e, this.carhelp.getOpenId())
  475. var _this=this;
  476. if (!e.detail.code&&e.detail.errMsg == 'getPhoneNumber:ok') {
  477. uni.login({
  478. provider: 'weixin', //使用微信登录
  479. success: function(loginRes) {
  480. API_weixin.decryptData({
  481. code: loginRes.code,
  482. encryptedData: e.detail.encryptedData,
  483. iv: e.detail.iv
  484. }).then((res) => {
  485. console.log(res)
  486. if (res.data) {
  487. if (_this.userInfo.id) {
  488. _this.changePhoneUser(res.data)
  489. } else{
  490. _this.createUser(res.data)
  491. }
  492. } else {
  493. uni.showToast({
  494. icon: 'none',
  495. title: "获取手机号失败,请检查"
  496. })
  497. }
  498. }).catch(error => {
  499. uni.showToast({
  500. icon: 'none',
  501. title: error
  502. })
  503. //this.getPhone()
  504. })
  505. }
  506. });
  507. } else {
  508. uni.showLoading({
  509. title: "加载中",
  510. mask: true,
  511. })
  512. API_weixin.findUserPhoneNumber(e.detail.code).then((res) => {
  513. if (res.data) {
  514. this.createUser(res.data)
  515. } else {
  516. uni.showToast({
  517. icon: 'none',
  518. title: "获取手机号失败,请检查"
  519. })
  520. }
  521. }).catch(error => {
  522. uni.showToast({
  523. icon: 'none',
  524. title: error
  525. })
  526. //this.getPhone()
  527. })
  528. }
  529. },
  530. customBack() {
  531. },
  532. toAuthentication() {
  533. var user = this.carhelp.getPersonInfo();
  534. if (!user.id) {
  535. uni.showToast({
  536. title:"请登录",
  537. icon:"none"
  538. })
  539. return false
  540. }
  541. uni.navigateTo({
  542. url: '/pages/packages/mine/otherServices/authentication'
  543. })
  544. },
  545. toShareEmployment() {
  546. uni.navigateTo({
  547. url: '/pages/packages/mine/employmentService/shareEmployment'
  548. })
  549. }
  550. }
  551. }
  552. </script>
  553. <style>
  554. page {
  555. background: #F0F0F2;
  556. padding-bottom: 150px;
  557. }
  558. </style>
  559. <style lang="scss" scoped>
  560. .showImg {
  561. width: 38rpx;
  562. height: 38rpx;
  563. }
  564. .top {
  565. display: flex;
  566. align-items: center;
  567. padding: 40rpx 32rpx 88rpx;
  568. background: url(@/assets/img/mineCover.png), linear-gradient(180deg, rgba(39, 149, 253, 1) 0%, rgba(118, 182, 255, 1) 100%);
  569. background-repeat: no-repeat;
  570. background-position: right;
  571. .photo {
  572. /deep/.u-avatar {
  573. width: 120rpx !important;
  574. height: 120rpx !important;
  575. box-shadow: 0px 1px 3px 0px rgba(39, 149, 253, 100);
  576. border: 2px solid rgba(255, 255, 255, 1);
  577. }
  578. }
  579. .login {
  580. color: rgba(255, 255, 255, 1);
  581. font-size: 40rpx;
  582. text-align: left;
  583. font-family: 'PingFangSC-medium';
  584. margin-left: 24rpx;
  585. }
  586. .logined {
  587. color: rgba(255, 255, 255, 1);
  588. margin-left: 24rpx;
  589. .name {
  590. font-size: 40rpx;
  591. font-family: 'PingFangSC-medium';
  592. display: flex;
  593. align-items: center;
  594. .img-box {
  595. margin-left: 8rpx;
  596. overflow: hidden;
  597. img {
  598. width: 40rpx;
  599. height: 40rpx;
  600. vertical-align: middle;
  601. z-index: 999;
  602. position: relative;
  603. }
  604. }
  605. }
  606. .tel {
  607. margin-top: 8rpx;
  608. font-size: 32rpx;
  609. display: flex;
  610. }
  611. }
  612. }
  613. .card1 {
  614. margin-top: -32rpx !important;
  615. }
  616. .card {
  617. background-color: #fff;
  618. border-radius: 12px;
  619. margin: 32rpx;
  620. padding: 32rpx;
  621. /deep/.u-grid-item {
  622. width: 25% !important;
  623. }
  624. .title {
  625. color: rgba(16, 16, 16, 1);
  626. font-size: 40rpx;
  627. margin-bottom: 20rpx;
  628. }
  629. .grid-text {
  630. color: rgba(51, 51, 51, 1);
  631. margin-top: 8rpx;
  632. }
  633. .icon {
  634. width: 56rpx;
  635. height: 56rpx;
  636. img {
  637. width: 100%;
  638. height: 100%;
  639. }
  640. }
  641. .badge-icon {
  642. position: absolute;
  643. top: 24rpx;
  644. right: 40rpx;
  645. width: 30rpx;
  646. height: 30rpx;
  647. }
  648. .checked {
  649. position: absolute;
  650. bottom: 72rpx;
  651. right: 40rpx;
  652. width: 30rpx;
  653. height: 30rpx;
  654. }
  655. }
  656. // 弹窗
  657. .u-mode-center-main {
  658. width: 560rpx !important;
  659. border-radius: 12px;
  660. padding: 80rpx 48rpx;
  661. .title {
  662. color: rgba(16, 16, 16, 1);
  663. font-size: 32rpx;
  664. font-family: 'PingFangSC-medium';
  665. }
  666. .login-btn {
  667. background-color: rgba(0, 188, 99, 1);
  668. color: #fff;
  669. padding: 8rpx 70rpx;
  670. margin-top: 56rpx;
  671. margin-bottom: 16rpx;
  672. border-radius: 8px;
  673. display: flex;
  674. font-size: 32rpx;
  675. text {
  676. margin-left: 8rpx;
  677. }
  678. }
  679. .radio {
  680. display: inline-block;
  681. width: 100%;
  682. display: flex;
  683. justify-content: center;
  684. font-size: 24rpx;
  685. color: #777777;
  686. margin-left: 20rpx;
  687. .uni-radio-input {
  688. width: 24rpx;
  689. height: 24rpx;
  690. }
  691. .uni-radio-input-checked:before {
  692. font-size: 24rpx;
  693. background-color: rgb(0, 122, 255);
  694. border-color: rgb(0, 122, 255);
  695. }
  696. }
  697. }
  698. .btncontact:after{
  699. content: none;
  700. }
  701. .btncontact{
  702. display: flex;
  703. flex-direction: column;
  704. background: white;
  705. padding:0;
  706. .icon{
  707. margin: 0 auto;
  708. }
  709. .grid-text{
  710. margin-top: 8rpx;
  711. font-size: 28rpx;
  712. line-height: 44rpx;
  713. }
  714. }
  715. .intentionClass{
  716. font-size: 32rpx;
  717. float: right;
  718. .intentionClassSpan{
  719. margin-left: 8rpx;
  720. }
  721. .intentionClassSpan1{
  722. color: #4caf50;
  723. }
  724. .intentionClassSpan2{
  725. color: #ff5722;
  726. }
  727. }
  728. </style>