form.vue 39 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393
  1. <template name="secondHandrelease">
  2. <view class="fleaMarketForm">
  3. <view class="bannerimg"><image src="https://static.caimei365.com/app/img/bg/secondbg.jpg"></image></view>
  4. <view class="my-maintenance" :style="{ paddingBottom: isIphoneX ? '270rpx' : '250rpx' }">
  5. <view class="newsTitle">
  6. <view class="nestext">
  7. 欢迎您来到采美365网二手商品市场,您可以在这里发布二手设备、产品信息,
  8. 展示期为3个月;为了完整展示您的商品,请您认真填写以下商品基本信息,
  9. 后续采美工作人员将联系您进行承诺书签名,谢谢合作。
  10. </view>
  11. </view>
  12. <view class="row">
  13. <view class="label"><text class="red">*</text>发布身份:</view>
  14. <view class="select spacing">
  15. <picker
  16. @change="bindPickerChangePublisher($event)"
  17. :value="index"
  18. :range="publisherActions"
  19. range-key="name"
  20. >
  21. <input
  22. class="input"
  23. type="text"
  24. disabled="true"
  25. v-model="publisherText"
  26. placeholder="请选择发布身份"
  27. placeholder-class="placeholder"
  28. />
  29. </picker>
  30. </view>
  31. <text class="iconfont icon-xiayibu"></text>
  32. </view>
  33. <view class="row">
  34. <view class="label"><text class="red">*</text>联系人:</view>
  35. <view class="spacing">
  36. <input type="text"
  37. maxlength="15"
  38. v-model="secondParams.contactName"
  39. placeholder="请输入联系人姓名"
  40. placeholder-class="placeholder">
  41. </view>
  42. </view>
  43. <view class="row">
  44. <view class="label"><text class="red">*</text>联系方式:</view>
  45. <view class="spacing">
  46. <input type="text"
  47. v-model="secondParams.contactMobile"
  48. maxlength="11"
  49. placeholder="请输入联系人手机号"
  50. @blur="contactMobileOnblur"
  51. placeholder-class="placeholder">
  52. </view>
  53. </view>
  54. <view class="row">
  55. <view class="label"><text class="red">*</text>验证码:</view>
  56. <view class="spacing">
  57. <input type="text"
  58. v-model="secondParams.checkCode"
  59. maxlength="6"
  60. placeholder="请输入验证码"
  61. placeholder-class="placeholder">
  62. </view>
  63. <view class="row-btn" :class="[isMobileDisabled ? 'disabled' : '']">
  64. <button class="row-input"
  65. type="button"
  66. @click.stop="getMobileCodeFn"
  67. :disabled="isMobileDisabled">
  68. {{ mobileCodeText }}
  69. </button>
  70. </view>
  71. </view>
  72. <view class="row">
  73. <view class="label"><text class="red">*</text>二手分类:</view>
  74. <view class="select spacing">
  75. <picker
  76. @change="bindPickerChange($event)"
  77. :value="index"
  78. :range="categoryActions"
  79. range-key="name"
  80. >
  81. <input
  82. class="input"
  83. type="text"
  84. disabled="true"
  85. v-model="organizationTypeText"
  86. placeholder="请选择分类"
  87. placeholder-class="placeholder"
  88. />
  89. </picker>
  90. </view>
  91. <text class="iconfont icon-xiayibu"></text>
  92. </view>
  93. <view class="row">
  94. <view class="label"><text class="red">*</text>商品品牌:</view>
  95. <view class="select spacing">
  96. <picker
  97. @change="bindPickerChangeBrand($event)"
  98. :value="index"
  99. :range="brandActions"
  100. range-key="name"
  101. >
  102. <input
  103. class="input"
  104. type="text"
  105. disabled="true"
  106. v-model="brandName"
  107. placeholder="请选择品牌"
  108. placeholder-class="placeholder"
  109. />
  110. </picker>
  111. </view>
  112. <text class="iconfont icon-xiayibu"></text>
  113. </view>
  114. <view class="row" v-if="secondParams.brandId==161">
  115. <view class="label">其它品牌:</view>
  116. <view class="spacing">
  117. <input type="text"
  118. maxlength="40"
  119. v-model="secondParams.brandName"
  120. placeholder="请输入商品品牌"
  121. placeholder-class="placeholder">
  122. </view>
  123. </view>
  124. <view class="row">
  125. <view class="label"><text class="red">*</text>商品名称:</view>
  126. <view class="spacing">
  127. <input type="text"
  128. maxlength="40"
  129. v-model="secondParams.name"
  130. placeholder="请输入商品名称,不超过40个汉字"
  131. placeholder-class="placeholder">
  132. </view>
  133. </view>
  134. <view class="row">
  135. <view class="label">出厂日期:</view>
  136. <view class="spacing">
  137. <input type="text"
  138. v-model="secondParams.fixedYears"
  139. maxlength="10"
  140. placeholder="请输入出厂日期 如:2020年06月"
  141. placeholder-class="placeholder">
  142. </view>
  143. </view>
  144. <view class="row" v-if="secondParams.publishIdentity === 2">
  145. <view class="label"><text class="red">*</text>公司名称:</view>
  146. <view class="spacing">
  147. <input type="text"
  148. v-model="secondParams.companyName"
  149. maxlength="30"
  150. placeholder="请输入公司名称,不超过30个汉字"
  151. placeholder-class="placeholder">
  152. </view>
  153. </view>
  154. <view class="row">
  155. <view class="label"><text class="red">*</text>交易价:</view>
  156. <view class="spacing">
  157. <input type="text" maxlength="20" v-model="secondParams.price" placeholder="请输入交易价" placeholder-class="placeholder">
  158. </view>
  159. </view>
  160. <view style="margin-top: 15rpx;">
  161. <text class="iconfont xiangliao"
  162. :class="vShow_detailTalkFlag ? 'icon-jiagexiangliao':'icon-juxingweigouxuan'"
  163. @click="Detailed($event)">
  164. <text class='pricecolor' >价格详聊</text>
  165. </text>
  166. <text class="showflag" v-show="vShow_detailTalkFlag">(勾选代表同意不显示交易价)</text>
  167. </view>
  168. <view class="row">
  169. <view class="label"><text class="red">*</text>商品成色:</view>
  170. <view class="spacing">
  171. <input type="text"
  172. maxlength="10"
  173. v-model="secondParams.productQuality"
  174. placeholder="请输入商品成色,如“9成新”"
  175. placeholder-class="placeholder">
  176. </view>
  177. </view>
  178. <view class="row none">
  179. <view class="label"><text class="red">*</text>商品包含的文件:</view>
  180. </view>
  181. <view class="row none">
  182. <view class="checkbox-main">
  183. <view
  184. class="checkbox-list"
  185. :class="type.isChecked ? 'checked' : ''"
  186. v-for="(type, index) in productFileTypeActions"
  187. :key="index"
  188. @click="choiceProductFileType(type, index)"
  189. >
  190. <text class="iconfont" :class="type.isChecked ? 'icon-yixuanze' : 'icon-weixuanze'"></text>
  191. {{ type.name }}
  192. </view>
  193. </view>
  194. </view>
  195. <view class="row none" v-if="secondParams.publishIdentity === 1">
  196. <view class="label-im"><text class="red">*</text>身份证照片:</view>
  197. <view class="label-em">个人请上传身份证正反面照片(图片大小不超过5M)</view>
  198. <view class="release-input upload image uploadGoodsImages" >
  199. <view class="upload-file-view">
  200. <view class="upload-file" v-if="secondParams.authenticationImage == ''">
  201. <text class="iconfont icon-shangchuantupian"></text>
  202. <text class="add-text">身份证正面</text>
  203. <view ref="goodsImages" class="input-file" @click="uploadCardImageFn(1)"></view>
  204. </view>
  205. <view class="upload-file" v-else>
  206. <image :src="secondParams.authenticationImage" alt="" class="upload-img" ></image>
  207. <text class=" del iconfont icon-iconfontguanbi" @click="removeCardImageFn(1)"></text>
  208. </view>
  209. </view>
  210. <view class="upload-file-view">
  211. <view class="upload-file" v-if="secondParams.authenticationBackImage == ''">
  212. <text class="iconfont icon-shangchuantupian"></text>
  213. <text class="add-text">身份证反面</text>
  214. <view ref="goodsImages" class="input-file" @click="uploadCardImageFn(2)"></view>
  215. </view>
  216. <view class="upload-file" v-else>
  217. <image :src="secondParams.authenticationBackImage" alt="" class="upload-img" ></image>
  218. <text class=" del iconfont icon-iconfontguanbi" @click="removeCardImageFn(2)"></text>
  219. </view>
  220. </view>
  221. </view>
  222. </view>
  223. <view class="row none" v-if="secondParams.publishIdentity === 2">
  224. <view class="label-im"><text class="red">*</text>营业执照:</view>
  225. <view class="label-em">请上传营业执照照片(图片大小不超过5M)</view>
  226. <view class="release-input upload image uploadGoodsImages" >
  227. <view class="upload-file" v-if="secondParams.licenseImage == ''">
  228. <text class="iconfont icon-shangchuantupian"></text>
  229. <text class="add-text">营业执照</text>
  230. <view ref="goodsImages" class="input-file" @click="uploadUserImageFn"></view>
  231. </view>
  232. <view class="upload-file" v-else>
  233. <image :src="secondParams.licenseImage" alt="" class="upload-img" ></image>
  234. <i class=" del iconfont icon-iconfontguanbi" @click="removeUserImageFn"></i>
  235. </view>
  236. </view>
  237. </view>
  238. <view class="row">
  239. <view class="label-im"><text class="red">*</text>收款账号:<text class="sms">(用于接收最终结算金额)</text></view>
  240. <view class="spacing file-none">
  241. <input type="text"
  242. v-model="secondParams.cardNumber"
  243. maxlength="20"
  244. placeholder="请输入收款银行卡卡号"
  245. placeholder-class="placeholder">
  246. </view>
  247. </view>
  248. <view class="row">
  249. <view class="label">采美对接人:</view>
  250. <view class="spacing">
  251. <input type="text"
  252. v-model="secondParams.dockingPeopleName"
  253. maxlength="15"
  254. placeholder="请输入采美对接人姓名"
  255. placeholder-class="placeholder">
  256. </view>
  257. </view>
  258. <view class="row">
  259. <view class="label">对接人联系方式:</view>
  260. <view class="spacing">
  261. <input type="text"
  262. v-model="secondParams.dockingPeopleMobile"
  263. maxlength="11" placeholder="请输入采美对接人手机号"
  264. placeholder-class="placeholder">
  265. </view>
  266. </view>
  267. <view class="row">
  268. <view class="label">商品类型:</view>
  269. <view class="select spacing">
  270. <picker
  271. @change="bindPickerChangeProduct($event)"
  272. :value="index"
  273. :range="productActions"
  274. range-key="name"
  275. >
  276. <input
  277. class="input"
  278. type="text"
  279. disabled="true"
  280. v-model="organizationTypeText1"
  281. placeholder="请选择发布身份"
  282. placeholder-class="placeholder"
  283. />
  284. </picker>
  285. </view>
  286. <text class="iconfont icon-xiayibu"></text>
  287. </view>
  288. <view class="row" >
  289. <view class="label"><text class="red">*</text>联系地址:</view>
  290. <view class="spacing" @click="showMulLinkageThreePicker">
  291. <text class="row-input" :class="addressData.address === '请选择所在地区' ? 'none,placeholder' : ''" >
  292. {{addressData.address}}
  293. </text>
  294. </view>
  295. <text class="iconfont icon-xiayibu"></text>
  296. </view>
  297. <textarea type="text"
  298. class="border-grey address-details"
  299. v-model="secondParams.address"
  300. maxlength="50"
  301. placeholder="请填写详细地址,如街道/小区/门牌等"
  302. placeholder-class="placeholder"/>
  303. </textarea>
  304. <view class="release-main-container">
  305. <view class="release-from">
  306. <view class="label"><text class="red">*</text>商品图片</view>
  307. <view class="release-input upload image uploadGoodsImages" >
  308. <view class="upload-file" v-if="GoodsImagesList.length<5">
  309. <text class="iconfont icon-shangchuantupian"></text>
  310. <p class="add-text">商品图片</p>
  311. <view ref="goodsImages" class="input-file" @click="uploadGoodsImagesFn"></view>
  312. </view>
  313. <view class="upload-file" v-for="(item, index) in GoodsImagesList" :key="index">
  314. <image :data-original='item' :src="item" :data-image="item" alt="" class="upload-img" ></image>
  315. <text class=" del iconfont icon-iconfontguanbi" @click="removeGoodsImagesFn(index)"></text>
  316. </view>
  317. </view>
  318. <view class="form-upload-tips">
  319. <text class="iconfont icon-wenhao" ></text>
  320. <view class="wen-tips" >最多上传5张二手商品图片,请尽量全部上传,单张图片不能超过5M</view>
  321. </view>
  322. </view>
  323. <view class="row">
  324. <view class="label-im">二手出让承诺函签署文件:</view>
  325. <view class="label-em">(仅支持pdf文件,大小不能超过20)</view>
  326. <view class="spacing file-none" v-if="secondParams.fileName == ''">
  327. <view class="file-none-button" @click="uploadCommitmentFile">上传</view>
  328. </view>
  329. <view class="spacing file-text" v-else>
  330. <text class="file-text-em">{{ secondParams.fileName }}</text>
  331. <text class=" del iconfont icon-iconfontguanbi" @click="deleteCommitmentFile"></text>
  332. </view>
  333. </view>
  334. <view class="row none">
  335. <view class="label-im">二手出让承诺函签署图片</view>
  336. <view class="label-em">(若不方便上传承诺函签署文件,可对已签署的承诺函进行拍照或者截图再上传图片)</view>
  337. <view class="label-em">图片大小不超过5M</view>
  338. <view class="release-input upload image uploadGoodsImages" >
  339. <view class="upload-file" v-if="secondParams.commitmentImage == ''">
  340. <i class="iconfont icon-shangchuantupian"></i>
  341. <text class="add-text">承诺函图片</text>
  342. <view ref="goodsImages" class="input-file" @click="uploadCommitmentImageFn"></view>
  343. </view>
  344. <view class="upload-file" v-else>
  345. <image :src="secondParams.commitmentImage" alt="" class="upload-img" ></image>
  346. <i class=" del iconfont icon-iconfontguanbi" @click="removeCommitmentImageFn"></i>
  347. </view>
  348. </view>
  349. </view>
  350. <view class="productinfo">
  351. <view class="label unlogin-label" style="width: 100%;">商品详细信息</view>
  352. <view class="textarea-wrapper">
  353. <textarea class="textarea"
  354. type="text"
  355. v-model="secondParams.productDetails"
  356. placeholder="请填写商品详细信息,对商品进行更详细的描述"
  357. placeholder-class="placeholder"
  358. maxlength="200"
  359. @input="onTextareaInputInfo"
  360. />
  361. <span class="word-limit">{{secondParams.productDetails.length}}/200</span>
  362. </view>
  363. </view>
  364. </view>
  365. </view>
  366. <view class="secondBj thebj" v-show="modal1" :class="modal1 ? 'show':''">
  367. <view class="bjmain theresult">
  368. <text class="title">发布提示</text>
  369. <text class="content"> {{ tipsContentText }} </text>
  370. <view class="paybtn">
  371. <view class="btn cancel" @click.stop="cancelButtonFn">{{ cancelButtonText }}</view>
  372. <view class="btn confirm" @click.stop="confirmButtonFn">{{ confirmButtonText }}</view>
  373. </view>
  374. </view>
  375. </view>
  376. <!-- 地址弹窗 -->
  377. <mpvue-city-picker :themeColor="themeColor"
  378. ref="mpvueCityPicker"
  379. :pickerValueDefault="cityPickerValueDefault"
  380. @onCancel="onCancel"
  381. @onConfirm="onConfirm">
  382. </mpvue-city-picker>
  383. <!-- 发布按钮 -->
  384. <tui-bottom-popup :radius="false" :mask="false" :show="popupShow">
  385. <view class="tui-popup-box clearfix">
  386. <view class="tui-right-flex tui-popup-btn" :style="{ paddingBottom: isIphoneX ? '68rpx' : '34rpx' }">
  387. <view class="tui-flex-1">
  388. <view class="tui-button-text" @click="handleChangAgree">
  389. <text class="iconfont"
  390. :class="checkbox ? 'icon-yixuanze':'icon-weixuanze'" >
  391. </text>
  392. 已阅读并同意采美
  393. <text style="color:#1890f9;" @click.stop="this.$api.navigateTo('/pages/service/service?id=1039&title=二手出让协议')">《二手出让协议》</text>
  394. </view>
  395. </view>
  396. <view class="tui-flex-1">
  397. <view class="tui-button" @click="handleSubmitBtn">发布</view>
  398. </view>
  399. </view>
  400. </view>
  401. </tui-bottom-popup>
  402. <!-- 弹窗提示 -->
  403. <tui-modal :show="modal" :padding="'40rpx 30rpx'" @cancel="hideMobel" :custom="true" fadeIn >
  404. <view class="tui-modal-custom">
  405. <view class="tui-prompt-text">
  406. {{ contentModalText }}
  407. </view>
  408. <view class="tui-prompt-flex">
  409. <view class="btn btn-confirm" @click="handleClick">确定</view>
  410. </view>
  411. </view>
  412. </tui-modal>
  413. </view>
  414. </template>
  415. <script>
  416. import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue'
  417. import { uploadFileImage , uploadFilePdf } from '@/services/public.js'
  418. import authorize from '@/common/config/authorize.js'
  419. import $reg from '@/common/config/common.js'
  420. import { mapState,mapMutations } from 'vuex'
  421. export default{
  422. name:'secondHandrelease',
  423. components:{
  424. mpvueCityPicker,
  425. },
  426. data(){
  427. return{
  428. isIphoneX: this.$store.state.isIphoneX,
  429. popupShow:true,
  430. userIdentity:0,
  431. publisherText:'个人身份',
  432. organizationTypeText:'请选择二手分类',
  433. organizationTypeText1:'请选择商品类型',
  434. brandActions:[],
  435. publisherActions:[
  436. {name:'个人身份',value:1},
  437. {name:'公司身份',value:2},
  438. ],
  439. categoryActions:[
  440. {name:'二手仪器',value:1},
  441. {name:'其他',value:3},
  442. ],
  443. productActions:[
  444. {name:'医美',value:1},
  445. {name:'非医美',value:3},
  446. ],
  447. productFileTypeActions:[
  448. { name:'仪器原始合同',value:1,isChecked:false},
  449. { name:'仪器注册证',value:2,isChecked:false},
  450. { name:'仪器发票',value:3,isChecked:false},
  451. { name:'仪器报关单',value:4,isChecked:false},
  452. { name:'无任何文件',value:5,isChecked:false}
  453. ],
  454. GoodsImagesList:[],
  455. secondParams:{
  456. publishIdentity:1, // 发布者身份 1 个人身份 2 公司身份
  457. secondHandType:'',//一级分类
  458. instrumentType:1,//二手仪器分类
  459. name:'',
  460. brandId:'',//品牌ID
  461. brandName:'',//其他品牌
  462. fixedYears:'',//出厂
  463. companyName:'',//公司名称
  464. maturityYears:'',//产品到期
  465. price:'',//交易价
  466. detailTalkFlag:1,//是否启用详聊
  467. normalPrice:'',//市场价
  468. originalPrice:'',//采购价
  469. stock:'',//数量
  470. productQuality:'',//商品成色
  471. fileType:'', // 商品文件类型
  472. contactName:'',//联系人
  473. contactMobile:'',//联系方式
  474. checkCode:'',// 联系人手机验证码
  475. cardNumber:'',// 收款账号
  476. authenticationImage:'', //身份证正面
  477. authenticationBackImage:'', //身份证反面
  478. licenseImage:'',//营业执照图片
  479. commitmentImage:'',//承诺函图片
  480. dockingPeopleName:'',//采美对接人姓名
  481. dockingPeopleMobile:'',//采美对接人手机号
  482. secondProductType:'',//
  483. townId:'',//县区地址
  484. address:'',//详细地址
  485. image:'',//图片
  486. fileName:'',
  487. ossName:'',
  488. productDetails:'',//商品详细信息
  489. source:2//二手发布来源.1:WWW,2:小程序,3:后台,4:协销
  490. },
  491. checkedFileTypeList:[],
  492. addressData:{
  493. address:'请选择所在地区',
  494. townID:'', //区ID
  495. cityID:'', //区ID
  496. provinceID:'', //区ID
  497. addressDetail: '', //地址
  498. },
  499. brandName:'请选择品牌名称',
  500. checkbox:false,
  501. tipsContentText:'',
  502. cancelButtonText:'取消发布',
  503. confirmButtonText:'去支付',
  504. contentModalText:'发布成功!商品信息会在1-2个工作日内进行审核,审核通过后将立即上线到采美二手市场',
  505. isButtonsType:0,
  506. vShow_detailTalkFlag:false,
  507. modal:false,
  508. modal1:false,
  509. isMobileDisabled: true, //手机验证码按钮控制
  510. mobilCount: '', //倒计时
  511. mobileCodeText: '获取验证码',
  512. mobilTime: null,
  513. }
  514. },
  515. methods:{
  516. onTextareaInputInfo(e){
  517. this.secondParams.productDetails = e.detail.value
  518. },
  519. showMulLinkageThreePicker() {//三级地址联动
  520. this.isShowInput = true
  521. this.$refs.mpvueCityPicker.show()
  522. },
  523. onConfirm(e) {//获取选择的地址信息
  524. this.addressData.address = e.name
  525. this.addressData.townID = e.townCode
  526. this.addressData.cityID = e.cityCode
  527. this.addressData.provinceID = e.provinceCode
  528. this.secondParams.townId = this.addressData.townID
  529. },
  530. bindPickerChangePublisher(e) {// 选择发布者身份
  531. this.publisherText = this.publisherActions[e.target.value].name
  532. this.secondParams.publishIdentity = this.publisherActions[e.target.value].value
  533. },
  534. bindPickerChange(e) {// 选择二手分类
  535. this.secondParams.secondHandType = this.categoryActions[e.target.value].value
  536. if(this.secondParams.secondHandType === 1){
  537. this.organizationTypeText = '二手仪器-美容仪器'
  538. }else{
  539. this.organizationTypeText = this.categoryActions[e.target.value].name
  540. }
  541. },
  542. bindPickerChangeBrand(e) {
  543. // 选择品牌
  544. this.brandName = this.brandActions[e.target.value].name
  545. this.secondParams.brandId = this.brandActions[e.target.value].value
  546. },
  547. bindPickerChangeProduct(e) {
  548. // 选择商品类型
  549. this.organizationTypeText1 = this.productActions[e.target.value].name
  550. this.secondParams.secondProductType = this.productActions[e.target.value].value
  551. },
  552. choiceProductFileType(type,index){
  553. // 选择类别
  554. type.isChecked = !type.isChecked
  555. if (type.isChecked) {
  556. if(!this.contains(this.checkedFileTypeList,type.value)){
  557. this.checkedFileTypeList.push(type.value)
  558. }
  559. } else {
  560. this.checkedFileTypeList.splice(this.checkedFileTypeList.indexOf(type.value),1)
  561. }
  562. this.secondParams.fileType = this.checkedFileTypeList.join(',')
  563. },
  564. contains(arr, val) {// 校验
  565. return arr.some(item => item === val)
  566. },
  567. Detailed(){
  568. this.vShow_detailTalkFlag = !this.vShow_detailTalkFlag
  569. if(this.vShow_detailTalkFlag){
  570. this.secondParams.detailTalkFlag = 2 //启用价格详聊
  571. }else {
  572. this.secondParams.detailTalkFlag = 1 //不启用价格详聊
  573. }
  574. },
  575. uploadGoodsImagesFn(event){//上传商品图片
  576. uploadFileImage().then(res =>{
  577. this.GoodsImagesList.push(JSON.parse(res.data).data)
  578. this.secondParams.image =this.GoodsImagesList.toString()+','
  579. })
  580. },
  581. uploadCardImageFn(type){//上传身份正反面照
  582. uploadFileImage().then(res =>{
  583. if(type == 1){
  584. this.secondParams.authenticationImage = JSON.parse(res.data).data
  585. }else{
  586. this.secondParams.authenticationBackImage = JSON.parse(res.data).data
  587. }
  588. })
  589. },
  590. uploadUserImageFn(event){//上传营业执照图片
  591. console.log('event')
  592. uploadFileImage().then(res =>{
  593. this.secondParams.licenseImage = JSON.parse(res.data).data
  594. })
  595. },
  596. uploadCommitmentImageFn(event){//上传承诺函图片
  597. uploadFileImage().then(res =>{
  598. this.secondParams.commitmentImage = JSON.parse(res.data).data
  599. })
  600. },
  601. uploadCommitmentFile(){//上传承诺函文件
  602. uploadFilePdf().then(res =>{
  603. let data = JSON.parse(res.data).data
  604. this.secondParams.fileName = uni.getStorageSync('fileName')
  605. this.secondParams.ossName = data.ossName
  606. console.log('fileName',this.secondParams.fileName)
  607. console.log('ossName',this.secondParams.ossName)
  608. })
  609. },
  610. deleteCommitmentFile(){//删除承诺函文件
  611. this.secondParams.fileName = ''
  612. },
  613. removeGoodsImagesFn(index){//删除商品图片
  614. this.GoodsImagesList.splice(index,1)
  615. this.secondParams.image =this.GoodsImagesList.toString()+','
  616. },
  617. removeCardImageFn(type){//删除身份证图片
  618. if(type == 1){
  619. this.secondParams.authenticationImage = ''
  620. }else{
  621. this.secondParams.authenticationBackImage = ''
  622. }
  623. },
  624. removeUserImageFn(index){//删除公司营业执照图片
  625. this.secondParams.licenseImage = ''
  626. },
  627. removeCommitmentImageFn(index){//删除承诺函图片
  628. this.secondParams.commitmentImage = ''
  629. },
  630. contactMobileOnblur(e){// 识别手机号是否正确
  631. if(this.$reg.isMobile(e.detail.value)){
  632. this.isMobileDisabled = false
  633. }
  634. },
  635. getMobileCodeFn(){
  636. let params = {
  637. mobile:this.secondParams.contactMobile,
  638. isCheckCaptcha:1,
  639. activateCodeType:6,
  640. platformType:2
  641. }
  642. this.isMobileDisabled = true
  643. this.PublicService.GetRegisterMobileCode(params).then(response =>{
  644. this.$util.msg('验证短信已发送',2000)
  645. const TIME_COUNT = 60
  646. if (!this.mobilTime) {
  647. this.mobilCount = TIME_COUNT
  648. this.isMobileDisabled = true
  649. this.mobilTime = setInterval(() => {
  650. if (this.mobilCount > 1 && this.mobilCount <= TIME_COUNT) {
  651. this.mobilCount--
  652. this.mobileCodeText = this.mobilCount +'s重新发送'
  653. } else {
  654. this.isMobileDisabled = false
  655. clearInterval(this.mobilTime)
  656. this.mobilTime = null
  657. this.mobileCodeText = '获取验证码'
  658. }
  659. },1000)
  660. }
  661. }).catch( error =>{
  662. this.$util.msg(error.msg,2000)
  663. this.isMobileDisabled = false
  664. })
  665. },
  666. handleSubmitBtn () {
  667. if(this.secondParams.contactName == ''){
  668. this.$util.msg('请输入联系人姓名',2000)
  669. return
  670. }
  671. if(this.secondParams.contactMobile == ''){
  672. console.log(this.secondParams.contactMobile)
  673. this.$util.msg('请输入联系方式',2000)
  674. return
  675. }
  676. if(!$reg.isMobile(this.secondParams.contactMobile)){
  677. this.$util.msg('请填写正确的手机号',2000)
  678. return
  679. }
  680. if(this.secondParams.checkCode == ''){
  681. this.$util.msg('请输入短信验证码',2000)
  682. return
  683. }
  684. if(this.secondParams.secondHandType == ''){
  685. this.$util.msg('请选择分类',2000)
  686. return
  687. }
  688. if(this.secondParams.secondHandType == 1 ){
  689. if(this.secondParams.instrumentType ==''){
  690. this.$util.msg('请完善仪器分类',2000)
  691. return
  692. }
  693. }
  694. if(this.secondParams.brandId == ''){
  695. this.$util.msg('请选择商品品牌',2000)
  696. return
  697. }
  698. if(this.secondParams.name == ''){
  699. this.$util.msg('请输入商品名称',2000)
  700. return
  701. }
  702. if(this.secondParams.publishIdentity === 2) {
  703. if (this.secondParams.companyName=='') {
  704. this.$util.msg('请输入公司名称',2000)
  705. return
  706. }
  707. }
  708. if(!this.$api.isNumber(this.secondParams.price)){
  709. this.$util.msg('请输入交易价',2000)
  710. return
  711. }
  712. if(this.secondParams.productQuality == ''){
  713. this.$util.msg('请输入商品成色',2000)
  714. return
  715. }
  716. if(this.secondParams.fileType == ''){
  717. this.$util.msg('请选择商品包含的文件',2000)
  718. return
  719. }
  720. if(this.secondParams.cardNumber == ''){
  721. this.$util.msg('请输入收款银行卡卡号',2000)
  722. return
  723. }
  724. if(this.userIdentity === 1){
  725. if(this.secondParams.dockingPeopleName == ''){
  726. this.$util.msg('请输入采美对接人姓名',2000)
  727. return
  728. }
  729. if(this.secondParams.dockingPeopleMobile == ''){
  730. this.$util.msg('请输入采美对接人手机号',2000)
  731. return
  732. }
  733. }
  734. if(this.secondParams.dockingPeopleMobile !=''){
  735. if(!$reg.isMobile(this.secondParams.dockingPeopleMobile)){
  736. this.$util.msg('请填写正确的采美对接人手机号',2000)
  737. return
  738. }
  739. }
  740. if(this.secondParams.townId == ''|| this.secondParams.townId == undefined){
  741. this.$util.msg('请完善联系地址',2000)
  742. return
  743. }
  744. if(this.secondParams.address == ''){
  745. this.$util.msg('请填写详细地址',2000)
  746. return
  747. }
  748. if(this.GoodsImagesList ==''){
  749. this.$util.msg('请上传商品图片',2000)
  750. return
  751. }
  752. if(this.checkbox==false){
  753. this.$util.msg('请勾选已阅读',2000)
  754. return
  755. }
  756. if(this.secondParams.publishIdentity === 1){
  757. if(this.secondParams.authenticationImage == '' && this.secondParams.authenticationBackImage == ''){
  758. this.modal1 = true
  759. this.tipsContentText = '上传身份证照片,您的二手商品将获得更好的推荐和曝光,方便您快速卖出。'
  760. this.cancelButtonText = '继续发布'
  761. this.confirmButtonText = '去上传'
  762. this.isButtonsType = 1
  763. return
  764. }
  765. }else{
  766. if(this.secondParams.licenseImage == ''){
  767. this.modal1 = true
  768. this.tipsContentText = '上传营业执照照片,您的二手商品将获得更好的推荐和曝光,方便您快速卖出。'
  769. this.cancelButtonText = '继续发布'
  770. this.confirmButtonText = '去上传'
  771. this.isButtonsType = 1
  772. return
  773. }
  774. }
  775. if(this.secondParams.commitmentImage == '' || this.secondParams.ossName == ''){
  776. this.modal1 = true
  777. this.tipsContentText = '上传二手出让承诺函,您的二手商品将获得更好的推荐和曝光,方便您快速卖出。'
  778. this.cancelButtonText = '继续发布'
  779. this.confirmButtonText = '去上传'
  780. this.isButtonsType = 1
  781. return
  782. }
  783. console.log(this.secondParams)
  784. },
  785. SecondHandProduct(params){//提交发布
  786. this.SecondService.SecondHandProduct(params).then(res=>{
  787. this.modal = true
  788. })
  789. .catch(error =>{
  790. this.$util.msg(error.msg,2000)
  791. })
  792. },
  793. cancelButtonFn(){//弹窗操作按钮
  794. switch(this.isButtonsType){
  795. case 1:
  796. this.modal1 = false
  797. this.SecondHandProduct(this.secondParams)
  798. break
  799. case 2:
  800. this.modal1 = false
  801. break
  802. }
  803. },
  804. confirmButtonFn(){//弹窗操作按钮
  805. switch(this.isButtonsType){
  806. case 1:
  807. this.modal1 = false
  808. break
  809. case 2:
  810. this.modal1 = false
  811. break
  812. }
  813. },
  814. handleChangAgree() {
  815. this.checkbox = !this.checkbox
  816. },
  817. getBrandList() {
  818. // 获取收款类型列表
  819. this.SecondService.brandList()
  820. .then(response => {
  821. this.brandActions = response.data.map(item => ({
  822. ...item,
  823. name: item.name,
  824. value: item.id
  825. }))
  826. })
  827. .catch(err => {
  828. this.$util.msg(err.msg, 2000)
  829. })
  830. },
  831. hideMobel(){
  832. this.modal = false
  833. },
  834. handleClick(){
  835. this.modal = false
  836. this.$api.redirectTo ('/pages/second/product/product-list')
  837. }
  838. },
  839. onShow() {
  840. this.getBrandList()
  841. this.$api.getComStorage('userInfo').then((resolve) =>{
  842. this.userIdentity = resolve.userIdentity
  843. console.log(this.userIdentity)
  844. }).catch(error =>{
  845. console.log(error)
  846. })
  847. }
  848. }
  849. </script>
  850. <style lang="scss">
  851. view{font-size: 28rpx;}
  852. .my-maintenance{
  853. padding: 20rpx;
  854. }
  855. .bannerimg {
  856. height: 66rpx;
  857. width: 100%;
  858. }
  859. .bannerimg image{
  860. width: 100%;
  861. height: 100% ;
  862. }
  863. .newsTitle {
  864. line-height: 48rpx;
  865. text-align: left;
  866. color: #e15616;
  867. padding:20rpx;
  868. background-color: rgba(225, 86, 22, .1);
  869. border-radius: 10rpx;
  870. }
  871. .nestext{
  872. font-size: 24rpx;
  873. line-height: 40rpx;
  874. }
  875. .secondradio view{
  876. display: inline-block;
  877. color: #333333;
  878. margin-right: 21rpx;
  879. }
  880. .secondradio{
  881. display: inline-block;
  882. margin-left: 40rpx;
  883. }
  884. .Secondary{
  885. margin-left: 96rpx;
  886. }
  887. .secondradio view.active {
  888. color: #e15616;
  889. }
  890. .placeholder{
  891. color: #b2b2b2;
  892. }
  893. .linqi_text {
  894. width: 607rpx;
  895. height: 68rpx;
  896. background-color: #1890f9;
  897. box-shadow: 0rpx 4rpx 6rpx 0rpx rgba(24, 144, 249, 0.17);
  898. text-align: center;
  899. line-height: 68rpx;
  900. color: #ffffff;
  901. margin: auto;
  902. font-size:24rpx;
  903. position: relative;
  904. }
  905. .jiaobiao {
  906. width: 0;
  907. height: 0;
  908. border-left: 20rpx solid transparent;
  909. border-right: 20rpx solid transparent;
  910. top: -25%;
  911. right: 40%;
  912. border-bottom: 20rpx solid #1890f9;
  913. position: absolute;
  914. }
  915. .label{
  916. color: #666666;
  917. display: inline-block;
  918. .red{
  919. color: #f94b4b;
  920. }
  921. }
  922. .label-im{
  923. width: 100%;
  924. line-height: 50rpx;
  925. font-size: $font-size-28;
  926. color: #666666;
  927. text-align: left;
  928. margin-top: 20rpx;
  929. .red{
  930. color: #f94b4b;
  931. }
  932. .sms{
  933. font-size: $font-size-24;
  934. color: #fea785;
  935. }
  936. }
  937. .label-em{
  938. line-height: 28rpx;
  939. font-size: $font-size-20;
  940. color: #fea785;
  941. width: 100%;
  942. text-align: left;
  943. }
  944. .label.second{
  945. width: 155rpx;
  946. }
  947. .row .spacing.second{
  948. width: 70%;
  949. }
  950. .row{
  951. width: 100%;
  952. border-bottom: 2rpx solid #e1e1e1;
  953. line-height: 90rpx;
  954. float: left;
  955. height: auto;
  956. position: relative;
  957. .checkbox-main{
  958. width: 100%;
  959. .checkbox-list {
  960. height: 60rpx;
  961. font-size: $font-size-28;
  962. line-height: 60rpx;
  963. border-radius: 10rpx;
  964. margin-right: 20rpx;
  965. margin-bottom: 10rpx;
  966. box-sizing: border-box;
  967. float: left;
  968. color: #333333;
  969. .icon-yixuanze{
  970. margin-right: 10rpx;
  971. color: #E15616;
  972. }
  973. .icon-weixuanze{
  974. margin-right: 10rpx;
  975. color: #B2B2B2;
  976. }
  977. }
  978. }
  979. .row-btn{
  980. width: 180rpx;
  981. height:64rpx;
  982. background: $btn-confirm;
  983. padding: 0;
  984. border-radius: 32rpx;
  985. position: absolute;
  986. right: 0;
  987. top: 10rpx;
  988. .row-input{
  989. width: 180rpx;
  990. height: 64rpx;
  991. line-height: 64rpx;
  992. padding: 0;
  993. color: #FFFFFF;
  994. background: $btn-confirm;
  995. text-align: center;
  996. border-radius: 32rpx;
  997. &.other{
  998. width: 180rpx;
  999. background: #F7F7F7;
  1000. margin-right: 20rpx;
  1001. }
  1002. &.none{
  1003. background: #F7F7F7;
  1004. }
  1005. }
  1006. &.disabled{
  1007. background: #F7F7F7;
  1008. .row-input{
  1009. background: #F7F7F7;
  1010. color: #999999;
  1011. font-size: 24rpx;
  1012. }
  1013. }
  1014. }
  1015. &.none{
  1016. border-bottom: none;
  1017. }
  1018. }
  1019. .row.fenlei{
  1020. height: auto;
  1021. margin: 10rpx 0;
  1022. border: 0;
  1023. }
  1024. .select {
  1025. position: relative;
  1026. color: #b2b2b2;
  1027. text-align: left;
  1028. user-select: none;
  1029. }
  1030. .row .spacing{
  1031. display: inline-block;
  1032. margin-left: 50rpx;
  1033. width: 430rpx;
  1034. vertical-align:middle;
  1035. position: relative;
  1036. color: #333333;
  1037. .input{
  1038. color: #333333;
  1039. }
  1040. &.file{
  1041. width: 100%;
  1042. }
  1043. &.file-text{
  1044. width: 100%;
  1045. line-height: 44rpx;
  1046. font-size: 28rpx;
  1047. box-sizing: border-box;
  1048. margin-left: 0;
  1049. .file-text-em{
  1050. width: 100%;
  1051. text-overflow: ellipsis;
  1052. overflow: hidden;
  1053. display: -webkit-box;
  1054. -webkit-line-clamp: 1;
  1055. line-clamp: 1;
  1056. -webkit-box-orient: vertical;
  1057. line-height: 44rpx;
  1058. font-size: 28rpx;
  1059. padding-right: 40rpx;
  1060. box-sizing: border-box;
  1061. position: relative;
  1062. }
  1063. .icon-iconfontguanbi{
  1064. width: 40rpx;
  1065. height: 40rpx;
  1066. line-height: 40rpx;
  1067. display: block;
  1068. position: absolute;
  1069. top: 0;
  1070. right:0;
  1071. color: #f94b4b;
  1072. font-size: 36rpx;
  1073. }
  1074. }
  1075. &.file-none{
  1076. width: 100%;
  1077. margin-left: 0;
  1078. position: relative;
  1079. .file-none-button{
  1080. width: 88rpx;
  1081. height: 44rpx;
  1082. background-color: #e15616;
  1083. border-radius: 8rpx;
  1084. line-height: 44rpx;
  1085. text-align: center;
  1086. font-size: 24rpx;
  1087. color: #FFFFFF;
  1088. position: absolute;
  1089. right: 0;
  1090. top: -15rpx;
  1091. }
  1092. }
  1093. }
  1094. .select .placeholder {
  1095. position: relative;
  1096. cursor: pointer;
  1097. width: 100%;
  1098. display: inline-block;
  1099. }
  1100. .icon-xiayibu{
  1101. right: 0rpx;
  1102. color: #b2b2b2;
  1103. position: absolute;
  1104. }
  1105. .xiangliao{
  1106. font-size: 26rpx;
  1107. margin-right: 10rpx;
  1108. color: #b2b2b2;
  1109. }
  1110. .icon-jiagexiangliao{
  1111. color: #e15616 !important;
  1112. }
  1113. .pricecolor{
  1114. margin-left: 10rpx;
  1115. }
  1116. .showflag{
  1117. color: #b2b2b2;
  1118. }
  1119. .border-grey{
  1120. width: 100%;
  1121. resize: none;
  1122. padding: 20rpx 0;
  1123. height: 160rpx;
  1124. border-bottom: 2rpx solid #e1e1e1;
  1125. }
  1126. .release-main-container {
  1127. overflow: hidden;
  1128. margin: 20rpx 0;
  1129. }
  1130. .uploadGoodsImages{
  1131. display: flex;
  1132. overflow-x: auto;
  1133. overflow-y: hidden;
  1134. }
  1135. .secondradio{
  1136. .row-radio{
  1137. transform: scale(.8);
  1138. }
  1139. .row-input{margin-right: 10rpx;}
  1140. }
  1141. .linqi_text .p{
  1142. font-size: $font-size-20;
  1143. }
  1144. .upload-file {
  1145. float: left;
  1146. margin: 20rpx 20rpx 20rpx 0px;
  1147. cursor: pointer;
  1148. width: 194rpx;
  1149. height: 194rpx;
  1150. border-radius: 6rpx;
  1151. border: solid 2rpx #e1e1e1;
  1152. flex-shrink: 0;
  1153. position: relative;
  1154. display: inline-block;
  1155. .input-file {
  1156. width: 194rpx;
  1157. height: 194rpx;
  1158. opacity: 0;
  1159. cursor: pointer;
  1160. position: absolute;
  1161. top: 0;
  1162. left: 0;
  1163. }
  1164. .upload-img {
  1165. width: 100%;
  1166. height: 100%;
  1167. display: block;
  1168. border-radius: .53vw;
  1169. }
  1170. .icon-shangchuantupian{
  1171. display: block;
  1172. width: 100%;
  1173. height: 100rpx;
  1174. line-height: 90rpx;
  1175. color: #b2b2b2;
  1176. font-size: $font-size-40;
  1177. text-align: center;
  1178. padding-top: 20rpx;
  1179. box-sizing: border-box;
  1180. }
  1181. .add-text {
  1182. display: block;
  1183. width: 100%;
  1184. line-height: 50rpx;
  1185. font-size: 24rpx;
  1186. color: #b2b2b2;
  1187. text-align: center;
  1188. }
  1189. .icon-iconfontguanbi{
  1190. width: 40rpx;
  1191. height: 40rpx;
  1192. line-height: 40rpx;
  1193. display: block;
  1194. position: absolute;
  1195. background: #f94b4b;
  1196. text-align: center;
  1197. line-height: 40rpx;
  1198. border-radius: 50%;
  1199. top: -15rpx;
  1200. right:-18rpx;
  1201. color: #FFFFFF;
  1202. font-size: $font-size-24;
  1203. }
  1204. }
  1205. .wen-tips {
  1206. width: 664rpx;
  1207. height: 68rpx;
  1208. line-height: 68rpx;
  1209. text-align: center;
  1210. color: #FFF;
  1211. font-size: 20rpx;
  1212. background-color: #1890f9;
  1213. box-shadow: 0 0.8vw 1.6vw 0 rgba(24, 144, 249, 0.17);
  1214. border-radius: 2rpx;
  1215. display: none;
  1216. }
  1217. .form-upload-tips:hover .wen-tips {
  1218. display: block;
  1219. }
  1220. .textarea-wrapper {
  1221. letter-spacing: 2rpx;
  1222. line-height: 48rpx;
  1223. color: #333333;
  1224. position: relative;
  1225. font-size: 28rpx;
  1226. border: 2rpx solid #E1E1E1;
  1227. height: 300rpx;
  1228. padding: 16rpx;
  1229. border-radius: 6rpx;
  1230. margin: 20rpx 0;
  1231. }
  1232. .textarea-wrapper textarea{
  1233. width: 100%;
  1234. }
  1235. .word-limit {
  1236. position: absolute;
  1237. right: 2.7vw;
  1238. bottom: 2.7vw;
  1239. font-size: 3.2vw;
  1240. color: #9aa5b5;
  1241. }
  1242. .row.Read{
  1243. border: 0;
  1244. text-align: center;
  1245. color: #999999;
  1246. }
  1247. .thebj {
  1248. position: fixed;
  1249. left: 0;
  1250. top: 0;
  1251. bottom: 0;
  1252. width: 100%;
  1253. height: 100%;
  1254. background-color: rgba(0, 0, 0, .5);
  1255. z-index: 999999;
  1256. opacity: 0;
  1257. }
  1258. .thebj.show{
  1259. opacity: 1;
  1260. }
  1261. .theresult {
  1262. position: absolute;
  1263. top: 50%;
  1264. left: 50%;
  1265. transform: translate(-50%, -50%);
  1266. width:580rpx;
  1267. background-color: #fff;
  1268. border-radius: 32rpx;
  1269. }
  1270. .theresult .title{
  1271. line-height: 100rpx;
  1272. text-align: center;
  1273. display: block;
  1274. color: #333333;
  1275. font-size: 30rpx;
  1276. font-weight: bold;
  1277. border-bottom: 2rpx solid #efefef;
  1278. }
  1279. .theresult .content{
  1280. padding: 30rpx 52rpx;
  1281. line-height: 48rpx;
  1282. color: #666666;
  1283. font-size: 30rpx;
  1284. display: block;
  1285. }
  1286. .paybtn{
  1287. width: 100%;
  1288. height: 90rpx;
  1289. float: left;
  1290. .btn{
  1291. width: 50%;
  1292. height: 90rpx;
  1293. text-align: center;
  1294. line-height: 90rpx;
  1295. font-size: 30rpx;
  1296. display: inline-block;
  1297. float: left;
  1298. &.cancel{
  1299. background-color: #efefef;
  1300. border-radius: 0rpx 0rpx 0rpx 32rpx;
  1301. color: #999999;
  1302. }
  1303. &.confirm{
  1304. background-image: linear-gradient(270deg, #f28f31 0%, #e15616 100%);
  1305. border-radius: 0rpx 0rpx 32rpx 0rpx;
  1306. color: #fff;
  1307. }
  1308. }
  1309. }
  1310. .icon-wenhao{
  1311. color: #1890f9;
  1312. font-size: 35rpx;
  1313. width: 50rpx;
  1314. }
  1315. .form-upload-tips:hover .wen-tips {display: block;}
  1316. .tui-popup-box {
  1317. position: relative;
  1318. box-sizing: border-box;
  1319. min-height: 100rpx;
  1320. padding: 6rpx 24rpx;
  1321. .tui-popup-content {
  1322. padding-top: 30rpx;
  1323. }
  1324. }
  1325. .tui-popup-btn {
  1326. width: 100%;
  1327. height: auto;
  1328. float: left;
  1329. box-sizing: border-box;
  1330. margin-top: 30rpx;
  1331. .tui-button {
  1332. width: 600rpx;
  1333. height: 88rpx;
  1334. background: $btn-confirm;
  1335. line-height: 88rpx;
  1336. text-align: center;
  1337. color: #ffffff;
  1338. font-size: $font-size-28;
  1339. border-radius: 44rpx;
  1340. margin: 0 auto;
  1341. }
  1342. .tui-button-text{
  1343. width: 600rpx;
  1344. height: 70rpx;
  1345. line-height: 70rpx;
  1346. text-align: center;
  1347. color: #333333;
  1348. font-size: $font-size-26;
  1349. margin: 0 auto;
  1350. margin-top: 15rpx;
  1351. .iconfont{
  1352. margin-right: 10rpx;
  1353. &.icon-yixuanze{
  1354. color: $color-system;
  1355. }
  1356. }
  1357. }
  1358. }
  1359. .tui-prompt-flex{
  1360. width: 100%;
  1361. height: 80rpx;
  1362. display: flex;
  1363. margin-top: 20rpx;
  1364. .btn{
  1365. flex: 1;
  1366. line-height: 80rpx;
  1367. font-size: $font-size-26;
  1368. text-align: center;
  1369. color: #FFFFFF;
  1370. border-radius: 40rpx;
  1371. margin: 0 24rpx;
  1372. &.btn-cancel{
  1373. background: #F7F7F7;
  1374. color: #999999;
  1375. }
  1376. &.btn-confirm{
  1377. background: $btn-confirm;
  1378. }
  1379. }
  1380. }
  1381. .tui-prompt-text{
  1382. line-height: 44rpx;
  1383. font-size: $font-size-26;
  1384. color: #333333;
  1385. .text{
  1386. color: $color-system;
  1387. }
  1388. }
  1389. </style>