hzSelectCity.vue 25 KB

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