Tabindex.vue 19 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911
  1. <template name="apps">
  2. <view>
  3. <swiper class="swiper" circular :indicator-dots="true" :autoplay="true" :interval="3000" :duration="800">
  4. <swiper-item v-for="(item, index) in picture" :key="index">
  5. <image :src="item" class="swiper-item"></image>
  6. </swiper-item>
  7. </swiper>
  8. <view >
  9. <view class="btn-box-1-1 mart-t">
  10. 涉企政策集锦
  11. </view>
  12. </view>
  13. <view @click="totongxunlu5" style="display: flex;margin-top: 30rpx;margin-left: 20rpx;padding-left:20rpx ;margin-right:20rpx ;background-color: #FFFF0021;height: 92rpx;align-items: center;">
  14. <image src="/static/img/laba.png" style="width: 42rpx;height: 42rpx;"></image>
  15. <swiper class="swiper2" vertical circular :autoplay="true" :interval="3000" :duration="800">
  16. <swiper-item v-for="(item, index) in picture" :key="index">
  17. <view style="color: #F9AE3D; font-size: 28rpx;padding-left: 10rpx;display: flex;align-items: center;"> 盐城市关于加快推进新型工业化若干政策措施的通知 </view>
  18. </swiper-item>
  19. </swiper>
  20. </view>
  21. <view class="line-box">
  22. <view class="center-box">
  23. <view class="kuai-text">快捷入口</view>
  24. <mescroll-body ref="mescrollRef" @init="mescrollInit" @down="downCallback" :up="upOption" @up="upCallback">
  25. <view class="cu-item" :class="modalName=='move-box-'+ index?'move-cur':''"
  26. v-for="(item, index) in dataList" :key="index" @touchstart="ListTouchStart"
  27. @touchmove="ListTouchMove" @touchend="ListTouchEnd" :data-target="'move-box-' + index">
  28. <view class="item-box" @click="gotoBuildInfo(item.name)">
  29. <image v-if="item.name=='企业大走访'" src="/static/img/cd1.png" class="item-img"></image>
  30. <image v-if="item.name=='都企供需'" src="/static/img/cd2.png" class="item-img"></image>
  31. <image v-if="item.name=='涉企政策'" src="/static/img/cd3.png" class="item-img"></image>
  32. <view class="item-title-L">
  33. <view class="item-title">
  34. {{item.name}}
  35. </view>
  36. <view class="item-des">
  37. {{item.des}}
  38. </view>
  39. </view>
  40. </view>
  41. </view>
  42. </mescroll-body>
  43. </view>
  44. <view @click="outlogin" class="fixed-bottom-right" v-if="isLogin!=null">
  45. <image class="center-img2" src="/static/img/icon_logout.png"></image>
  46. </view>
  47. </view>
  48. </view>
  49. </template>
  50. <script>
  51. import loginService from "@/api/auth/loginService";
  52. import uniFab from '@/components/uni-fab/uni-fab.vue';
  53. import DoublePicker from '@/components/DoublePicker/DoublePicker.vue'
  54. import MescrollMixin from "@/components/mescroll-uni/mescroll-mixins.js";
  55. import MescrollMoreItemMixin from "@/components/mescroll-uni/mixins/mescroll-more-item.js";
  56. import {mapActions} from 'vuex'
  57. export default {
  58. mixins: [MescrollMixin, MescrollMoreItemMixin], // 使用mixin (在main.js注册全局组件)
  59. name: "apps",
  60. components: {
  61. uniFab,
  62. DoublePicker
  63. },
  64. data() {
  65. return {
  66. isLogin:"",
  67. pageInfo: {},
  68. loginid:"",
  69. stype: "", // 企业 => 3 楼宇 => 2 园区 => 1 zfadmin => 4 admin=> 5
  70. searchForm: {
  71. des1:"",
  72. industry:"",
  73. name:"",
  74. },
  75. picture:["https://miniapp.huidutech.com.cn/yd_qycpfbH5/workBenchBannar.jpg",
  76. "https://miniapp.huidutech.com.cn/yd_qycpfbH5/bg1.jpg",
  77. "https://miniapp.huidutech.com.cn/yd_qycpfbH5/bg2.jpg",
  78. "https://miniapp.huidutech.com.cn/yd_qycpfbH5/bg3.jpg",
  79. "https://miniapp.huidutech.com.cn/yd_qycpfbH5/bg4.jpg"],
  80. curWord: "", //当前搜索关键词
  81. dataList: [], // 数据列表
  82. modalName: null,
  83. tablePage: {
  84. total: 0,
  85. currentPage: 1,
  86. pageSize: 10,
  87. orders: []
  88. },
  89. loading: false,
  90. parkId: '',
  91. parkList: [],
  92. parkList2: [],
  93. parkList3: [],
  94. parkList4: [],
  95. ddd1:"" ,
  96. };
  97. },
  98. onLoad(query) {
  99. if(query!=undefined&&query!=null&&query!=''){
  100. if(query.loginid!=undefined){
  101. this.loginid=query.loginid
  102. this.autoLogin();
  103. }
  104. }
  105. },
  106. onShow() {
  107. this.isLogin=this.$auth.checkisLogin();
  108. },
  109. created() {
  110. this.getPageInfo();
  111. this.getParkList()
  112. this.getParkList2()
  113. this.getParkList3()
  114. },
  115. methods: {
  116. ...mapActions(['refreshUserInfo']),
  117. //选择产业链上下游
  118. getParkList3() {
  119. loginService.getIndustryChainList({
  120. }).then(({
  121. data
  122. }) => {
  123. this.parkList3=[{label: '上游',value: '上游'},{label: '中游',value: '中游'},{label: '下游',value: '下游'}]
  124. this.parkList4 = data
  125. .map((item) => {
  126. const match = item.bz2.match(/\((.*?)\)/); // 匹配括号内的内容
  127. if (match) {
  128. return {
  129. label: match[1], // 括号内的内容
  130. value: match[1] // 括号内的内容
  131. };
  132. }
  133. return null; // 如果没有括号,返回 null
  134. })
  135. .filter((item) => item !== null) // 过滤掉 null 值
  136. .reduce((acc, current) => {
  137. // 使用 Set 去重
  138. const existingItem = acc.find((item) => item.value === current.value);
  139. if (!existingItem) {
  140. acc.push(current);
  141. }
  142. return acc;
  143. }, []);
  144. this.parkList3.unshift({
  145. label: "全部",
  146. value: ""
  147. });
  148. this.parkList4.unshift({
  149. label: "全部",
  150. value: ""
  151. });
  152. }).catch(e => {
  153. console.log(e)
  154. })
  155. },
  156. //选择属地
  157. getParkList2() {
  158. loginService.getAreaList({
  159. }).then(({
  160. data
  161. }) => {
  162. this.parkList2 = data.map((item) => {
  163. return {
  164. label: item.des1,
  165. value: item.des1
  166. }
  167. })
  168. this.parkList2.unshift({
  169. label: "盐都区",
  170. value: ""
  171. });
  172. }).catch(e => {
  173. console.log(e)
  174. })
  175. },
  176. //选择行业
  177. getParkList() {
  178. loginService.getHyList({
  179. }).then(({
  180. data
  181. }) => {
  182. this.parkList = data.map((item) => {
  183. return {
  184. label: item.industry,
  185. value: item.industry
  186. }
  187. })
  188. this.parkList.unshift({
  189. label: "全部",
  190. value: ""
  191. });
  192. }).catch(e => {
  193. console.log(e)
  194. })
  195. },
  196. /*获取数据列表 */
  197. upCallback(page) {
  198. //this.loading = true
  199. this.mescroll.endBySize(3, 3);
  200. this.dataList=[{"name":"企业大走访","des":"企业在遇到问题时,可随时填写问题反馈,相关部门会协助企业解决问题,及时跟进相关问题,更好的服务企业。"},
  201. {"name":"都企供需","des":"企业供需、产业图谱、重点园区、产品分布是区域经济发展的重要组成部分。产业图谱解析产业链上下游关系,重点园区承载产业集聚发展,产品分布反映区域产业特色,共同推动区域经济高质量发展。"},
  202. {"name":"涉企政策","des":"对企业的相关优惠政策,我们会及时更公布,让企业更好更精准的了解相关政策优惠,决定企业走向。"}];
  203. // loginService.comlist({
  204. // current: page.num,
  205. // size: page.size,
  206. // name: this.curWord,
  207. // des1: this.parkId,
  208. // orders: [{ column: 'a.create_date', asc: false }],
  209. // ...this.searchForm
  210. // }).then(({
  211. // data
  212. // }) => {
  213. // let curPageData = data.records
  214. // this.mescroll.endBySize(curPageData.length, data.total);
  215. // //如果是第一页需手动制空列表
  216. // if (page.num == 1)
  217. // this.dataList = [];
  218. // //追加新数据
  219. // this.dataList=[]; = this.dataList.concat(curPageData);
  220. // }).catch(e => {
  221. // //联网失败, 结束加载
  222. // this.mescroll.endErr();
  223. // })
  224. },
  225. gotoBuildInfo(name) {
  226. if(name=='企业大走访'){
  227. uni.navigateTo({
  228. url: '/pages/index/Dzfindex'
  229. })
  230. }else if(name=='都企供需'){
  231. uni.navigateTo({
  232. url: '/pages/index/index'
  233. })
  234. }else{
  235. uni.navigateTo({
  236. url: '/pages/policy/policyList'
  237. })
  238. }
  239. },
  240. updateCities(newCities) {
  241. this.cities = newCities;
  242. },
  243. // 搜索
  244. doSearch() {
  245. if(this.ddd1.column2!=''&&this.ddd1!=''){
  246. this.searchForm.bz2=this.ddd1.column1+'('+this.ddd1.column2+')';
  247. }else if(this.ddd1!=''){
  248. this.searchForm.bz2=this.ddd1.column1;
  249. }
  250. this.dataList = []; // 先清空列表,显示加载进度
  251. this.mescroll.resetUpScroll();
  252. },
  253. totongxunlu(){
  254. uni.navigateTo({
  255. url: '/pages/comList/comList'
  256. })
  257. },
  258. totongxunlu2(){
  259. uni.navigateTo({
  260. url: '/pages/buildList/buildList2?w=1'
  261. })
  262. },
  263. totongxunlu3(){
  264. console.log("1");
  265. window.location.href = "https://dlt.yczgsz.com/mini/pageEnterpriseVisit/workbench/workbench"
  266. },
  267. totongxunlu6(){
  268. uni.navigateTo({
  269. url: '/pages/buildList/buildList?w=1'
  270. })
  271. },
  272. totongxunlu4(){
  273. uni.navigateTo({
  274. url: '/pages/index/index'
  275. })
  276. },
  277. totongxunlu5(){
  278. uni.navigateTo({
  279. url: '/pages/policy/policyList'
  280. })
  281. },
  282. totongxunlu22(){
  283. uni.navigateTo({
  284. url: '/pages/buildList/buildList3?w=1'
  285. })
  286. },
  287. totongxunlu23(){
  288. uni.navigateTo({
  289. url: '/pages/buildList/buildList3?w=2'
  290. })
  291. },
  292. getPageInfo() {
  293. loginService.InfoStatistics({}).then(({ data }) => {
  294. this.pageInfo = data;
  295. //103改为 14/103
  296. //this.pageInfo.industryc="14/"+this.pageInfo.industryc;
  297. });
  298. },
  299. autoLogin(){
  300. console.log("登录id"+this.loginid);
  301. loginService.loginid( this.loginid).then(({data}) => {
  302. this.$store.commit('SET_TOKEN',data.token);
  303. this.refreshUserInfo();
  304. }).catch(e => {
  305. console.error(e)
  306. })
  307. },
  308. getRole() {
  309. let userInfo = uni.getStorageSync('WMS-userinfo')
  310. var officeId = userInfo.officeDTO.id;
  311. var roleIds = userInfo.roleIds;
  312. if (roleIds.indexOf("17bac1f980264e3e8193bc965538e2c6") != -1) {
  313. //// 管理员
  314. this.stype = 5
  315. uni.setStorageSync('stype', this.stype);
  316. } else if (roleIds.indexOf("ade960e8f02544998b07397304c059c1") != -1) {
  317. // 政府管理员
  318. this.stype = 4
  319. uni.setStorageSync('stype', this.stype);
  320. } else {
  321. console.log('==================>这里走了么','================>存一个stape')
  322. loginService
  323. .getOtherIdByOffceid({
  324. officeid: officeId,
  325. })
  326. .then(({
  327. data
  328. }) => {
  329. console.log(data, "====================>getOtherIdByOffceid");
  330. this.stype = data.stype;
  331. uni.setStorageSync('stype', this.stype);
  332. });
  333. }
  334. },
  335. toOut() {
  336. //window.location.href = "https://miniapp.huidutech.com.cn/yd_qycpfbH5/#/"
  337. window.location.href = "https://dlt.yczgsz.com/mini/pageEnterpriseVisit/workbench/workbench"
  338. },
  339. outloginset(){
  340. loginService.logout().then(({
  341. data
  342. }) => {
  343. this.$store.commit('logout');
  344. uni.clearStorage();
  345. })
  346. this.$store.commit('logout');
  347. uni.clearStorage();
  348. this.isLogin=this.$auth.checkisLogin();
  349. uni.hideLoading()
  350. },
  351. outlogin() {
  352. uni.showModal({
  353. title: '您确认退出么?',
  354. showCancel: true,
  355. success: (res) => {
  356. if (res.confirm) {
  357. uni.showLoading()
  358. this.outloginset();
  359. // uni.reLaunch({
  360. // url: '/pages/login/login'
  361. // })
  362. }
  363. }
  364. });
  365. },
  366. tces() {
  367. uni.navigateTo({
  368. url: '/pages/index/AudioToWord'
  369. })
  370. },
  371. // ListTouch触摸开始
  372. ListTouchStart(e) {
  373. this.listTouchStart = e.touches[0].pageX
  374. },
  375. // ListTouch计算方向
  376. ListTouchMove(e) {
  377. this.listTouchDirection = e.touches[0].pageX - this.listTouchStart > -60 ? 'right' : 'left'
  378. },
  379. // ListTouch计算滚动
  380. ListTouchEnd(e) {
  381. if (this.listTouchDirection == 'left') {
  382. this.modalName = e.currentTarget.dataset.target
  383. } else {
  384. this.modalName = null
  385. }
  386. this.listTouchDirection = null
  387. }
  388. }
  389. }
  390. </script>
  391. <style>
  392. .page {
  393. height: 100vh;
  394. }
  395. .line-box {
  396. padding-left: 20rpx;
  397. padding-right: 20rpx;
  398. margin-top: 20rpx;
  399. }
  400. .mart-t {
  401. margin-top: 30rpx;
  402. }
  403. .center-box{
  404. margin-top: 20rpx;
  405. width: 100%;
  406. border-radius: 25rpx;
  407. border-radius: 25rpx;
  408. background: #fff;
  409. box-shadow: 0px 8px 16px 2px rgba(101, 101, 101, 0.2);
  410. padding-bottom: 30rpx;
  411. display: flex;
  412. flex-wrap: wrap;
  413. }
  414. .center-left-box {
  415. width: 100%;
  416. margin-top: 20rpx;
  417. padding-bottom: 30rpx;
  418. display: flex;
  419. flex-wrap: wrap;
  420. }
  421. .btn-box-text {
  422. flex:1;
  423. height: 20rpx;
  424. text-align: center;
  425. color: #000000;
  426. font-size: 14px;
  427. font-weight: 700;
  428. }
  429. .btn-box-1 {
  430. flex:1;
  431. height: 30rpx;
  432. text-align: center;
  433. color: #36A7F3;
  434. font-size: x-large;
  435. font-weight: 700;
  436. }
  437. .btn-box-1-1 {
  438. height: 30rpx;
  439. text-align: left;
  440. color: #269ff8;
  441. font-size:large;
  442. margin-left:30rpx ;
  443. font-weight: 600;
  444. }
  445. .btn-box-2 {
  446. flex:1;
  447. height: 30rpx;
  448. text-align: center;
  449. color:#F3365A;
  450. font-size: x-large;
  451. font-weight: 700;
  452. }
  453. .btn-box-3 {
  454. flex:1;
  455. height: 30rpx;
  456. text-align: center;
  457. color:#15D578;
  458. font-size: x-large;
  459. font-weight: 700;
  460. }
  461. .btn-box-4 {
  462. flex:1;
  463. height: 30rpx;
  464. text-align: center;
  465. color:#F1A31B;
  466. font-size: x-large;
  467. font-weight: 700;
  468. }
  469. .btn-Imbox {
  470. flex:1;
  471. height: 150rpx;
  472. padding-top: 8rpx;
  473. text-align: center;
  474. display: flex;
  475. flex-direction: column;
  476. justify-content: center; /* 子元素内部内容竖向居中 */
  477. align-items: center; /* 子元素内部内容水平居中 */
  478. text-align: center; /* 文字居中 */
  479. }
  480. .btn-Imbox p {
  481. font-size: 14px; /* 文字大小,可根据需要调整 */
  482. margin: 0; /* 去掉默认的外边距 */
  483. font-weight: 700;
  484. }
  485. .center-img{
  486. width: 70rpx;
  487. height: 70rpx;
  488. margin-bottom: 10rpx;
  489. text-align: center;
  490. }
  491. .center-img2{
  492. width: 70rpx;
  493. height: 70rpx;
  494. margin-top: 10rpx;
  495. margin-bottom: 20rpx;
  496. text-align: center;
  497. }
  498. .kuai-text{
  499. color: #000000;
  500. font-weight: 900;
  501. font-size: 34rpx;
  502. padding-top: 20rpx;
  503. padding-left: 20rpx;
  504. margin-bottom: 20rpx;
  505. }
  506. .btn-box-5 {
  507. width: 337rpx;
  508. height: 200rpx;
  509. background-image: url('../../static/img/btn3.png');
  510. background-size: 100% 100%;
  511. }
  512. .btn-box-6 {
  513. width: 337rpx;
  514. height: 200rpx;
  515. background-image: url('../../static/img/btn6.png');
  516. background-size: 100% 100%;
  517. }
  518. .h-200 {
  519. height: 200rpx;
  520. }
  521. .swiper {
  522. width: 750rpx;
  523. height: 310rpx;
  524. }
  525. .swiper-item {
  526. width: 750rpx;
  527. height: 310rpx;
  528. background-color: aliceblue;
  529. }
  530. .swiper2 {
  531. width: 750rpx;
  532. height: 42rpx;
  533. }
  534. .swiper2-item {
  535. width: 750rpx;
  536. height: 42rpx;
  537. background-color: #F9AE3D;
  538. }
  539. .font-size-35 {
  540. font-size: 35px !important;
  541. }
  542. .img-size {
  543. width: 80rpx;
  544. height: 80rpx;
  545. }
  546. .content-box {
  547. width: 437rpx;
  548. height: 200rpx;
  549. }
  550. .my-app .padding-sm {
  551. padding: 6px;
  552. }
  553. .grid .padding-sm .bg-white {
  554. box-shadow: 0 1px 4px #f9f9f9, 1px 1px 40px rgba(0, 0, 0, .06);
  555. }
  556. .bg-blue {
  557. background: #fff;
  558. color: #0081ff !important;
  559. }
  560. .text-white,
  561. .line-white,
  562. .lines-white {
  563. color: #0081ff !important;
  564. }
  565. .cu-bar .search-form {
  566. background-color: white;
  567. }
  568. .item-box{
  569. width: 710rpx;
  570. background: #FFFFFF;
  571. box-shadow: 0px 1px 3px 0px rgba(9,2,4,0.1);
  572. border-radius: 10px;
  573. padding-top: 20rpx;
  574. padding-left: 38rpx;
  575. padding-right: 10rpx;
  576. margin-top: 20rpx;
  577. }
  578. .item-title{
  579. position: relative;
  580. display: flex;
  581. justify-content: space-between;
  582. font-size: 30rpx;
  583. color: #010101;
  584. font-weight: bold;
  585. align-items: center;
  586. }
  587. .item-line{
  588. display: flex;
  589. height: 48rpx;
  590. margin-top: 20rpx;
  591. }
  592. .item-line2{
  593. height: 48rpx;
  594. margin-top: 20rpx;
  595. }
  596. .subtitle{
  597. color: #E5880E;
  598. }
  599. .item-name{
  600. margin-top: 5rpx;
  601. font-size: 29rpx;
  602. color: #666666;
  603. }
  604. .item-name2{
  605. font-size: 29rpx;
  606. color: #676D99;
  607. }
  608. .item-name3{
  609. display: flex;
  610. width: 100%;
  611. padding-right: 30rpx;
  612. flex: 1;
  613. justify-content: flex-end;
  614. font-size: 29rpx;
  615. color: #676D99;
  616. }
  617. .item-content{
  618. color: #1497EF;
  619. font-size: 30rpx;
  620. }
  621. .btn-box{
  622. display: flex;
  623. }
  624. .line-zs{
  625. width: 2rpx;
  626. height: 30rpx;
  627. background: #36A7F3;
  628. }
  629. .edit-botton{
  630. width: 100rpx;
  631. height: 48rpx;
  632. line-height: 48rpx;
  633. color: #fff;
  634. font-size: 28rpx;
  635. margin-right: 20rpx;
  636. border-radius: 10rpx;
  637. background: #5A9EE9;
  638. text-align: center;
  639. }
  640. .del-botton{
  641. width: 100rpx;
  642. height: 48rpx;
  643. line-height: 48rpx;
  644. color: #fff;
  645. font-size: 28rpx;
  646. margin-right: 20rpx;
  647. border-radius: 10rpx;
  648. background: #F27C85;
  649. text-align: center;
  650. }
  651. .color-white{
  652. color: #808080;
  653. font-size: 40rpx;
  654. line-height: 60rpx;
  655. }
  656. .search-box{
  657. padding-left: 20rpx;
  658. padding-right: 20rpx;
  659. padding-top: 20rpx;
  660. margin-top: 20rpx;
  661. width: 100%;
  662. border-radius: 25rpx;
  663. border-radius: 25rpx;
  664. background: #fff;
  665. box-shadow: 0px 8px 16px 2px rgba(101, 101, 101, 0.2);
  666. padding-bottom: 30rpx;
  667. display: flex;
  668. flex-wrap: wrap;
  669. }
  670. .search-box1{
  671. display: flex;
  672. }
  673. .input-box{
  674. background: #fff;
  675. height: 65rpx;
  676. width: 640rpx;
  677. display: flex;
  678. align-items: center;
  679. border-radius: 30rpx;
  680. padding-left: 30rpx;
  681. margin-right: 20rpx;
  682. }
  683. .input-boxinput{
  684. height: 75rpx;
  685. font-size: 15rpx;
  686. }
  687. .choose-box{
  688. background: #fff;
  689. width: 325rpx;
  690. border-radius: 23rpx;
  691. height: 70rpx;
  692. display: flex;
  693. align-items: center;
  694. justify-content: center;
  695. margin-right: 20rpx;
  696. border: 1rpx solid #808080;
  697. }
  698. .choose-box2{
  699. background: #fff;
  700. width: 100%;
  701. border-radius: 23rpx;
  702. height: 70rpx;
  703. display: flex;
  704. padding-left: 29rpx;
  705. align-items: center;
  706. border: 1rpx solid #808080;
  707. }
  708. .choose-box3{
  709. display: flex;
  710. }
  711. .choose-boxp{
  712. font-size: 32rpx;
  713. width: 80rpx;
  714. }
  715. .fixed-bottom-right {
  716. padding: 20rpx;
  717. position: fixed;
  718. bottom: 20px; /* 距离底部的距离 */
  719. right: 20px; /* 距离右侧的距离 */
  720. }
  721. .item-box{
  722. display: flex;
  723. width: 710rpx;
  724. margin-left: 20rpx;
  725. background: #FFFFFF;
  726. box-shadow: 0px 1px 3px 0px rgba(9,2,4,0.1);
  727. border-radius: 10px;
  728. padding-top: 20rpx;
  729. padding-left: 20rpx;
  730. padding-right: 10rpx;
  731. padding-bottom: 20rpx;
  732. margin-top: 20rpx;
  733. }
  734. .item-title-L{
  735. display: flex;
  736. width: 70%;
  737. margin-left: 28rpx;
  738. flex-direction: column;
  739. }
  740. .item-title{
  741. font-size: 30rpx;
  742. color: #333;
  743. font-weight: bold;
  744. align-items: center;
  745. }
  746. .item-des{
  747. margin-top: 10rpx;
  748. color: #565656;
  749. font-size: 24rpx;
  750. overflow: hidden; /* 超出部分隐藏 */
  751. text-overflow: ellipsis; /* 超出部分显示省略号 */
  752. display: -webkit-box; /* 使用Webkit的行盒模型 */
  753. -webkit-line-clamp: 3; /* 限制最多显示2行 */
  754. -webkit-box-orient: vertical; /* 垂直排列 */
  755. }
  756. /* 返回 */
  757. .item-img {
  758. width: 100rpx;
  759. height: 100rpx;
  760. }
  761. </style>