Dzfindex.vue 20 KB

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