warningStore.vue 31 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953
  1. <template>
  2. <div class="unCreateStore">
  3. <div class="header">
  4. <van-nav-bar class="navBar" title="调色机预警门店明细" left-arrow @click-left="onClickLeft" />
  5. </div>
  6. <div class="content">
  7. <van-collapse v-model="activeName" accordion @change="collapseCange">
  8. <van-collapse-item v-for="(val, key, ind) in list" :key="ind" :name="key">
  9. <template #title>
  10. <div class="title">{{ key | storeType }}</div>
  11. <div class="num">{{ val.storeNum }}家</div>
  12. </template>
  13. <div class="itemContent">
  14. <template v-if="val.storeList && val.storeList.length >= 1">
  15. <div class="item" v-for="(item, index) in val.storeList" :key="index">
  16. <van-cell>
  17. <div class="card">
  18. <div class="title titlero">
  19. <template v-if="item.storeLabels">
  20. <!-- 金牌店ABC -->
  21. <img
  22. class="JPABC"
  23. :src="require('@/assets/Icon/storeA.png')"
  24. v-if="item.storeLabels.storeA" />
  25. <img
  26. class="JPABC"
  27. :src="require('@/assets/Icon/storeB.png')"
  28. v-if="item.storeLabels.storeB" />
  29. <img
  30. class="JPABC"
  31. :src="require('@/assets/Icon/storeC.png')"
  32. v-if="item.storeLabels.storeC" />
  33. <img
  34. class="JPABC"
  35. :src="require('@/assets/Icon/storeD.png')"
  36. v-if="item.storeLabels.storeD" />
  37. <img
  38. class="JPABC"
  39. :src="require('@/assets/Icon/storeE.png')"
  40. v-if="item.storeLabels.storeE" />
  41. </template>
  42. <span @click="goOtherSystem(item)" :style="setStroeNameStyle(item)">
  43. <span>{{ item.storeName }}</span>
  44. (<span>{{ item.storeCode }}</span
  45. >)
  46. </span>
  47. <span class="btn" :data-clipboard-text="item.storeCode">
  48. <van-icon
  49. :name="paste"
  50. color="#ee0a24"
  51. size="20"
  52. style="top: 6px; margin-left: 4px" />
  53. </span>
  54. <!-- "approvalStatus": 1:已结案;0:未结案, -->
  55. <!-- "processApprovalStatus": 审批状态(0=未提交,1=已提交待审核,2=审批通过,3=审批拒绝) -->
  56. <template v-if="item.approvalStatus == 0">
  57. <span class="statusIcon submit" v-if="item.processApprovalStatus == 1"
  58. >已提交</span
  59. >
  60. <span class="statusIcon noSubmit" v-if="item.processApprovalStatus == 0"
  61. >未提交</span
  62. >
  63. </template>
  64. </div>
  65. <div class="info" style="position: relative">
  66. 联系人:{{ item.contactName }}
  67. <div style="position: absolute; bottom: 0px; right: 0px">
  68. <!-- 是否终端客户 -->
  69. <el-popover
  70. popper-class="zpover poperWidthAuto"
  71. placement="bottom"
  72. trigger="click"
  73. content="该客户为终端客户">
  74. <div
  75. v-if="item.storeLabels.terminalCustomer"
  76. class="visitStoreIco"
  77. style="background-color: #fff"
  78. slot="reference">
  79. <van-icon
  80. :name="require('@/assets/Icon/zhongduankehu.png')"
  81. size="26" />
  82. </div>
  83. </el-popover>
  84. <!-- 是否双包客户 -->
  85. <el-popover
  86. popper-class="zpover poperWidthAuto"
  87. placement="bottom"
  88. trigger="click"
  89. :content="'该客户拥有的双包能力为:' + item.storeLabels.doubleCustomer">
  90. <div
  91. v-if="item.storeLabels.doubleCustomer"
  92. class="visitStoreIco"
  93. style="background-color: #fff"
  94. slot="reference">
  95. <van-icon
  96. :name="require('@/assets/Icon/shuangbaokehu.png')"
  97. size="26" />
  98. </div>
  99. </el-popover>
  100. <!-- 工企标签 -->
  101. <el-popover
  102. popper-class="zpover poperWidthAuto"
  103. placement="bottom"
  104. trigger="click"
  105. :content="item.storeLabels.industrialEnterprises">
  106. <div
  107. v-if="item.storeLabels.industrialEnterprises"
  108. class="visitStoreIco"
  109. style="background-color: #fff"
  110. slot="reference">
  111. <van-icon :name="require('@/assets/Icon/qiye.png')" size="26" />
  112. </div>
  113. </el-popover>
  114. <!-- 商住标签 -->
  115. <el-popover
  116. popper-class="zpover poperWidthAuto"
  117. placement="bottom"
  118. trigger="click"
  119. :content="item.storeLabels.commercialResidential">
  120. <div
  121. v-if="item.storeLabels.commercialResidential"
  122. class="visitStoreIco"
  123. style="background-color: #fff"
  124. slot="reference">
  125. <van-icon :name="require('@/assets/Icon/shangye.png')" size="26" />
  126. </div>
  127. </el-popover>
  128. <!-- 市政工程标签 -->
  129. <el-popover
  130. popper-class="zpover poperWidthAuto"
  131. placement="bottom"
  132. trigger="click"
  133. :content="item.storeLabels.municipalEngineering">
  134. <div
  135. v-if="item.storeLabels.municipalEngineering"
  136. class="visitStoreIco"
  137. style="background-color: #fff"
  138. slot="reference">
  139. <van-icon :name="require('@/assets/Icon/shizheng.png')" size="26" />
  140. </div>
  141. </el-popover>
  142. <!-- 凤凰客户 -->
  143. <el-popover
  144. popper-class="zpover"
  145. placement="bottom"
  146. width="120"
  147. trigger="click"
  148. content="该客户为凤凰客户">
  149. <div
  150. v-if="item.storeLabels.fhCustomer"
  151. class="visitStoreIco"
  152. style="background-color: #fff"
  153. slot="reference">
  154. <van-icon
  155. :name="require('@/assets/Icon/fenghuangjihua.png')"
  156. size="26" />
  157. </div>
  158. </el-popover>
  159. <el-popover
  160. popper-class="zpover zpover6"
  161. placement="bottom-start"
  162. trigger="click">
  163. <div>
  164. <p>
  165. 本店{{ timeData }}下单SKU数:<a
  166. @click="linkList(item)"
  167. style="text-decoration: underline"
  168. >点击查看详情</a
  169. >
  170. </p>
  171. </div>
  172. <div
  173. class="visitStoreIco"
  174. v-if="item.storeLabels.zysslNums !== false"
  175. style="background-color: #fff; position: relative"
  176. slot="reference">
  177. <p
  178. style="
  179. width: 100%;
  180. position: absolute;
  181. z-index: 1;
  182. top: 0.2px;
  183. width: 22px;
  184. margin: 0;
  185. margin-left: 3.6px;
  186. text-align: center;
  187. font-size: 12px;
  188. ">
  189. {{ item.storeLabels.zysslNums }}
  190. </p>
  191. <van-icon :name="ord" size="26" />
  192. </div>
  193. </el-popover>
  194. <el-popover
  195. popper-class="zpover zpover5"
  196. placement="bottom"
  197. width="200"
  198. trigger="click">
  199. <div v-if="item.storeLabels">
  200. <p>已参加:</p>
  201. <p v-for="tt in (item.storeLabels.targetOne + '').split(';')" :key="tt">
  202. {{ tt }}
  203. </p>
  204. </div>
  205. <div
  206. class="visitStoreIco"
  207. v-if="item.storeLabels.targetOne"
  208. style="background-color: #fff"
  209. slot="reference">
  210. <van-icon :name="targetOne" size="26" />
  211. </div>
  212. </el-popover>
  213. <el-popover
  214. popper-class="zpover"
  215. placement="bottom"
  216. width="120"
  217. trigger="click"
  218. content="调色机7天未调色">
  219. <div
  220. v-if="item.storeLabels.stopColorMixerSeven"
  221. class="visitStoreIco"
  222. style="background-color: #fff"
  223. slot="reference">
  224. <van-icon :name="Network" size="26" />
  225. </div>
  226. </el-popover>
  227. <el-popover
  228. popper-class="zpover"
  229. placement="bottom"
  230. width="120"
  231. trigger="click"
  232. content="调色机当月未调色">
  233. <div
  234. v-if="item.storeLabels.stopColorMixerMonth"
  235. class="visitStoreIco"
  236. style="background-color: #fff"
  237. slot="reference">
  238. <van-icon :name="WiFi" size="26" />
  239. </div>
  240. </el-popover>
  241. <el-popover
  242. popper-class="zpover"
  243. placement="bottom"
  244. width="200"
  245. trigger="click"
  246. content="同城店近60天未下单">
  247. <div
  248. v-if="item.storeLabels.fxNoOrder"
  249. class="visitStoreIco"
  250. style="background-color: #fff"
  251. slot="reference">
  252. <van-icon :name="order60" size="26" />
  253. </div>
  254. </el-popover>
  255. <el-popover
  256. popper-class="zpover"
  257. placement="bottom"
  258. width="200"
  259. trigger="click"
  260. content="金牌店近30天未下单">
  261. <div
  262. v-if="item.storeLabels.noOrder"
  263. class="visitStoreIco"
  264. style="background-color: #fff"
  265. slot="reference">
  266. <van-icon :name="order" size="26" />
  267. </div>
  268. </el-popover>
  269. <el-popover
  270. popper-class="zpover"
  271. placement="bottom"
  272. width="200"
  273. trigger="click"
  274. content="本店本月进过专业时时丽">
  275. <div
  276. class="visitStoreIco"
  277. v-if="item.storeLabels.zyssl"
  278. style="background-color: #ed5c68"
  279. slot="reference">
  280. </div>
  281. </el-popover>
  282. <el-popover
  283. popper-class="zpover zpover1"
  284. placement="bottom"
  285. width="200"
  286. trigger="click"
  287. content="本店本月进过超好贴">
  288. <div
  289. v-if="item.storeLabels.chtczj"
  290. class="visitStoreIco"
  291. style="background-color: #0057ba"
  292. slot="reference">
  293. </div>
  294. </el-popover>
  295. <el-popover
  296. placement="bottom"
  297. popper-class="zpover zpover1 zpover1sb"
  298. :disabled="!item.userVisitTimesMap"
  299. trigger="click">
  300. <div
  301. v-if="item.storeLabels.visitTimes && item.storeLabels.visitTimes > 0"
  302. class="visitStoreIco"
  303. slot="reference"
  304. style="background-color: #fff; position: relative">
  305. <p
  306. style="
  307. width: 100%;
  308. position: absolute;
  309. z-index: 10;
  310. top: -2px;
  311. margin: 0;
  312. text-align: center;
  313. font-size: 12px;
  314. ">
  315. {{ item.storeLabels.visitTimes }}
  316. </p>
  317. <!-- A级金牌店拜访次数少于needVisitNum 需要拜访的次数 -->
  318. <van-icon
  319. :name="require('@/assets/ordernumRed.png')"
  320. size="26"
  321. v-if="
  322. item.storeLabels.storeA &&
  323. item.needVisitNum &&
  324. item.storeLabels.visitTimes < item.needVisitNum
  325. " />
  326. <!-- 其他门店拜访 -->
  327. <van-icon :name="require('@/assets/ordernum.png')" size="26" v-else />
  328. </div>
  329. <p
  330. style="
  331. text-align: center;
  332. background: #fff;
  333. color: #000;
  334. padding: 5px 0;
  335. ">
  336. 本店本月已拜访过{{ item.storeLabels.visitTimes }}次
  337. </p>
  338. <p
  339. v-if="item.storeLabels.storeA && item.needVisitNum"
  340. style="
  341. text-align: center;
  342. background: #fff;
  343. color: red;
  344. padding: 5px 0;
  345. ">
  346. A级金牌店拜访标准:1月{{ item.needVisitNum }}次
  347. </p>
  348. <el-table :data="item.userVisitTimesMap" border max-height="180px">
  349. <el-table-column label="业务员" prop="userName" />
  350. <el-table-column label="拜访次数" prop="visitTimes" width="110px" />
  351. </el-table>
  352. </el-popover>
  353. </div>
  354. </div>
  355. <div class="info">
  356. 类型:{{ item.storeCategory }}&nbsp;
  357. <!-- <el-popover popper-class="zpover zpover6" placement="bottom-start" trigger="click">
  358. <div>
  359. <p>
  360. 本店经营品项指导:
  361. <a @click="linkimg(item)" style="text-decoration: underline">点击查看</a>
  362. </p>
  363. </div>
  364. <van-icon name="question-o" size="18" slot="reference" />
  365. </el-popover> -->
  366. </div>
  367. <div class="info" v-if="item.telephone" @click="buryingPointFn(item)">
  368. 联系电话:<a
  369. style="color: #0057ba; font-weight: bold; text-decoration: underline"
  370. :href="'tel:' + item.telephone"
  371. >{{ item.telephone }}<van-icon name="phone"
  372. /></a>
  373. </div>
  374. <div class="info">
  375. 地址:{{ item.addressLine }}
  376. <img
  377. v-if="item.storeLonExist"
  378. style="width: 36px"
  379. :src="sbpmdh"
  380. @click="linkapp(item)" />
  381. </div>
  382. <!-- 潜在店不显示经销商 -->
  383. <template v-if="item.sfaStoreType.type != 'qzd'">
  384. <!-- 分销店 -->
  385. <template
  386. v-if="
  387. item.sfaStoreType &&
  388. item.sfaStoreType.type == 'fxd' &&
  389. item.sfaStoreChainsContactList
  390. ">
  391. <div class="info" v-if="typeShow">
  392. 经销商:
  393. <div
  394. class="TCFXListItem"
  395. v-for="(item, index) in item.sfaStoreChainsContactList"
  396. :key="index">
  397. <el-popover
  398. popper-class="zpover zpoverStoreztype"
  399. placement="bottom-start"
  400. trigger="click">
  401. <div>
  402. <div>{{ item.chainCode }}</div>
  403. <div>{{ item.chainName }}</div>
  404. </div>
  405. <div slot="reference" :key="index">
  406. {{ item.categoryDescribe }}
  407. </div>
  408. </el-popover>
  409. </div>
  410. </div>
  411. </template>
  412. <template v-else>
  413. <div class="info" v-if="typeShow">经销商:{{ item.chainName }}</div>
  414. </template>
  415. </template>
  416. <!-- storeLonExist 门店是否存在经纬度 字段false=不显示导航和距离,true=显示 -->
  417. <div class="info" v-if="item.storeLonExist">
  418. 距离:{{ Micrometer(item.distance) }}m
  419. </div>
  420. <div class="info" v-if="item.cntOrderAmtYear">
  421. 门店销额(全年累计):{{ Micrometer(item.cntOrderAmtYear) }}元
  422. </div>
  423. </div>
  424. </van-cell>
  425. </div>
  426. </template>
  427. <van-empty description="暂无数据" v-else />
  428. </div>
  429. </van-collapse-item>
  430. </van-collapse>
  431. </div>
  432. </div>
  433. </template>
  434. <script>
  435. import { getColorMixerStoreInfos } from '@/api/home';
  436. import { mapState } from 'vuex';
  437. import store from '@/store';
  438. import { getMonthCommon } from '@/utils';
  439. import { buryingPoint, ProductItemImge } from '@/api/index';
  440. import order from '@/assets/order.png';
  441. import order60 from '@/assets/order60.png';
  442. import targetOne from '@/assets/targetOne.png';
  443. import ord from '@/assets/ord.png';
  444. import Network from '@/assets/Network.png';
  445. import WiFi from '@/assets/WiFi.png';
  446. import paste from '@/assets/paste.png';
  447. import axios from 'axios';
  448. export default {
  449. name: 'unCreateStore',
  450. computed: {
  451. ...mapState({
  452. activaCreateTypeStore: (state) => state.user.activaCreateTypeStore,
  453. }),
  454. },
  455. data() {
  456. return {
  457. typeShow: true,
  458. ord: ord,
  459. order: order,
  460. order60: order60,
  461. Network: Network,
  462. WiFi: WiFi,
  463. targetOne: targetOne,
  464. paste: paste,
  465. activeName: 'keKong',
  466. list: {},
  467. TXPiont: {}, //腾讯定位数据
  468. TXisBD: {}, // 腾讯定位数据转百度
  469. activatStoreVal: {}, //当前点击门店数据
  470. visitRoutePath: '', //拜访页面路径
  471. clickIsFlage: true,
  472. timeData: '',
  473. };
  474. },
  475. filters: {
  476. storeType(value) {
  477. let type = '';
  478. if (value == 'keKong') {
  479. type = '可控店';
  480. } else if (value == 'jinPai') {
  481. type = '金牌店';
  482. }
  483. return type;
  484. },
  485. },
  486. activated() {
  487. this.timeData = getMonthCommon();
  488. this.getList();
  489. // this.activeName = this.activaCreateTypeStore || '';
  490. },
  491. methods: {
  492. collapseCange(value) {
  493. store.dispatch('activaCreateTypeStore', value);
  494. },
  495. getList() {
  496. this.toastLoading(0, '加载中...', true);
  497. getColorMixerStoreInfos()
  498. .then((res) => {
  499. this.toastLoading().clear();
  500. this.list = res.data;
  501. console.log(this.list);
  502. })
  503. .catch(() => {
  504. this.toastLoading().clear();
  505. });
  506. },
  507. storeDetailFn(id) {
  508. this.$router.push({
  509. path: '/storeDetail',
  510. query: { id: id },
  511. });
  512. },
  513. onClickLeft() {
  514. this.$router.go(-1);
  515. },
  516. linkapp(val) {
  517. var poind = this.gcj02BD(val.lat, val.lon);
  518. let url = window.location.href;
  519. let wx = this.wx;
  520. let qiyeData;
  521. const instance = axios.create();
  522. instance.defaults.headers.common['userId'] = localStorage.getItem('loginName');
  523. instance
  524. .get(process.env.VUE_APP_BASE_API + 'mobile/wx/ticket', {
  525. params: {
  526. url: url,
  527. agent: 1,
  528. },
  529. })
  530. .then((response) => {
  531. if (response.status == 200) {
  532. qiyeData = response.data.data;
  533. wx.agentConfig({
  534. corpid: qiyeData.appId, // 必填,企业微信的corpid,必须与当前登录的企业一致
  535. agentid: qiyeData.agentId, // 必填,企业微信的应用id (e.g. 1000247)
  536. timestamp: qiyeData.timestamp, // 必填,生成签名的时间戳
  537. nonceStr: qiyeData.nonceStr, // 必填,生成签名的随机串
  538. signature: qiyeData.signature, // 必填,签名,见附录-JS-SDK使用权限签名算法
  539. jsApiList: ['launchMiniprogram'], //必填,传入需要使用的接口名称
  540. success: function () {
  541. wx.invoke('launchMiniprogram', {
  542. appid: 'wx238bbb5f6d958414',
  543. path:
  544. 'pages/relayStation/relayStation?latitude=' +
  545. poind.lat +
  546. '&longitude=' +
  547. poind.lon +
  548. '&name=' +
  549. val.addressLine,
  550. });
  551. },
  552. fail: function (res) {
  553. if (res.errMsg.indexOf('function not exist') > -1) {
  554. alert('版本过低请升级');
  555. }
  556. },
  557. });
  558. }
  559. });
  560. },
  561. buryingPointFn(val) {
  562. buryingPoint({
  563. systemModel: '调色机预警门店明细',
  564. buryingPointType: 1,
  565. buryingPointValue: val.telephone,
  566. buryingPointName: '点击电话',
  567. buryingPointPosition: val.storeName + '(' + val.storeCode + ')',
  568. });
  569. },
  570. linkList(val) {
  571. this.$router.push({
  572. path: '/pItem',
  573. query: {
  574. id: val.storeId,
  575. detilId: 'a',
  576. storeCode: val.storeCode,
  577. showOrderButton: val.showOrderButton,
  578. },
  579. });
  580. },
  581. linkimg(val) {
  582. ProductItemImge({ storeId: val.storeId }).then((response) => {
  583. if (response.code == 200) {
  584. if (response.data != undefined) {
  585. window.open(response.data);
  586. } else {
  587. this.$toast(response.msg);
  588. }
  589. } else {
  590. this.$toast(response.msg);
  591. }
  592. });
  593. },
  594. setStroeNameStyle(item) {
  595. // 家装或工装 approvalStatus:是否结案 0:未结案,1:已结案
  596. if (
  597. (item.sfaStoreType && (item.sfaStoreType.jz || item.sfaStoreType.gz)) ||
  598. item.approvalStatus == null ||
  599. item.approvalStatus == 0
  600. ) {
  601. return {};
  602. } else {
  603. return { color: '#0057ba', 'text-decoration': 'underline' };
  604. }
  605. },
  606. // 跳转好帮手门店详情
  607. goOtherSystem(item) {
  608. // 家装或工装 approvalStatus:是否结案 0:未结案,1:已结案
  609. if (
  610. (item.sfaStoreType && (item.sfaStoreType.jz || item.sfaStoreType.gz)) ||
  611. item.approvalStatus == null ||
  612. item.approvalStatus == 0
  613. ) {
  614. return false;
  615. }
  616. if (item.storeCode) {
  617. window.location.href =
  618. process.env.VUE_APP_SSB_LINK + '/order/storeDetail/index?shopCode=' + item.storeCode;
  619. } else {
  620. this.$dialog.alert({
  621. message: '缺少门店code',
  622. });
  623. }
  624. },
  625. },
  626. };
  627. </script>
  628. <style lang="scss" scoped>
  629. /* Base container styles */
  630. .unCreateStore {
  631. height: 100%;
  632. width: 100%;
  633. .content {
  634. padding: 8px 10px;
  635. }
  636. }
  637. /* Store item styles */
  638. .item {
  639. padding: 8px 10px;
  640. margin: 10px 0;
  641. background: #fff;
  642. .van-cell {
  643. padding: 0;
  644. &__right-icon {
  645. height: 144px;
  646. line-height: 144px;
  647. margin-right: 10px;
  648. }
  649. }
  650. }
  651. /* Card styles */
  652. .card {
  653. box-sizing: border-box;
  654. .title {
  655. font-size: 16px;
  656. font-weight: bold;
  657. color: #333;
  658. line-height: 30px;
  659. }
  660. .info {
  661. font-size: 14px;
  662. color: #909090;
  663. line-height: 26px;
  664. }
  665. }
  666. /* Icon styles */
  667. .visitStoreIco {
  668. float: left;
  669. width: 26px;
  670. text-align: center;
  671. background-color: #ffba13;
  672. color: #fff;
  673. border-radius: 100%;
  674. margin-left: 14px;
  675. line-height: 26px;
  676. height: 26px;
  677. }
  678. /* Button styles */
  679. .centerBtn {
  680. display: block;
  681. color: #0057ba;
  682. border-radius: 5px;
  683. padding: 0 6px;
  684. height: 28px;
  685. &.ctns {
  686. position: absolute;
  687. top: 0;
  688. right: 0;
  689. width: 80px;
  690. }
  691. }
  692. /* Status styles */
  693. .statusIcon {
  694. padding: 3px;
  695. font-size: 12px;
  696. margin: 0 3px;
  697. color: #fff;
  698. display: inline-block;
  699. height: 20px;
  700. line-height: 16px;
  701. vertical-align: -1px;
  702. &.submit {
  703. background: #ffba13;
  704. }
  705. &.noSubmit {
  706. background: #f11818;
  707. }
  708. }
  709. /* List item styles */
  710. .TCFXListItem {
  711. display: inline-block;
  712. border: 1px solid #ccc;
  713. padding: 3px 5px;
  714. margin: 0 5px;
  715. border-radius: 6px;
  716. }
  717. /* Collapse styles */
  718. .van-collapse-item {
  719. border-bottom: 1px solid #dcdcdc;
  720. }
  721. </style>
  722. <style lang="scss">
  723. .unCreateStore {
  724. .van-cell__title {
  725. font-size: 16px;
  726. font-weight: bold;
  727. color: #333;
  728. display: flex;
  729. justify-content: space-between;
  730. .num {
  731. color: #909090;
  732. margin-right: 5px;
  733. }
  734. }
  735. .van-collapse-item__wrapper {
  736. border-top: 1px solid #dcdcdc;
  737. }
  738. .van-collapse-item__title--expanded {
  739. position: sticky;
  740. top: 0px;
  741. z-index: 10;
  742. }
  743. .van-collapse-item__content {
  744. background-color: unset;
  745. padding: 0;
  746. }
  747. }
  748. </style>
  749. <style lang="scss">
  750. .van-dialog__confirm,
  751. .van-dialog__confirm:active {
  752. color: #0057ba;
  753. }
  754. .searchDiv {
  755. .van-search {
  756. background: #fff;
  757. }
  758. .van-search__action {
  759. font-size: 14px;
  760. color: #0057ba;
  761. font-weight: bold;
  762. background: #f1f1f1;
  763. border-bottom-right-radius: 60px;
  764. border-top-right-radius: 60px;
  765. border: 1px solid #c1c1c1;
  766. padding: 0 20px;
  767. }
  768. .van-search--show-action {
  769. padding-right: 12px;
  770. }
  771. .van-search__content {
  772. border: 1px solid #c1c1c1;
  773. border-bottom-left-radius: 60px;
  774. border-top-left-radius: 60px;
  775. background: #f1f1f1;
  776. border-right: 0;
  777. }
  778. }
  779. </style>
  780. <style lang="scss" scoped>
  781. .bgcolor {
  782. background-color: #f5f5f5;
  783. }
  784. .container {
  785. padding-bottom: 50px;
  786. }
  787. .monthNow {
  788. height: 48px;
  789. line-height: 48px;
  790. text-align: center;
  791. font-weight: bold;
  792. padding: 0 15px;
  793. box-sizing: border-box;
  794. background-color: #f5f5f5;
  795. font-size: 16px;
  796. .CalendarIcon {
  797. font-size: 24px;
  798. color: #0057ba;
  799. position: relative;
  800. top: 6px;
  801. margin-left: 10px;
  802. }
  803. }
  804. .card {
  805. padding: 10px 16px;
  806. box-sizing: border-box;
  807. .title {
  808. font-size: 15px;
  809. font-weight: bold;
  810. color: #333;
  811. line-height: 22px;
  812. padding-right: 52px;
  813. /*word-break: break-all;*/
  814. .JPABC {
  815. width: 20px;
  816. position: relative;
  817. top: 4px;
  818. margin-right: 3px;
  819. }
  820. .statusIcon {
  821. padding: 3px;
  822. font-size: 12px;
  823. margin: 0 3px;
  824. color: #fff;
  825. display: inline-block;
  826. height: 20px;
  827. line-height: 16px;
  828. vertical-align: -1px;
  829. }
  830. .submit {
  831. background: #ffba13;
  832. }
  833. .noSubmit {
  834. background: #f11818;
  835. }
  836. }
  837. .info {
  838. font-size: 14px;
  839. color: #909090;
  840. line-height: 26px;
  841. }
  842. }
  843. .navBarTOP {
  844. position: fixed;
  845. width: 100%;
  846. z-index: 2;
  847. top: 0;
  848. }
  849. .cellcontent .centerBtn {
  850. margin: 0 auto 10px;
  851. display: block;
  852. width: 92%;
  853. border-radius: 5px;
  854. color: #0057ba;
  855. border: 1px solid #0057ba;
  856. }
  857. .cellcontent .centerBtn1 {
  858. background-color: #0057ba;
  859. color: #fff;
  860. }
  861. .btnbox {
  862. padding-top: 14px;
  863. border-top: 1px solid #eee;
  864. margin: 0 10px;
  865. }
  866. .cellcontent .centerBtn2 {
  867. margin: 0 auto 10px;
  868. display: block;
  869. width: 92%;
  870. color: #0057ba;
  871. border-radius: 5px;
  872. padding: 0;
  873. }
  874. .statstext {
  875. background-color: #0057ba;
  876. position: absolute;
  877. right: 0;
  878. top: 6px;
  879. padding: 2px 6px 2px 12px;
  880. border-bottom-left-radius: 60px;
  881. border-top-left-radius: 60px;
  882. color: #fff;
  883. }
  884. .lineGrey {
  885. height: 10px;
  886. width: 100%;
  887. background: #f1f1f1;
  888. }
  889. .cellcontent .van-cell {
  890. padding: 10px 0;
  891. }
  892. .statstext .van-icon__image {
  893. height: 0.7em;
  894. }
  895. .visitStoreIco {
  896. float: left;
  897. float: left;
  898. width: 26px;
  899. text-align: center;
  900. background-color: #ffba13;
  901. color: #fff;
  902. border-radius: 100%;
  903. margin-left: 14px;
  904. line-height: 26px;
  905. height: 26px;
  906. }
  907. </style>