bindinfo.vue 33 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375
  1. <template>
  2. <view style="position: relative;">
  3. <!-- 胶囊 -->
  4. <mvBar :mysNavConfig="mysNavConfig"></mvBar>
  5. <view :style="{marginTop:navH}"></view>
  6. <view class="home">
  7. <view style="margin: 0 20rpx;">
  8. <uni-forms :value="formData" ref="form" validate-trigger="bind" err-show-type="undertext">
  9. <view class="title">
  10. <p>个人资料</p>
  11. </view>
  12. <uni-forms-item name="age" label="年龄区间">
  13. <picker @change="bindPickerChange" :value="index" :range="array"
  14. range-key="age_bracket_discribe">
  15. <view>{{ Xage }}</view>
  16. </picker>
  17. </uni-forms-item>
  18. <uni-forms-item name="skintype" label="国籍">
  19. <picker @change="bindPickerChange1" :value="index1" :range="array1" range-key="name">
  20. <view>{{ array1[index1].name }}</view>
  21. </picker>
  22. </uni-forms-item>
  23. <uni-forms-item name="vregion" label="探店地区">
  24. <picker class="picker" mode="multiSelector" :range="region" range-key="name"
  25. :value="regionIndex" @change="pickerChange" @columnchange="pickerColumnchange">
  26. <view class="pbox" :class="{'pbox_hover':regionStr != '请选择省市区'}">
  27. <view>{{regionStr}}</view>
  28. <text class="iconfont icon-you"></text>
  29. </view>
  30. </picker>
  31. </uni-forms-item>
  32. <uni-forms-item name="phone" required label="联系电话">
  33. <uni-easyinput type="number" maxlength="11" :inputBorder="true" v-model="formData.phone"
  34. placeholder="请输入联系电话">
  35. </uni-easyinput>
  36. </uni-forms-item>
  37. <view class="line"></view>
  38. <view class="title">
  39. <p>收货地址</p>
  40. </view>
  41. <uni-forms-item name="name" required label="收件人">
  42. <uni-easyinput type="text" :inputBorder="true" v-model="formData.name" placeholder="请输入收件人">
  43. </uni-easyinput>
  44. </uni-forms-item>
  45. <uni-forms-item name="tel" required label="联系电话">
  46. <uni-easyinput type="number" maxlength="11" :inputBorder="true" v-model="formData.tel"
  47. placeholder="请输入联系电话">
  48. </uni-easyinput>
  49. </uni-forms-item>
  50. <uni-forms-item name="fregion" required label="所在地区">
  51. <picker class="picker" mode="multiSelector" :range="region" range-key="name"
  52. :value="regionIndex1" @change="pickerChange1" @columnchange="pickerColumnchange1">
  53. <view class="pbox" :class="{'pbox_hover':regionStr1 != '请选择省市区'}">
  54. <view>{{regionStr1}}</view>
  55. <text class="iconfont icon-you"></text>
  56. </view>
  57. </picker>
  58. </uni-forms-item>
  59. <uni-forms-item name="detailregion" required label="详细地址">
  60. <uni-easyinput type="text" :inputBorder="true" v-model="formData.detailregion"
  61. placeholder="请输入详细地址(省/市/县/镇/)">
  62. </uni-easyinput>
  63. </uni-forms-item>
  64. <view class="setdeault">
  65. <view class="setdeault-text">设为默认收货地址</view>
  66. <switch style='zoom:.8;' @change="setDefault" />
  67. </view>
  68. <view class="line"></view>
  69. <view class="title">
  70. <p>{{platform.platform_name}}账号</p>
  71. </view>
  72. <uni-forms-item name="nickname" required label="昵称">
  73. <uni-easyinput type="text" v-model="formData.platform_nickname" placeholder="请填写账号昵称">
  74. </uni-easyinput>
  75. </uni-forms-item>
  76. <uni-forms-item name="numberfans" required label="粉丝数">
  77. <uni-easyinput type="number" v-model="fansCount" placeholder="请填写粉丝数量"
  78. v-if="fansCountInfo === 1" @input="onInput1">
  79. </uni-easyinput>
  80. <uni-easyinput type="digit" v-model="fansCount" placeholder="请填写粉丝数量" v-else
  81. @input="onInput">
  82. </uni-easyinput>
  83. <picker @change="bindPickerChange" :value="index3" :range="fansRange" range-key="label">
  84. <view>{{ fansLabel }}</view>
  85. </picker>
  86. </uni-forms-item>
  87. <uni-forms-item name="home_link" required label=" " label-width='10'>
  88. <uni-easyinput class="home-link" type="text" v-model="formData.home_page_url" style="width:650rpx"
  89. placeholder="请填写个人主页链接">
  90. </uni-easyinput>
  91. </uni-forms-item>
  92. <view style="margin-top: 40rpx;">
  93. <uni-forms-item name="home_img" required label="主页截图">
  94. <htz-image-upload :max="1" mediaType="image" name="file" :chooseNum="1" v-model="imageData"
  95. @chooseSuccess="ceshiChooseSuccess">
  96. </htz-image-upload>
  97. </uni-forms-item>
  98. </view>
  99. </uni-forms>
  100. </view>
  101. </view>
  102. <button class="btn1" @click="submitForm('form')">保存</button>
  103. </view>
  104. </template>
  105. <script>
  106. import region from '@/components/pca-code.json';
  107. import mvBar from "@/components/mys_navBar/mysNavBar";
  108. import htzImageUpload from '@/components/htz-image-upload/htz-image-upload.vue';
  109. import getPolicyEncode from '@/components/obs/getPolicy.js';
  110. import getSignature from '@/components/obs/GetSignature.js';
  111. export default {
  112. components: {
  113. mvBar,
  114. htzImageUpload,
  115. },
  116. data() {
  117. return {
  118. navH: getApp().globalData.navHeight,
  119. address: [],
  120. accountId: '',
  121. platform: {
  122. platform_id: '',
  123. platform_name: '',
  124. platform_icon: '',
  125. },
  126. isBind: true,
  127. imageData: [],
  128. ismodify: '',
  129. // 原数组
  130. oldRegion: region,
  131. // 处理后的数组
  132. region: [
  133. [],
  134. [],
  135. []
  136. ],
  137. // 选择省市区的下标Index 传则默认选中传递的
  138. regionIndex: [0, 0, 0],
  139. regionIndex1: [0, 0, 0],
  140. // 省市区字符串
  141. regionStr: '请选择省市区',
  142. regionStr1: '请选择省市区',
  143. formData: {
  144. age: '',
  145. nationality: '',
  146. phone: '',
  147. visitStoreRegion: '',
  148. name: '',
  149. tel: '',
  150. detailregion: '',
  151. fregion: '',
  152. setdefault: false,
  153. platform_nickname: '',
  154. fans_count: '',
  155. home_page_url: '',
  156. },
  157. index3: 0,
  158. fansLabel: "个",
  159. fansCount: 0,
  160. fansCountInfo: 1,
  161. fansRange: [{
  162. value: 1,
  163. label: '个'
  164. },
  165. {
  166. value: 10000,
  167. label: '万'
  168. },
  169. {
  170. value: 100000000,
  171. label: '亿'
  172. }
  173. ],
  174. index: 0,
  175. index1: 0,
  176. Xage: '请选择',
  177. Xskintype: '请选择',
  178. array: [{
  179. age_bracket_discribe: '请选择',
  180. age_aid: 0
  181. }, {
  182. age_bracket_discribe: '0~18',
  183. age_aid: 1
  184. }, {
  185. age_bracket_discribe: '18~25',
  186. age_aid: 2
  187. }, {
  188. age_bracket_discribe: '26~30',
  189. age_aid: 3
  190. }, {
  191. age_bracket_discribe: '30~40',
  192. age_aid: 4
  193. }, {
  194. age_bracket_discribe: '40+',
  195. age_aid: 5
  196. }],
  197. array1: [{
  198. name: '请选择',
  199. id: 0
  200. }, {
  201. name: '中国',
  202. id: 1
  203. }, {
  204. name: '外国',
  205. id: 2
  206. }],
  207. data: {},
  208. show: false,
  209. mysNavConfig: {
  210. /* 开启单页显示首页图标 */
  211. isHome: true,
  212. /* 固定导航 */
  213. navFixed: true,
  214. /* 标题 (屏幕中心居中 两边图标中心居中使用slot center1) */
  215. navTitle: {
  216. text: "个人信息",
  217. color: "",
  218. fontSize: "32rpx", // px upx rpx
  219. fontWeight: "normal", // 100 - 700
  220. },
  221. btnType: "type2",
  222. onLeftClick: '',
  223. /* type2 按钮 */
  224. type2Config: {
  225. // 左图标
  226. leftPath: "/static/img/png2.png",
  227. // 右图标
  228. rightPath: "/static/img/png4.png",
  229. // 圆角
  230. radius: "40rpx",
  231. },
  232. },
  233. }
  234. },
  235. onReady() {},
  236. onShow() {
  237. this.initRegion()
  238. this.getDefaultAddress()
  239. this.getlist()
  240. },
  241. onLoad(options) {
  242. this.platform.platform_id = parseInt(options.platform_id)
  243. if (options.account_id) {
  244. this.accountId = parseInt(options.account_id)
  245. this.isBind = false
  246. }
  247. },
  248. methods: {
  249. initRegion() {
  250. // 声明城市数组
  251. let cityArr = [];
  252. let countyArr = [];
  253. // 设置下标
  254. this.regionIndex = [0, 0, 0];
  255. // 改变城市列表
  256. this.region[1] = this.oldRegion[0].children.map(item => {
  257. cityArr.push({
  258. name: item.name,
  259. code: item.code
  260. });
  261. })
  262. this.$set(this.region, 1, cityArr);
  263. // 改变县区列表
  264. this.oldRegion[0].children[0].children.map(item => {
  265. countyArr.push({
  266. name: item.name,
  267. code: item.code
  268. });
  269. })
  270. this.$set(this.region, 2, countyArr);
  271. },
  272. // 信息表
  273. getlist() {
  274. this.$https.get('/youngee/c/g/get-info-tables')
  275. .then(res => {
  276. console.log(res)
  277. this.array = res.data.data.AgeBracket
  278. let list = res.data.data.ThirdPlatform
  279. for (var i = 0; i < list.length; ++i) {
  280. if (list[i].id == this.platform.platform_id) {
  281. this.platform.platform_icon = list[i].platform_icon
  282. this.platform.platform_name = list[i].platform_name
  283. }
  284. }
  285. this.getlist1()
  286. this.getaccount()
  287. })
  288. },
  289. // 达人详细信息表
  290. getlist1() {
  291. this.$https.get('/youngee/c/t/g/get-talent-info')
  292. .then(res => {
  293. console.log(res)
  294. if (res.data.data.talent_wx_number !== null) {
  295. if (res.data.data.talent_age_bracket !== 0) {
  296. for (var i = 0; i < this.array.length; i++) {
  297. if (this.array[i].age_aid == res.data.data.talent_age_bracket) {
  298. this.Xage = this.array[i].age_bracket_discribe
  299. }
  300. this.formData.age = res.data.data.talent_age_bracket
  301. }
  302. }
  303. if (res.data.data.talent_nationality !== 0) {
  304. this.index1 = res.data.data.talent_nationality
  305. this.formData.nationality = res.data.data.talent_nationality
  306. }
  307. if (res.data.data.visit_store_region !== 0) {
  308. let a = res.data.data.visit_store_region.toString().slice(0, 2)
  309. let b = res.data.data.visit_store_region.toString().slice(0, 4)
  310. let c = 0
  311. for (var i = 0; i < region.length; i++) {
  312. if (region[i].code == a) {
  313. a = region[i].name
  314. for (var j = 0; j < region[i].children.length; j++) {
  315. if (region[i].children[j].code == b) {
  316. b = region[i].children[j].name
  317. for (var o = 0; o < region[i].children[j].children
  318. .length; o++) {
  319. if (region[i].children[j].children[o].code == res.data.data
  320. .visit_store_region) {
  321. c = region[i].children[j].children[o].name
  322. }
  323. }
  324. }
  325. }
  326. }
  327. }
  328. this.regionStr = a + ' ' + b + ' ' + c
  329. this.formData.visitStoreRegion = res.data.data.visit_store_region
  330. }
  331. this.formData.phone = res.data.data.is_bind_info === 1 ? res.data.data
  332. .talent_phone_number : this.formData.phone
  333. }
  334. })
  335. },
  336. getaccount() {
  337. console.log(this.isBind)
  338. if (!this.isBind) {
  339. this.$https.get('/youngee/c/t/g/get-talent-account')
  340. .then(res => {
  341. console.log(res)
  342. if (res.data.code !== -3) {
  343. this.account = res.data.data
  344. for (var i = 0; i < this.account.length; i++) {
  345. if (this.platform.platform_id == this.account[i].platform_id) {
  346. this.formData.platform_nickname = this.account[i].platform_nickname
  347. this.formData.fans_count = this.account[i].fans_count
  348. this.formData.home_page_url = this.account[i].home_page_url
  349. this.imageData.push(this.account[i].home_page_capture_url);
  350. if (this.formData.fans_count >= 100000000) {
  351. this.index3 = 2
  352. this.fansCountInfo = this.fansRange[this.index3].value;
  353. this.fansLabel = this.fansRange[this.index3].label;
  354. this.fansCount = (this.formData.fans_count / 100000000).toFixed(1)
  355. } else if (this.formData.fans_count >= 10000) {
  356. console.log(this.formData.fans_count)
  357. this.index3 = 1
  358. this.fansCountInfo = this.fansRange[this.index3].value;
  359. this.fansLabel = this.fansRange[this.index3].label;
  360. this.fansCount = (this.formData.fans_count / 10000).toFixed(1)
  361. } else {
  362. this.index3 = 0
  363. this.fansCountInfo = this.fansRange[this.index3].value;
  364. this.fansLabel = this.fansRange[this.index3].label;
  365. this.fansCount = this.formData.fans_count
  366. }
  367. }
  368. }
  369. }
  370. })
  371. }
  372. },
  373. setDefault(e) {
  374. console.log(e.detail.value)
  375. if (e.detail.value)
  376. this.formData.setdefault = 1
  377. else
  378. this.formData.setdefault = 0
  379. },
  380. getDefaultAddress() {
  381. this.$https.get('/youngee/c/t/g/get-talent-default-address').then(res => {
  382. this.formData.name = res.data.data.receiver_name
  383. this.formData.tel = res.data.data.phone_number
  384. this.formData.detailregion = res.data.data.detail_addr
  385. this.formData.fregion = res.data.data.region_code
  386. console.log("111")
  387. console.log(this.formData)
  388. let a = res.data.data.region_code.toString().slice(0, 2)
  389. let b = res.data.data.region_code.toString().slice(0, 4)
  390. let c = 0
  391. for (var i = 0; i < region.length; i++) {
  392. if (region[i].code == a) {
  393. a = region[i].name
  394. for (var j = 0; j < region[i].children.length; j++) {
  395. if (region[i].children[j].code == b) {
  396. b = region[i].children[j].name
  397. for (var o = 0; o < region[i].children[j].children.length; o++) {
  398. if (region[i].children[j].children[o].code == res.data.data.region_code) {
  399. c = region[i].children[j].children[o].name
  400. }
  401. }
  402. }
  403. }
  404. }
  405. }
  406. this.regionStr1 = a + ' ' + b + ' ' + c
  407. })
  408. },
  409. /**
  410. * 手动提交
  411. * @param {Object} form
  412. */
  413. submitForm(form) {
  414. // console.log(this.formData);
  415. let fans
  416. this.formData.fans_count = this.fansCount * this.fansCountInfo
  417. if (parseInt(this.formData.fans_count) === 0) {
  418. uni.showToast({
  419. title: '请填写粉丝量数量',
  420. icon: 'none'
  421. })
  422. return
  423. }
  424. this.$refs.form.validate().then(res => {
  425. const iphoneReg1 = /^1[0-9]{10}$/
  426. const urlReg =
  427. /(ht|f)tp(s?)\:\/\/[0-9a-zA-Z]([-.\w]*[0-9a-zA-Z])*(:(0-9)*)*(\/?)([a-zA-Z0-9\-\.\?\,\'\/\\\+&amp;%$#_]*)?/
  428. if (!iphoneReg1.test(this.formData.phone)) {
  429. uni.showToast({
  430. title: '电话号码格式不正确',
  431. icon: 'none'
  432. })
  433. return
  434. }
  435. if (!urlReg.test(this.formData.home_page_url)) {
  436. uni.showToast({
  437. title: '主页链接格式不正确',
  438. icon: 'none'
  439. })
  440. return
  441. }
  442. uni.showToast({
  443. title: '提交成功'
  444. })
  445. this.$https.post('/youngee/c/t/p/talent-info', {
  446. talent_age_bracket: this.formData.age,
  447. talent_nationality: this.formData.nationality,
  448. visit_store_region: this.formData.visitStoreRegion,
  449. talent_phone_number: this.formData.phone,
  450. })
  451. .then(res => {
  452. console.log(res)
  453. })
  454. this.$https.post('/youngee/c/t/p/add-talent-address', {
  455. region_code: this.formData.fregion,
  456. detail_addr: this.formData.detailregion,
  457. phone_number: this.formData.phone,
  458. receiver_name: this.formData.name,
  459. default_tag: this.formData.setdefault
  460. })
  461. .then(res => {
  462. console.log(res)
  463. })
  464. this.formData.home_page_capture_url = this.imageData[0]
  465. if (this.isBind) {
  466. this.$https.post('/youngee/c/t/p/add-talent-account', {
  467. platform_id: this.platform.platform_id,
  468. platform_nickname: this.formData.platform_nickname,
  469. home_page_url: this.formData.home_page_url,
  470. fans_count: this.formData.fans_count,
  471. home_page_capture_url: this.formData
  472. .home_page_capture_url,
  473. })
  474. .then(res => {
  475. console.log(res)
  476. })
  477. } else {
  478. this.$https.post('/youngee/c/t/p/update-talent-account', {
  479. account_id: this.accountId,
  480. platform_id: this.platform.platform_id,
  481. platform_nickname: this.formData.platform_nickname,
  482. home_page_url: this.formData.home_page_url,
  483. fans_count: this.formData.fans_count,
  484. home_page_capture_url: this.formData
  485. .home_page_capture_url,
  486. })
  487. .then(res => {
  488. console.log(res)
  489. })
  490. }
  491. uni.showToast({
  492. title: '修改成功'
  493. })
  494. uni.navigateBack()
  495. }).catch(err => {
  496. console.error('验证失败:', err)
  497. uni.showToast({
  498. title: '请填写所有信息',
  499. icon: 'none'
  500. })
  501. })
  502. },
  503. ceshiChooseSuccess(tempFilePaths, e) { //选择图片返回
  504. console.log('ceshiChooseSuccess', tempFilePaths, e);
  505. if (e == 0) {
  506. this.store = 'talent_upload/' + this.guid() + '.png'
  507. } else if (e == 1) {
  508. this.store = 'talent_upload/' + this.guid() + '.mp4'
  509. }
  510. /****************
  511. 以下代码是自定义上传逻辑,仅供参考
  512. ***************/
  513. this.imgUpload(tempFilePaths);
  514. /*******************************/
  515. console.log("imgdata" + this.imageData)
  516. },
  517. imgUpload(tempFilePaths) {
  518. let that = this
  519. console.log('imgUpload', tempFilePaths)
  520. let config = {
  521. AccessKeyId: 'IVW21DTGIIUBBAGXKK0Y', //AK
  522. SecretKey: 'Y01nEQNcLOATMw7uJwrk3yOdQZ2fqLhSnXcOKVDE', //SK
  523. EndPoint: 'https://horastar.obs.cn-east-3.myhuaweicloud.com', //上传文件的路径
  524. };
  525. let fileName = this.store; //指定上传到OBS桶中的对象名
  526. // let fileName = "talent_upload/icon-arrow-right.png"
  527. let OBSPolicy = { //设定policy内容
  528. "expiration": "2089-12-31T12:00:00.000Z",
  529. "conditions": [{
  530. "bucket": "horastar"
  531. }, //Bucket name
  532. // {"bucket": "goin"},
  533. {
  534. 'key': fileName
  535. }
  536. ]
  537. }
  538. let policyEncoded = getPolicyEncode(OBSPolicy); //计算policy编码值
  539. let signature = getSignature(policyEncoded, config.SecretKey); //计算signature
  540. uni.uploadFile({
  541. //url: config.EndPoint,
  542. url: config.EndPoint,
  543. filePath: tempFilePaths[0],
  544. name: 'file',
  545. formData: {
  546. 'AccessKeyID': config.AccessKeyId,
  547. 'policy': policyEncoded,
  548. 'signature': signature,
  549. 'key': fileName,
  550. },
  551. success: function(res) {
  552. console.log(res.statusCode); //打印响应状态码
  553. if (res.statusCode == '204') {
  554. that.imageData.push(config.EndPoint + '/' + fileName);
  555. console.log('上传图片成功', res)
  556. let obs_url = config.EndPoint + '/' + fileName; //用你自己的 bucket 名替换星号
  557. console.log(obs_url)
  558. that.formData.home_img = obs_url
  559. uni.showToast({
  560. title: '上传成功',
  561. icon: '成功'
  562. });
  563. } else {
  564. console.log('上传图片失败', res)
  565. uni.showToast({
  566. title: '上传失败',
  567. icon: '失败'
  568. });
  569. }
  570. },
  571. fail: function(e) {
  572. console.log(e);
  573. }
  574. })
  575. },
  576. guid() {
  577. return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function(c) {
  578. var r = Math.random() * 16 | 0,
  579. v = c == 'x' ? r : (r & 0x3 | 0x8);
  580. return v.toString(16);
  581. });
  582. },
  583. // 年龄选择的
  584. bindPickerChange: function(e) {
  585. this.index = e.detail.value;
  586. this.formData.age = this.array[this.index].age_aid
  587. this.Xage = this.array[this.index].age_bracket_discribe
  588. console.log(this.formData.age)
  589. },
  590. //国籍选择
  591. bindPickerChange1: function(e) {
  592. console.log(e)
  593. this.index1 = e.detail.value;
  594. this.formData.nationality = this.array1[this.index1].id
  595. console.log(this.formData.nationality)
  596. },
  597. //城市选择
  598. pickerChange(e) {
  599. // console.log(e, '1');
  600. this.regionIndex = e.detail.value;
  601. this.regionStr = this.region[0][this.regionIndex[0]].name + ' ' + this.region[1][this.regionIndex[
  602. 1]]
  603. .name + ' ' +
  604. this.region[2][this.regionIndex[2]].name;
  605. // 组件传值
  606. this.$emit('region', [this.region[0][this.regionIndex[0]].code, this.region[1][this.regionIndex[1]]
  607. .code,
  608. this.region[
  609. 2][this.regionIndex[2]].code
  610. ]);
  611. this.formData.visitStoreRegion = this.region[2][this.regionIndex[2]].code;
  612. },
  613. pickerColumnchange(e) {
  614. // console.log(e);
  615. // 第几列滑动
  616. // console.log(e.detail.column);
  617. // 第几列滑动的下标
  618. // console.log(e.detail.value)
  619. if (e.detail.column === 0) {
  620. // 声明城市数组
  621. let cityArr = [];
  622. let countyArr = [];
  623. // 设置下标
  624. this.regionIndex = [e.detail.value, 0, 0];
  625. // 改变城市列表
  626. this.region[1] = this.oldRegion[e.detail.value].children.map(item => {
  627. cityArr.push({
  628. name: item.name,
  629. code: item.code
  630. });
  631. })
  632. this.$set(this.region, 1, cityArr);
  633. // 改变县区列表
  634. this.oldRegion[e.detail.value].children[0].children.map(item => {
  635. countyArr.push({
  636. name: item.name,
  637. code: item.code
  638. });
  639. })
  640. this.$set(this.region, 2, countyArr);
  641. }
  642. if (e.detail.column === 1) {
  643. this.regionIndex[1] = e.detail.value;
  644. this.regionIndex[2] = 0;
  645. let countyArr = [];
  646. this.oldRegion[this.regionIndex[0]].children[this.regionIndex[1]].children.map(item => {
  647. countyArr.push({
  648. name: item.name,
  649. code: item.code
  650. });
  651. })
  652. this.$set(this.region, 2, countyArr);
  653. }
  654. if (e.detail.column === 2) {
  655. this.regionIndex[2] = e.detail.value;
  656. }
  657. },
  658. //城市选择
  659. pickerChange(e) {
  660. // console.log(e, '1');
  661. this.regionIndex = e.detail.value;
  662. this.regionStr = this.region[0][this.regionIndex[0]].name + ' ' + this.region[1][this.regionIndex[
  663. 1]]
  664. .name + ' ' +
  665. this.region[2][this.regionIndex[2]].name;
  666. // 组件传值
  667. this.$emit('region', [this.region[0][this.regionIndex[0]].code, this.region[1][this.regionIndex[1]]
  668. .code,
  669. this.region[
  670. 2][this.regionIndex[2]].code
  671. ]);
  672. this.formData.visitStoreRegion = this.region[2][this.regionIndex[2]].code;
  673. },
  674. pickerColumnchange(e) {
  675. // console.log(e);
  676. // 第几列滑动
  677. // console.log(e.detail.column);
  678. // 第几列滑动的下标
  679. // console.log(e.detail.value)
  680. if (e.detail.column === 0) {
  681. // 声明城市数组
  682. let cityArr = [];
  683. let countyArr = [];
  684. // 设置下标
  685. this.regionIndex = [e.detail.value, 0, 0];
  686. // 改变城市列表
  687. this.region[1] = this.oldRegion[e.detail.value].children.map(item => {
  688. cityArr.push({
  689. name: item.name,
  690. code: item.code
  691. });
  692. })
  693. this.$set(this.region, 1, cityArr);
  694. // 改变县区列表
  695. this.oldRegion[e.detail.value].children[0].children.map(item => {
  696. countyArr.push({
  697. name: item.name,
  698. code: item.code
  699. });
  700. })
  701. this.$set(this.region, 2, countyArr);
  702. }
  703. if (e.detail.column === 1) {
  704. this.regionIndex[1] = e.detail.value;
  705. this.regionIndex[2] = 0;
  706. let countyArr = [];
  707. this.oldRegion[this.regionIndex[0]].children[this.regionIndex[1]].children.map(item => {
  708. countyArr.push({
  709. name: item.name,
  710. code: item.code
  711. });
  712. })
  713. this.$set(this.region, 2, countyArr);
  714. }
  715. if (e.detail.column === 2) {
  716. this.regionIndex[2] = e.detail.value;
  717. }
  718. },
  719. //城市选择
  720. pickerChange1(e) {
  721. // console.log(e, '1');
  722. this.regionIndex1 = e.detail.value;
  723. this.regionStr1 = this.region[0][this.regionIndex1[0]].name + ' ' + this.region[1][this.regionIndex1[
  724. 1]]
  725. .name + ' ' +
  726. this.region[2][this.regionIndex1[2]].name;
  727. // 组件传值
  728. this.$emit('region', [this.region[0][this.regionIndex1[0]].code, this.region[1][this.regionIndex1[1]]
  729. .code,
  730. this.region[
  731. 2][this.regionIndex1[2]].code
  732. ]);
  733. this.formData.fregion = this.region[2][this.regionIndex1[2]].code;
  734. console.log(this.formData.fregion)
  735. },
  736. pickerColumnchange1(e) {
  737. if (e.detail.column === 0) {
  738. // 声明城市数组
  739. let cityArr = [];
  740. let countyArr = [];
  741. // 设置下标
  742. this.regionIndex1 = [e.detail.value, 0, 0];
  743. // 改变城市列表
  744. this.region[1] = this.oldRegion[e.detail.value].children.map(item => {
  745. cityArr.push({
  746. name: item.name,
  747. code: item.code
  748. });
  749. })
  750. this.$set(this.region, 1, cityArr);
  751. // 改变县区列表
  752. this.oldRegion[e.detail.value].children[0].children.map(item => {
  753. countyArr.push({
  754. name: item.name,
  755. code: item.code
  756. });
  757. })
  758. this.$set(this.region, 2, countyArr);
  759. }
  760. if (e.detail.column === 1) {
  761. this.regionIndex1[1] = e.detail.value;
  762. this.regionIndex1[2] = 0;
  763. let countyArr = [];
  764. this.oldRegion[this.regionIndex1[0]].children[this.regionIndex1[1]].children.map(item => {
  765. countyArr.push({
  766. name: item.name,
  767. code: item.code
  768. });
  769. })
  770. this.$set(this.region, 2, countyArr);
  771. }
  772. if (e.detail.column === 2) {
  773. this.regionIndex1[2] = e.detail.value;
  774. }
  775. },
  776. // 粉丝量量级选择
  777. bindPickerChange: function(e) {
  778. this.index3 = e.detail.value;
  779. this.fansLabel = this.fansRange[this.index3].label
  780. this.fansCountInfo = this.fansRange[this.index3].value
  781. console.log(this.fansCountInfo, this.fansLabel)
  782. },
  783. onInput(e) {
  784. console.log(e)
  785. e = (e.match(/^\d*(\.?\d{0,1})/g)[0]) || null
  786. // //重新赋值给input
  787. this.$nextTick(() => {
  788. this.fansCount = e
  789. })
  790. },
  791. onInput1(e) {
  792. console.log(e)
  793. e = e.replace(/\D/g, '')
  794. // e = (e.match(/^\d*(\.?\d{0,1})/g)[0]) || null
  795. // //重新赋值给input
  796. this.$nextTick(() => {
  797. this.fansCount = e
  798. })
  799. }
  800. },
  801. created() {
  802. let provinceArr = [];
  803. let cityArr = [];
  804. this.oldRegion.map((item, index) => {
  805. this.region[0].push({
  806. name: item.name,
  807. code: item.code
  808. });
  809. })
  810. // console.log(provinceArr);
  811. provinceArr.map((item, index) => {
  812. this.region[1].push({
  813. name: item.name,
  814. code: item.code
  815. });
  816. })
  817. cityArr.map((item, index) => {
  818. this.region[2].push({
  819. name: item.name,
  820. code: item.code
  821. });
  822. })
  823. this.regionStr = '请选择省市区';
  824. }
  825. };
  826. </script>
  827. <style>
  828. picker {
  829. position: relative;
  830. display: block;
  831. cursor: pointer;
  832. padding-left: 20rpx !important;
  833. padding-top: 20rpx !important;
  834. color: grey !important;
  835. }
  836. /deep/.uni-forms-item__inner {
  837. border-bottom: none !important;
  838. margin-bottom: 0 !important;
  839. }
  840. /deep/ .uni-forms-item__content {
  841. display: flex !important;
  842. align-items: center !important;
  843. justify-content: space-between;
  844. }
  845. </style>
  846. <style lang="scss" scoped>
  847. @charset "UTF-8";
  848. /* 头条小程序组件内不能引入字体 */
  849. /* #ifdef MP-TOUTIAO */
  850. @font-face {
  851. font-family: uniicons;
  852. font-weight: normal;
  853. font-style: normal;
  854. src: url("~@/static/uni.ttf") format("truetype");
  855. }
  856. /* #endif */
  857. /* #ifndef APP-NVUE */
  858. page {
  859. display: flex;
  860. flex-direction: column;
  861. box-sizing: border-box;
  862. background-color: #FFFFFF;
  863. min-height: 100%;
  864. height: auto;
  865. }
  866. view {
  867. font-size: 14px;
  868. // line-height: inherit;
  869. }
  870. .line {
  871. width: 96%;
  872. margin: 10rpx 2%;
  873. border-bottom: 1rpx solid #bbbbbb;
  874. }
  875. .title {
  876. height: 80rpx;
  877. display: flex;
  878. align-items: center;
  879. }
  880. .menu {
  881. position: fixed;
  882. top: 180rpx;
  883. background-color: #FFFFFF;
  884. justify-content: space-around;
  885. height: 80rpx;
  886. // height: 5%;
  887. width: 100%;
  888. display: flex;
  889. z-index: 10;
  890. margin-bottom: 10rpx;
  891. }
  892. .menu-item p {
  893. font-weight: 600;
  894. &.lor {
  895. border-bottom: 5rpx solid #F0D232;
  896. color: #F0D232;
  897. padding-bottom: 15rpx;
  898. }
  899. }
  900. .setdeault {
  901. display: flex;
  902. justify-content: space-between;
  903. }
  904. .btn1 {
  905. width: 100%;
  906. margin-top: 30rpx;
  907. font-size: 35rpx;
  908. color: #FFFFFF;
  909. background-color: #F0D232;
  910. border: none;
  911. border-radius: 0;
  912. }
  913. .uni-input-border,
  914. .uni-textarea-border {
  915. flex: 1;
  916. font-size: 14px;
  917. color: #666;
  918. border: 1px #FFFFFF solid;
  919. border-radius: 5px;
  920. /* #ifndef APP-NVUE */
  921. box-sizing: border-box;
  922. /* #endif */
  923. }
  924. .uni-input-border {
  925. padding: 0 10px;
  926. height: 35px;
  927. }
  928. .uni-textarea-border {
  929. padding: 10px;
  930. height: 80px;
  931. }
  932. .label-box {
  933. margin-right: 10px;
  934. }
  935. .transform-scale {
  936. transform: scale(0.7);
  937. }
  938. .butto {
  939. text-align: center;
  940. }
  941. .option {
  942. padding: 20rpx;
  943. }
  944. .uni-margin-wrap {
  945. width: 690rpx;
  946. width: 100%;
  947. ;
  948. }
  949. .swiper {
  950. height: 300rpx;
  951. }
  952. .swiper-item {
  953. display: block;
  954. height: 300rpx;
  955. line-height: 300rpx;
  956. text-align: center;
  957. }
  958. .swiper-list {
  959. margin-top: 40rpx;
  960. margin-bottom: 0;
  961. }
  962. .uni-common-mt {
  963. margin-top: 60rpx;
  964. position: relative;
  965. }
  966. .info {
  967. position: absolute;
  968. right: 20rpx;
  969. }
  970. .uni-padding-wrap {
  971. width: 550rpx;
  972. padding: 0 100rpx;
  973. }
  974. .signup {
  975. box-shadow: 0rpx 5rpx 40rpx #ccc;
  976. width: 100%;
  977. position: fixed;
  978. bottom: 0rpx;
  979. display: flex;
  980. height: 90rpx;
  981. padding-top: 2%;
  982. background-color: #FFFFFF;
  983. justify-content: space-around;
  984. }
  985. .signuptext {
  986. text-align: center;
  987. margin-top: 2%;
  988. }
  989. .signuptext p {
  990. font-size: 60%;
  991. color: #333333;
  992. }
  993. .signupbut {
  994. text-align: center;
  995. margin-top: 2%;
  996. }
  997. .but1 {
  998. width: 120%;
  999. text-align: center;
  1000. background-color: #FCCF41;
  1001. border-radius: 10rpx;
  1002. color: #464100;
  1003. font-size: 28rpx;
  1004. line-height: 156%;
  1005. font-weight: 500;
  1006. height: 65%;
  1007. }
  1008. /deep/.uni-searchbar__box {
  1009. border-color: #267CFF !important;
  1010. border-width: 2rpx !important;
  1011. }
  1012. /deep/.uni-searchbar__box {
  1013. background-color: #FFFFFF !important;
  1014. }
  1015. /deep/.uni-searchbar__text-placeholder {
  1016. font-size: 30rpx !important;
  1017. }
  1018. /deep/.segmented-control__text {
  1019. font-size: 34rpx !important;
  1020. }
  1021. /deep/.uni-data-checklist {
  1022. padding-left: 20upx;
  1023. }
  1024. uni-picker {
  1025. position: relative;
  1026. display: block;
  1027. cursor: pointer;
  1028. padding-left: 20rpx !important;
  1029. padding-top: 14rpx !important;
  1030. color: grey !important;
  1031. }
  1032. /deep/.uni-date-x--border {
  1033. border: 0px solid #dcdfe6 !important;
  1034. }
  1035. /deep/.is-input-border {
  1036. border: 0px solid #c8c7cc !important;
  1037. }
  1038. /deep/.uni-progress-info {
  1039. font-size: 25rpx !important;
  1040. }
  1041. /deep/.uni-error-message {
  1042. position: absolute;
  1043. bottom: -20rpx !important;
  1044. left: 20rpx !important;
  1045. text-align: left;
  1046. }
  1047. /deep/.uni-forms-item__inner {
  1048. padding-bottom: 0rpx !important;
  1049. margin-bottom: 30rpx !important;
  1050. border-bottom: 0.5rpx solid #CCCCCC;
  1051. }
  1052. /deep/.uni-group__title {
  1053. background-color: #FFFFFF !important;
  1054. }
  1055. /deep/.uni-list-item__content-title {
  1056. font-size: 30rpx !important;
  1057. color: #111111 !important;
  1058. }
  1059. /deep/.uni-progress-bar {
  1060. border-radius: 10rpx !important;
  1061. }
  1062. /deep/.uni-progress-inner-bar {
  1063. border-radius: 10rpx !important;
  1064. }
  1065. /deep/.is-input-border {
  1066. border-radius: 20px !important;
  1067. background-color: #fff;
  1068. }
  1069. .uni-easyinput__content-input {
  1070. font-size: 30upx !important;
  1071. }
  1072. .content-clear-icon {
  1073. font-size: 40upx !important;
  1074. }
  1075. /deep/.input-box {
  1076. padding: 50upx;
  1077. font-size: 30upx;
  1078. .input-item {
  1079. display: flex;
  1080. border: 1upx solid #F8F8F8;
  1081. line-height: 90upx;
  1082. height: 90upx;
  1083. margin-top: 20upx;
  1084. background: #F8F8F8;
  1085. border-radius: 48upx;
  1086. .input-label {
  1087. width: 150upx;
  1088. text-align: center;
  1089. }
  1090. .input-body {
  1091. position: relative;
  1092. height: 100upx;
  1093. width: calc(100% - 150upx);
  1094. .input {
  1095. line-height: 90upx;
  1096. height: 90upx;
  1097. position: relative;
  1098. font-size: 28upx;
  1099. }
  1100. .eye {
  1101. position: absolute;
  1102. height: 50upx;
  1103. width: 50upx;
  1104. right: 20upx;
  1105. top: 50%;
  1106. transform: translateY(-50%);
  1107. }
  1108. .btn-code {
  1109. position: absolute;
  1110. right: 0upx;
  1111. top: 50%;
  1112. transform: translateY(-50%);
  1113. background: none;
  1114. color: #205592;
  1115. width: 160upx;
  1116. font-size: 24upx;
  1117. box-sizing: border-box;
  1118. text-align: center;
  1119. padding: 0;
  1120. height: 100upx;
  1121. line-height: 100upx;
  1122. }
  1123. }
  1124. }
  1125. .select {
  1126. // padding-top: 40upx;
  1127. display: flex;
  1128. justify-content: space-between;
  1129. color: #003B67;
  1130. }
  1131. }
  1132. /deep/.title-left {
  1133. width: 3px;
  1134. height: 16px;
  1135. background: #267CFF;
  1136. display: inline-block;
  1137. border-radius: 3px;
  1138. margin-top: 3px;
  1139. vertical-align: top;
  1140. margin-right: 10px;
  1141. }
  1142. .card {
  1143. padding: 24rpx;
  1144. margin-top: 30rpx;
  1145. border: 1rpx solid #F0D232;
  1146. background-color: #ffffff;
  1147. margin: 0 10rpx;
  1148. }
  1149. .head {
  1150. padding-top: 5%;
  1151. padding: 0 0 0 1%;
  1152. height: 80rpx;
  1153. margin-top: 2%;
  1154. }
  1155. .head span {
  1156. color: #333333;
  1157. font-size: 80%;
  1158. font-weight: 550;
  1159. text-indent: 2em;
  1160. }
  1161. .head image {
  1162. vertical-align: middle;
  1163. width: 50rpx;
  1164. height: 50rpx;
  1165. display: inline-block;
  1166. padding-right: 14rpx;
  1167. }
  1168. .home-link {
  1169. /deep/.uni-easyinput__content-input {
  1170. background-color: #EBEBEB;
  1171. border-radius: 15rpx;
  1172. }
  1173. }
  1174. .heng-line {
  1175. margin-top: 60rpx;
  1176. margin-bottom: 50rpx;
  1177. border: 1rpx solid #DCDCDC;
  1178. }
  1179. .signupbtn p {
  1180. font-size: 30rpx;
  1181. }
  1182. .exit-btn {
  1183. width: 120%;
  1184. text-align: center;
  1185. background-color: #C0C0C0;
  1186. border-radius: 10rpx;
  1187. color: #FFFFFF;
  1188. font-size: 30rpx;
  1189. line-height: 180%;
  1190. }
  1191. .main-btn {
  1192. width: 300rpx;
  1193. text-align: center;
  1194. background-color: #FCCF41;
  1195. border-radius: 10rpx;
  1196. color: #000000;
  1197. font-size: 30rpx;
  1198. line-height: 180%;
  1199. }
  1200. .uni-input-placeholder {
  1201. font-size: 24rpx !important;
  1202. }
  1203. /deep/.uni-date-x--border {
  1204. border: 0px solid #dcdfe6 !important;
  1205. }
  1206. /deep/.is-input-border {
  1207. border: 0px solid #c8c7cc !important;
  1208. }
  1209. .example {
  1210. padding: 0 15px 15px;
  1211. }
  1212. .example-info {
  1213. padding: 15px;
  1214. color: #3b4144;
  1215. background: #ffffff;
  1216. }
  1217. .example-body {
  1218. /* #ifndef APP-NVUE */
  1219. display: flex;
  1220. /* #endif */
  1221. flex-direction: row;
  1222. flex-wrap: wrap;
  1223. justify-content: center;
  1224. padding: 0;
  1225. font-size: 14px;
  1226. background-color: #ffffff;
  1227. }
  1228. /* #endif */
  1229. .example {
  1230. padding: 0 15px;
  1231. }
  1232. .example-info {
  1233. /* #ifndef APP-NVUE */
  1234. display: block;
  1235. /* #endif */
  1236. padding: 15px;
  1237. color: #3b4144;
  1238. background-color: #ffffff;
  1239. font-size: 14px;
  1240. line-height: 20px;
  1241. }
  1242. .example-info-text {
  1243. font-size: 14px;
  1244. line-height: 20px;
  1245. color: #3b4144;
  1246. }
  1247. .example-body {
  1248. flex-direction: column;
  1249. padding: 15px;
  1250. background-color: #ffffff;
  1251. }
  1252. </style>