selectCity.vue 25 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906
  1. <template>
  2. <view>
  3. <u-navbar :title="title" @leftClick='back' :placeholder='true'>
  4. </u-navbar>
  5. <view class="row1">
  6. <view class="start-place" :class="type==0?'active1':''" @click="changeCity(0)">选择发货地</view>
  7. <view class="end-place" :class="type==1?'active1':''" @click="changeCity(1)">选择收货地</view>
  8. </view>
  9. <view class="container">
  10. <view class="row2">
  11. <view class="content1" v-if="type==0">
  12. <view class="history-city-title">历史发货地</view>
  13. <view class="city-list">
  14. <view class="city" v-for="(item,index) in historyFcityList" :key='index'
  15. @click="historyClick(0,item)">
  16. {{item.selected}}
  17. </view>
  18. </view>
  19. </view>
  20. <view class="content2" v-if="type==1">
  21. <view class="history-city-title">历史收货地</view>
  22. <view class="city-list">
  23. <view class="city" v-for="(item,index) in historyScityList" :key='index'
  24. @click="historyClick(1,item)">
  25. {{item.selected}}
  26. </view>
  27. </view>
  28. </view>
  29. </view>
  30. </view>
  31. <view class="page">
  32. <view class="title flex flex-space-between">
  33. <view class="flex nav-bag-left">
  34. <!-- 省 -->
  35. <view class="flex" :class="(type==0?fstatus:sstatus)==0?'select-active':''" @click="titleClick(0)">
  36. <view class="tt point">{{type==0?fchooseprovince:schooseprovince}}</view>
  37. <view v-if="type==0?fchooseprovince:schooseprovince" style="margin: 0 10rpx;">></view>
  38. </view>
  39. <!-- 市 -->
  40. <view class="flex"
  41. v-if="(type==0?fchooseprovince:schooseprovince)!='选择'&&(type==0?fchooseprovince:schooseprovince)!='全国'"
  42. :class="(type==0?fstatus:sstatus)==1?'select-active':''" @click="titleClick(1)">
  43. <view class="tt point nav-point">{{type==0?fchoosecity:schoosecity}}</view>
  44. <view v-if="type==0?fchoosecity:schoosecity" style="margin: 0 10rpx;">></view>
  45. </view>
  46. <!-- 区 -->
  47. <view class="tt area"
  48. v-if="(type==0?fchooseprovince:schooseprovince)!='选择'&&(type==0?fchoosecity:schoosecity)!='请选择市'&&(type==0?fchoosecity:schoosecity)!='全部'"
  49. :class="(type==0?fstatus:sstatus)==2?'select-active':''" @click="titleClick(2)">
  50. {{type==0?fchoosearea:schoosearea}}
  51. </view>
  52. </view>
  53. <view class="back-level" v-if="(type==0?fstatus:sstatus)!=0" @click="backLevel">返回上一级</view>
  54. </view>
  55. <view class="link">
  56. <!-- 省 -->
  57. <view class="container" v-if="(type==0?fstatus:sstatus)==0">
  58. <view class="content-item" :class="index ==(type==0?isfprovince:issprovince) ?'active':''"
  59. @click="selectProvince(item, index,(type==0?fstatus:sstatus))"
  60. v-for="(item,index) in (type==0?fprovincelist:sprovincelist)"
  61. v-show='type==1||type==0&&item.label!="全国"' :key="index">
  62. {{item.label}}
  63. </view>
  64. </view>
  65. <!-- 市 -->
  66. <view class="container" v-if="(type==0?fstatus:sstatus)==1">
  67. <view class="content-item" :class="index == (type==0?isfcity:isscity)?'active':''"
  68. @click="selectCity(item, index,type==0?fstatus:sstatus)"
  69. v-for="(item,index) in (type==0?fcitylist:scitylist)" :key="index">
  70. {{item.label}}
  71. </view>
  72. </view>
  73. <!-- index ==(type==0?isfarea:issarea) -->
  74. <!-- 区 -->
  75. <view class="container" v-if="(type==0?fstatus:sstatus)==2">
  76. <view class="content-item" :class="item.checked?'active':''"
  77. @click="selectaArea(item, index,(type==0?fstatus:sstatus))"
  78. v-for="(item,index) in (type==0?farealist:sarealist)" :key="index">
  79. {{item.label}}
  80. </view>
  81. </view>
  82. </view>
  83. </view>
  84. <u-button class="btn" @click="confirmBtn">确定</u-button>
  85. <u-toast ref="uToast"></u-toast>
  86. </view>
  87. </template>
  88. <script>
  89. import {
  90. address
  91. } from '@/components/data/data.js'
  92. export default {
  93. data() {
  94. return {
  95. fstatus: 0,
  96. sstatus: 0,
  97. isfprovince: null,
  98. isfcity: null,
  99. isfarea: null,
  100. issprovince: null,
  101. isscity: null,
  102. issarea: null,
  103. fprovincelist: [],
  104. sprovincelist: [],
  105. fcitylist: [],
  106. scitylist: [],
  107. farealist: [],
  108. sarealist: [],
  109. fchooseprovince: '选择',
  110. fchoosecity: '请选择市',
  111. fchoosearea: '请选择区',
  112. schooseprovince: '选择',
  113. schoosecity: '请选择市',
  114. schoosearea: '请选择区',
  115. heightCot: 0,
  116. historyFcityList: [],
  117. historyScityList: [],
  118. title: '',
  119. type: 0,
  120. count: 0,
  121. ftitle: '',
  122. ftitleList: [],
  123. stitleList: [],
  124. stitle: '',
  125. selectList: [],
  126. }
  127. },
  128. created() {
  129. this.fprovincelist = address
  130. this.sprovincelist = address
  131. console.log('---------------------------------')
  132. console.log(this.type)
  133. },
  134. onLoad(options) {
  135. console.log(options)
  136. this.type = options.type
  137. this.title = JSON.parse(options.startPlace).selected + '→' + JSON.parse(options.endPlace).selected
  138. //获取缓存收发地
  139. if (uni.getStorageSync('fPlaceList')) {
  140. this.historyFcityList = uni.getStorageSync('fPlaceList');
  141. } else {
  142. this.historyFcityList = []
  143. }
  144. if (uni.getStorageSync('sPlaceList')) {
  145. this.historyScityList = uni.getStorageSync('sPlaceList');
  146. } else {
  147. this.historyScityList = []
  148. }
  149. //赋值地区
  150. },
  151. mounted() {
  152. if (uni.getStorageSync('fPlaceObj')) {
  153. this.fchooseprovince = uni.getStorageSync('fPlaceObj').fchooseprovince
  154. this.fchoosecity = uni.getStorageSync('fPlaceObj').fchoosecity
  155. this.fchoosearea = uni.getStorageSync('fPlaceObj').fchoosearea
  156. for (var i = 0; i < this.fprovincelist.length; i++) {
  157. if (this.fprovincelist[i].label == this.fchooseprovince) {
  158. this.fprovincelist[i].checked = true
  159. this.fcitylist = this.fprovincelist[i].child
  160. for (var q = 0; q < this.fcitylist.length; q++) {
  161. if (this.fcitylist[q].label == this.fchoosecity) {
  162. this.fcitylist[q].checked = true
  163. this.farealist = this.fcitylist[q].child
  164. for (var area = 0; area < this.farealist.length; area++) {
  165. if (this.farealist[area].label == this.fchoosearea) {
  166. this.farealist[area].checked = true
  167. }
  168. }
  169. }
  170. }
  171. }
  172. }
  173. this.fstatus = 2
  174. }
  175. if (uni.getStorageSync('sPlaceObj')) {
  176. // sprovincelist
  177. // console.log(this.sprovincelist)
  178. this.schooseprovince = uni.getStorageSync('sPlaceObj').schooseprovince
  179. this.schoosecity = uni.getStorageSync('sPlaceObj').schoosecity
  180. this.schoosearea = uni.getStorageSync('sPlaceObj').schoosearea
  181. if (this.schooseprovince == '全国') {
  182. this.sstatus = 0
  183. this.$set(this.sprovincelist[0], 'checked', true)
  184. this.issprovince = 0
  185. } else {
  186. for (var i = 0; i < this.sprovincelist.length; i++) {
  187. if (this.sprovincelist[i].label == this.schooseprovince) {
  188. this.sprovincelist[i].checked = true
  189. this.scitylist = this.sprovincelist[i].child
  190. for (var q = 0; q < this.scitylist.length; q++) {
  191. if (this.scitylist[q].label == this.schoosecity) {
  192. this.scitylist[q].checked = true
  193. this.sarealist = this.scitylist[q].child
  194. for (var area = 0; area < this.sarealist.length; area++) {
  195. if (this.sarealist[area].label == this.schoosearea) {
  196. this.sarealist[area].checked = true
  197. }
  198. }
  199. }
  200. }
  201. }
  202. }
  203. this.sstatus = 2
  204. }
  205. }
  206. },
  207. methods: {
  208. historyClick(type, val) {
  209. console.log(type)
  210. if (type == 0) {
  211. this.historyFcityList.unshift(val)
  212. let _newList = this.makeHistoryList(val)
  213. uni.setStorageSync('fPlaceList', _newList);
  214. uni.setStorageSync('fPlaceObj', val);
  215. } else {
  216. this.historyScityList.unshift(val)
  217. let _newList = this.makeHistoryList(val)
  218. uni.setStorageSync('sPlaceList', _newList);
  219. uni.setStorageSync('sPlaceObj', val)
  220. }
  221. uni.switchTab({
  222. url: '/pages/goodSource/index'
  223. });
  224. },
  225. // 历史收发地去重
  226. makeHistoryList(val) {
  227. if (this.type == 0) {
  228. let _obj = {}
  229. // for (let i = 0; i < this.historyScityList.length; i++) {
  230. // // let _data = this.historyScityList[i]
  231. // }
  232. if (val.selected == '全国' || val.fchoosecity == '全部') {
  233. this.historyFcityList = this.historyFcityList.reduce((cur, item) => {
  234. _obj[item.selected] ? "" : _obj[item.selected] = true && cur.push(item);
  235. return cur;
  236. }, [])
  237. } else {
  238. this.historyFcityList = this.historyFcityList.reduce((cur, item) => {
  239. if (item.fchoosecity == val.fchoosecity) {
  240. _obj[item.selected] ? "" : _obj[item.selected] = true && cur.push(item);
  241. return cur;
  242. } else {
  243. _obj[item.selected] ? "" : _obj[item.selected] = true && cur.push(item);
  244. return cur;
  245. }
  246. }, [])
  247. }
  248. return this.historyFcityList
  249. } else {
  250. let _obj = {}
  251. // for (let i = 0; i < this.historyScityList.length; i++) {
  252. // // let _data = this.historyScityList[i]
  253. // }
  254. if (val.selected == '全国' || val.schoosecity == '全部') {
  255. this.historyScityList = this.historyScityList.reduce((cur, item) => {
  256. _obj[item.selected] ? "" : _obj[item.selected] = true && cur.push(item);
  257. return cur;
  258. }, [])
  259. } else {
  260. this.historyScityList = this.historyScityList.reduce((cur, item) => {
  261. if (item.schoosecity == val.schoosecity) {
  262. _obj[item.selected] ? "" : _obj[item.selected] = true && cur.push(item);
  263. return cur;
  264. } else {
  265. _obj[item.selected] ? "" : _obj[item.selected] = true && cur.push(item);
  266. return cur;
  267. }
  268. }, [])
  269. }
  270. return this.historyScityList
  271. }
  272. },
  273. confirmBtn() {
  274. //设置地区 0发货地 1收货地
  275. if (this.fchooseprovince == '选择' || (this.fchoosearea == '请选择区' && this.fchoosecity != '全部') || (this
  276. .fchoosecity == '请选择市' && this.fchooseprovince != '全国')) {
  277. this.$refs.uToast.show({
  278. type: 'error',
  279. message: "请选择发货地区域!",
  280. })
  281. return
  282. }
  283. //收货地
  284. if (this.schooseprovince == '选择' || (this.schoosearea == '请选择区' && this.schoosecity != '全部' && this
  285. .schooseprovince != '全国') || (this.schoosecity == '请选择市' && this.schooseprovince != '全国')) {
  286. this.$refs.uToast.show({
  287. type: 'error',
  288. message: "请选择收货地区域!",
  289. })
  290. return
  291. }
  292. // }
  293. // console.log("省", this.fchooseprovince)
  294. // console.log("市", this.fchoosecity)
  295. // console.log("区", this.fchoosearea)
  296. let _obj = {
  297. fchooseprovince: this.fchooseprovince,
  298. fchoosecity: this.fchoosecity,
  299. fchoosearea: this.fchoosearea,
  300. selected: ''
  301. }
  302. //选中全国
  303. if (this.fchoosecity == '请选择市' && this.fchooseprovince == '全国') {
  304. _obj.selected = this.fchooseprovince
  305. this.historyFcityList.unshift(_obj)
  306. let _newList = this.makeHistoryList(_obj)
  307. uni.setStorageSync('fPlaceList', _newList);
  308. }
  309. //选择省
  310. if (this.fchoosearea == '请选择区' && this.fchoosecity == '全部') {
  311. _obj.selected = this.fchooseprovince
  312. this.historyFcityList.unshift(_obj)
  313. let _newList = this.makeHistoryList(_obj)
  314. uni.setStorageSync('fPlaceList', _newList);
  315. }
  316. //选择市
  317. if (this.fchoosearea == '全部') {
  318. if (this.fchoosecity == '市辖区') {
  319. _obj.selected = this.fchooseprovince
  320. } else {
  321. _obj.selected = this.fchoosecity
  322. }
  323. this.historyFcityList.unshift(_obj)
  324. let _newList = this.makeHistoryList(_obj)
  325. uni.setStorageSync('fPlaceList', _newList);
  326. }
  327. uni.setStorageSync('fPlaceObj', _obj);
  328. //选择区
  329. if (this.fchoosearea != '请选择区' && this.fchoosearea != '全部') {
  330. console.log(this.fchooseprovince, this.fchoosecity, this.fchoosearea)
  331. // let _list = this.fchoosearea.split(',')
  332. // let _newList
  333. // //设置历史收发地并去重,区重名判断是否是同一个市在去重
  334. // for (let i = 0; i < _list.length; i++) {
  335. // let _deepObj = uni.$u.deepClone(_obj)
  336. // _deepObj.selected = _list[i]
  337. // this.historyFcityList.unshift(_deepObj)
  338. // _newList = this.makeHistoryList(_deepObj)
  339. // }
  340. // console.log(_newList)
  341. uni.setStorageSync('fPlaceList', this.historyFcityList);
  342. uni.setStorageSync('fPlaceObj', {
  343. fchooseprovince: this.fchooseprovince,
  344. fchoosecity: this.fchoosecity,
  345. fchoosearea: this.fchoosearea,
  346. selected: this.fchoosearea
  347. });
  348. }
  349. console.log(this.historyFcityList)
  350. // uni.switchTab({
  351. // url: '/pages/goodSource/index'
  352. // });
  353. // } else {
  354. let _obj1 = {
  355. schooseprovince: this.schooseprovince,
  356. schoosecity: this.schoosecity,
  357. schoosearea: this.schoosearea,
  358. selected: ''
  359. }
  360. //选中全国
  361. if (this.schoosecity == '请选择市' && this.schooseprovince == '全国') {
  362. _obj1.selected = this.schooseprovince
  363. this.historyScityList.unshift(_obj1)
  364. let _newList = this.makeHistoryList(_obj1)
  365. uni.setStorageSync('sPlaceList', _newList);
  366. }
  367. //选择省
  368. if (this.schoosearea == '请选择区' && this.schoosecity == '全部') {
  369. _obj1.selected = this.schooseprovince
  370. this.historyScityList.unshift(_obj1)
  371. let _newList = this.makeHistoryList(_obj1)
  372. uni.setStorageSync('sPlaceList', _newList);
  373. }
  374. //选择市
  375. if (this.schoosearea == '全部') {
  376. if (this.schoosecity == '市辖区') {
  377. _obj1.selected = this.schooseprovince
  378. } else {
  379. _obj1.selected = this.schoosecity
  380. }
  381. this.historyScityList.unshift(_obj1)
  382. let _newList = this.makeHistoryList(_obj1)
  383. uni.setStorageSync('sPlaceList', _newList);
  384. }
  385. uni.setStorageSync('sPlaceObj', _obj1);
  386. //选择区
  387. if (this.schoosearea != '请选择区' && this.schoosearea != '全部') {
  388. let _list = this.schoosearea.split(',')
  389. let _newList
  390. for (let i = 0; i < _list.length; i++) {
  391. let _deepObj = uni.$u.deepClone(_obj1)
  392. _deepObj.selected = _list[i]
  393. this.historyScityList.unshift(_deepObj)
  394. _newList = this.makeHistoryList(_deepObj)
  395. }
  396. // console.log(_newList)
  397. uni.setStorageSync('sPlaceList', this.historyScityList);
  398. uni.setStorageSync('sPlaceObj', {
  399. schooseprovince: this.schooseprovince,
  400. schoosecity: this.schoosecity,
  401. schoosearea: this.schoosearea,
  402. selected: this.schoosearea
  403. });
  404. }
  405. console.log(this.historyScityList)
  406. this.schooseprovince = '选择'
  407. this.schoosecity = '请选择市'
  408. this.schoosearea = '请选择区'
  409. this.fchooseprovince = '选择'
  410. this.fchoosecity = '请选择市'
  411. this.fchoosearea = '请选择区'
  412. uni.removeStorageSync('longitudeAndLatitude')
  413. uni.switchTab({
  414. url: '/pages/goodSource/index'
  415. });
  416. },
  417. //返回上一级
  418. backLevel() {
  419. // this.count=0;
  420. if (this.type == 0) {
  421. this.fstatus--
  422. } else {
  423. this.sstatus--
  424. }
  425. if ((this.type == 0 ? this.fstatus : this.sstatus) == 1) {
  426. if (this.type == 0) {
  427. this.fchoosecity = '请选择市'
  428. this.fchoosearea = ''
  429. this.ftitle = ''
  430. this.isfcity = null
  431. this.ftitleList = []
  432. } else {
  433. this.schoosecity = '请选择市'
  434. this.schoosearea = ''
  435. this.stitle = ''
  436. this.isscity = null
  437. this.stitleList = []
  438. }
  439. } else if ((this.type == 0 ? this.fstatus : this.sstatus) == 0) {
  440. if (this.type == 0) {
  441. this.fchooseprovince = '选择'
  442. this.isfprovince = null
  443. } else {
  444. this.schooseprovince = '选择'
  445. this.issprovince = null
  446. }
  447. }
  448. },
  449. // 点击面包屑导航
  450. titleClick(status) {
  451. this.ftitle = ''
  452. this.stitle = ''
  453. this.count = 0
  454. if (this.type == 0) {
  455. this.fstatus = status
  456. this.isfprovince = null
  457. this.isfcity = null
  458. this.isfarea = null
  459. if (this.fchoosecity == '全部') return;
  460. } else {
  461. this.sstatus = status
  462. this.issprovince = null
  463. this.isscity = null
  464. this.issarea = null
  465. if (this.fchoosecity == '全部') return;
  466. }
  467. if (status == 0) {
  468. if (this.type == 0) {
  469. this.fchooseprovince = '选择'
  470. this.fchoosecity = '请选择市'
  471. this.fchoosearea = '请选择区'
  472. this.ftitleList = []
  473. } else {
  474. this.schooseprovince = '选择'
  475. this.schoosecity = '请选择市'
  476. this.schoosearea = '请选择区'
  477. this.stitleList = []
  478. }
  479. } else if (status == 1) {
  480. if (this.type == 0) {
  481. this.fchoosecity = '请选择市'
  482. this.fchoosearea = '请选择区'
  483. this.ftitleList = []
  484. } else {
  485. this.schoosecity = '请选择市'
  486. this.schoosearea = '请选择区'
  487. this.stitleList = []
  488. }
  489. }
  490. },
  491. // 选择省
  492. selectProvince(item, i, statusIndex) {
  493. console.log(this.type)
  494. this.count = 0;
  495. if (this.type == 0) {
  496. if (i == 0) {
  497. this.$refs.uToast.show({
  498. type: 'error',
  499. message: "发货地不可选择全国!",
  500. })
  501. return
  502. }
  503. this.fchoosecity = '请选择市'
  504. this.fchoosearea = '请选择区'
  505. this.isfprovince = i
  506. this.fchooseprovince = item.label
  507. if (item.child) {
  508. this.fcitylist = item.child
  509. }
  510. if (this.fchoosecity != '全部') {
  511. this.fstatus = statusIndex + 1
  512. }
  513. } else {
  514. this.issprovince = i
  515. this.schooseprovince = item.label
  516. if (item.label == '全国') {
  517. item.checked = !item.checked
  518. if (!item.checked) {
  519. this.issprovince = null
  520. }
  521. return
  522. } else {
  523. this.schoosecity = '请选择市'
  524. this.schoosearea = '请选择区'
  525. if (item.child) {
  526. this.scitylist = item.child
  527. }
  528. if (this.schoosecity != '全部') {
  529. this.sstatus = statusIndex + 1
  530. }
  531. }
  532. }
  533. },
  534. // 选择市
  535. selectCity(item, i, statusIndex) {
  536. if (item.label == '全部') {
  537. this.$refs.uToast.show({
  538. type: 'error',
  539. message: "不能选择全部,请重新选择!"
  540. })
  541. return
  542. }
  543. this.count = 0;
  544. if (this.type == 0) {
  545. this.isfcity = i
  546. } else {
  547. this.isscity = i
  548. }
  549. if (item.child) {
  550. for (let i = 0; i < item.child.length; i++) {
  551. item.child[i].checked = false
  552. }
  553. if (this.type == 0) {
  554. this.farealist = item.child
  555. } else {
  556. this.sarealist = item.child
  557. }
  558. }
  559. if (this.type == 0) {
  560. this.fchoosecity = item.label
  561. } else {
  562. this.schoosecity = item.label
  563. }
  564. if ((this.type == 0 ? this.fchoosecity : this.schoosecity) != '全部') {
  565. if (this.type == 0) {
  566. this.fstatus = statusIndex + 1
  567. } else {
  568. this.sstatus = statusIndex + 1
  569. }
  570. }
  571. },
  572. //选择区
  573. selectaArea(item, i) {
  574. if (item.label == '全部') {
  575. if (this.type == 0) {
  576. for (let i = 0; i < this.farealist.length; i++) {
  577. if (i == 0) {
  578. this.farealist[i].checked = true
  579. } else {
  580. this.farealist[i].checked = false
  581. }
  582. }
  583. this.ftitleList = []
  584. this.fchoosearea = '全部'
  585. this.$forceUpdate()
  586. return
  587. } else {
  588. for (let i = 0; i < this.sarealist.length; i++) {
  589. if (i == 0) {
  590. this.sarealist[i].checked = true
  591. } else {
  592. this.sarealist[i].checked = false
  593. }
  594. }
  595. this.stitleList = []
  596. this.schoosearea = '全部'
  597. this.$forceUpdate()
  598. return
  599. }
  600. }
  601. if (this.type == 0) {
  602. this.farealist[0].checked = false
  603. if (this.ftitleList.length < 3) {
  604. item.checked = !item.checked
  605. if (item.checked) {
  606. if (this.ftitleList.indexOf(item.label) == -1) {
  607. this.ftitleList.push(item.label)
  608. }
  609. } else if (!item.checked) {
  610. for (var i = 0; i < this.ftitleList.length; i++) {
  611. console.log(this.ftitleList[i])
  612. if (this.ftitleList[i] == item.label) {
  613. this.ftitleList.splice(i, 1)
  614. }
  615. }
  616. }
  617. } else {
  618. if (item.checked) {
  619. item.checked = !item.checked
  620. for (var i = 0; i < this.ftitleList.length; i++) {
  621. if (this.ftitleList[i] == item.label) {
  622. this.ftitleList.splice(i, 1)
  623. }
  624. }
  625. } else {
  626. this.$refs.uToast.show({
  627. type: 'error',
  628. message: "最多选择3个地区",
  629. })
  630. }
  631. }
  632. this.ftitle = this.ftitleList.toString()
  633. this.fchoosearea = this.ftitleList.toString()
  634. } else {
  635. this.sarealist[0].checked = false
  636. if (this.stitleList.length < 3) {
  637. item.checked = !item.checked
  638. if (item.checked) {
  639. if (this.stitleList.indexOf(item.label) == -1) {
  640. this.stitleList.push(item.label)
  641. }
  642. } else if (!item.checked) {
  643. for (var i = 0; i < this.stitleList.length; i++) {
  644. console.log(this.stitleList[i])
  645. if (this.stitleList[i] == item.label) {
  646. this.stitleList.splice(i, 1)
  647. }
  648. }
  649. }
  650. } else {
  651. if (item.checked) {
  652. item.checked = !item.checked
  653. for (var i = 0; i < this.stitleList.length; i++) {
  654. if (this.stitleList[i] == item.label) {
  655. this.stitleList.splice(i, 1)
  656. }
  657. }
  658. } else {
  659. this.$refs.uToast.show({
  660. type: 'error',
  661. message: "最多选择3个地区",
  662. })
  663. }
  664. }
  665. this.stitle = this.stitleList.toString()
  666. this.schoosearea = this.stitleList.toString()
  667. }
  668. console.log(this.ftitleList)
  669. this.$forceUpdate()
  670. //设置面包屑 0发货地 1收货地
  671. // if (this.type == 0) {
  672. // this.farealist[0].checked = false
  673. // // if(this.ftitleList.indexOf(item.label)==-1){
  674. // // this.ftitleList.push(item.label)
  675. // // }
  676. // if (item.checked && !this.fchoosearea.includes(item.label)) {
  677. // if (this.ftitle) {
  678. // this.ftitle += ',' + item.label
  679. // } else {
  680. // this.ftitle += item.label
  681. // }
  682. // this.fchoosearea = this.ftitle
  683. // console.log(this.fchoosearea)
  684. // } else {
  685. // if (this.ftitle.includes(',' + item.label)) {
  686. // this.ftitle = this.ftitle.replace(',' + item.label, '')
  687. // this.fchoosearea = this.fchoosearea.replace(',' + item.label, '')
  688. // } else {
  689. // let _val = this.ftitle.split(',')
  690. // let _len = _val.length;
  691. // if (_len == 1) {
  692. // this.ftitle = this.ftitle.replace(item.label, '')
  693. // this.fchoosearea = '请选择区'
  694. // } else if (_len > 1) {
  695. // this.ftitle = this.ftitle.replace(item.label + ',', '')
  696. // this.fchoosearea = this.fchoosearea.replace(item.label + ',', '')
  697. // }
  698. // }
  699. // }
  700. // } else {
  701. // if (item.checked && !this.schoosearea.includes(item.label)) {
  702. // if (this.stitle) {
  703. // this.stitle += ',' + item.label
  704. // } else {
  705. // this.stitle += item.label
  706. // }
  707. // this.schoosearea = this.stitle
  708. // } else {
  709. // if (this.stitle.includes(',' + item.label)) {
  710. // this.stitle = this.stitle.replace(',' + item.label, '')
  711. // this.schoosearea = this.schoosearea.replace(',' + item.label, '')
  712. // } else {
  713. // let _val = this.stitle.split(',')
  714. // let _len = _val.length;
  715. // if (_len == 1) {
  716. // this.stitle = this.stitle.replace(item.label, '')
  717. // this.schoosearea = '请选择区'
  718. // } else if (_len > 1) {
  719. // this.stitle = this.stitle.replace(item.label + ',', '')
  720. // this.schoosearea = this.schoosearea.replace(item.label + ',', '')
  721. // }
  722. // }
  723. // }
  724. // }
  725. },
  726. changeCity(type) {
  727. if (type == 0) {
  728. this.type = 0
  729. } else {
  730. this.type = 1
  731. }
  732. },
  733. back() {
  734. uni.navigateBack({
  735. })
  736. },
  737. }
  738. }
  739. </script>
  740. <style lang="scss" scoped>
  741. .row1 {
  742. display: flex;
  743. justify-content: space-evenly;
  744. margin-top: 10rpx;
  745. border-bottom: 1px solid #E6E6E6;
  746. }
  747. .start-place,
  748. .end-place {
  749. font-size: 28rpx;
  750. color: #B1B5C0;
  751. padding-bottom: 20rpx;
  752. }
  753. .active1 {
  754. position: relative;
  755. color: black;
  756. font-size: 32rpx;
  757. font-weight: 700;
  758. display: flex;
  759. justify-content: center;
  760. }
  761. .active1:after {
  762. content: '';
  763. position: absolute;
  764. bottom: 0rpx;
  765. width: 50%;
  766. left: 25%;
  767. padding: 0 20rpx;
  768. box-sizing: border-box;
  769. height: 6rpx;
  770. background: #2772FB;
  771. border-radius: 3px;
  772. }
  773. .history-city-title {
  774. font-size: 28rpx;
  775. font-weight: 700;
  776. color: #363636;
  777. margin-bottom: 20rpx;
  778. }
  779. .container {
  780. padding: 0 20rpx;
  781. }
  782. .content1 {
  783. margin: 20rpx 0;
  784. }
  785. .city-list {
  786. max-height: 118rpx;
  787. overflow: hidden;
  788. }
  789. .city {
  790. display: inline-block;
  791. font-size: 26rpx;
  792. text-align: center;
  793. padding: 8rpx 16rpx;
  794. margin: 0 20rpx 20rpx 0;
  795. height: 33rpx;
  796. line-height: 33rpx;
  797. border-radius: 4rpx;
  798. background: #F7F8FA;
  799. }
  800. .content2 {
  801. margin: 20rpx 0;
  802. }
  803. .container {
  804. // width: 100%;
  805. width: calc(100% - 40rpx);
  806. display: inline-flex;
  807. flex-flow: row wrap;
  808. align-content: flex-start;
  809. }
  810. .select-active,
  811. .back-level {
  812. color: #2772FB;
  813. font-size: 28rpx;
  814. }
  815. .content-item {
  816. background: #F7F8FA;
  817. margin: 10rpx;
  818. font-size: 24rpx;
  819. color: #333333;
  820. text-align: center;
  821. padding: 15rpx 0;
  822. border-radius: 10rpx;
  823. overflow: hidden;
  824. text-overflow: ellipsis;
  825. white-space: nowrap;
  826. box-sizing: border-box;
  827. flex: 0 0 calc(25% - 20rpx);
  828. }
  829. .title {
  830. margin: 0 20rpx;
  831. }
  832. .active {
  833. background: #E5F0FE;
  834. border-radius: 10rpx;
  835. // border: 1px solid #2772FB;
  836. color: #2772FB;
  837. box-sizing: border-box;
  838. }
  839. .area {
  840. width: 55%;
  841. text-overflow: ellipsis;
  842. white-space: nowrap;
  843. overflow: hidden;
  844. }
  845. .nav-bag-left {
  846. width: 70%;
  847. font-size: 30rpx;
  848. }
  849. .btn {
  850. background: #2772FB;
  851. color: white;
  852. width: 80%;
  853. position: absolute;
  854. bottom: 30rpx;
  855. margin-left: 10%;
  856. border-radius: 50rpx;
  857. }
  858. </style>