form.vue 33 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127
  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" >
  5. <view class="newsTitle">
  6. <view class="nestext">欢迎您来到采美365网二手商品市场,您可以在这里发布二手设备/产品信息,每个商品需要收取您100元的展示费,展示期为3个月; 为了完整展示您的商品,请您认真填写以下内容,谢谢合作</view>
  7. </view>
  8. <form>
  9. <view class="row fenlei">
  10. <view class="label">分类</view>
  11. <view class="secondradio">
  12. <radio-group class="row-group" @change="secondHandRidio" >
  13. <label class="row-input" v-for="(item, index) in fenlei" :key="index">
  14. <radio class="row-radio" :value="item.value" color="#E15616"/>
  15. <view class="row-text">{{item.name}}</view>
  16. </label>
  17. </radio-group>
  18. </view>
  19. </view>
  20. <view class="row fenlei" v-if="isShow">
  21. <view class="secondradio Secondary" >
  22. <checkbox-group class="row-group" @change="secondHandType">
  23. <label class="row-input" v-for="(item, index) in radioList" :key="item.value" >
  24. <checkbox class="row-check" :value="item.value" checked="true"></checkbox>
  25. <view class="row-text">{{item.name}}</view>
  26. </label>
  27. </checkbox-group>
  28. </view>
  29. </view>
  30. <view class="row">
  31. <view class="label">商品品牌</view>
  32. <view class="select spacing" @click="hanldOperationConfim">
  33. <view class="placeholder" :style="brandname=='请选择品牌名称'?'':'color:#333333'">{{brandname}}</view>
  34. </view>
  35. <text class="iconfont icon-xiayibu"></text>
  36. <!-- 品牌弹窗 -->
  37. <tui-bottom-popup :radius="true" :show="popupShow" @close="hidePopup()">
  38. <view class="tui-popup-box clearfix">
  39. <text class="iconfont icon-iconfontguanbi" @click="hidePopup()"></text>
  40. <view class="content">
  41. <view class="freight-radio">
  42. <scroll-view scroll-y style="max-height: 605rpx;">
  43. <radio-group class="row-group" @change="radioChange" >
  44. <label class="row-input" v-for="(item, index) in BrandList" :key="item.id">
  45. <view class="row-text">{{item.name}}</view>
  46. <radio class="row-radio" :value="item.id" color="#E15616"/>
  47. </label>
  48. </radio-group>
  49. </scroll-view>
  50. </view>
  51. </view>
  52. </view>
  53. </tui-bottom-popup>
  54. </view>
  55. <view class="row" v-if="secondParams.brandId==161">
  56. <view class="label">其它品牌</view>
  57. <view class="spacing">
  58. <input type="text" maxlength="40" v-model="secondParams.brandName" placeholder="请输入商品品牌" placeholder-class="placeholder">
  59. </view>
  60. </view>
  61. <view class="row">
  62. <view class="label">商品名称</view>
  63. <view class="spacing">
  64. <input type="text" maxlength="40" v-model="secondParams.name" placeholder="请输入商品名称,不超过40个汉字" placeholder-class="placeholder">
  65. </view>
  66. </view>
  67. <view class="row">
  68. <view class="label">出厂日期</view>
  69. <view class="spacing">
  70. <input type="text" v-model="secondParams.fixedYears" maxlength="10" placeholder="请输入出厂日期 如:2020年06月" placeholder-class="placeholder">
  71. </view>
  72. </view>
  73. <!-- <view class="row" v-show="secondParams.secondHandType==2">
  74. <view class="label second">产品到期日</view>
  75. <view class="spacing second">
  76. <input type="text" v-model="secondParams.maturityYears" maxlength="10" placeholder="请输入产品到期日,如:2020年12月" placeholder-class="placeholder">
  77. </view>
  78. </view> -->
  79. <view class="row">
  80. <view class="label">公司名称</view>
  81. <view class="spacing">
  82. <input type="text" v-model="secondParams.companyName" maxlength="30" placeholder="请输入公司名称,不超过30个汉字" placeholder-class="placeholder">
  83. </view>
  84. </view>
  85. <view class="row">
  86. <view class="label">交易价</view>
  87. <view class="spacing">
  88. <input type="text" maxlength="20" v-model="secondParams.price" placeholder="请输入交易价" placeholder-class="placeholder">
  89. </view>
  90. </view>
  91. <view style="margin-top: 15rpx;">
  92. <label v-model="secondParams.detailTalkFlags" class="iconfont xiangliao"
  93. :class="vShow_detailTalkFlag ? 'icon-jiagexiangliao':'icon-juxingweigouxuan'" @click="Detailed($event)">
  94. <label class='pricecolor' >价格详聊</label>
  95. </label>
  96. <label class="showflag" v-show="vShow_detailTalkFlag">(勾选代表同意不显示交易价)</label>
  97. </view>
  98. <!-- <view class="row" v-show="secondParams.secondHandType==2">
  99. <view class="label">市场价</view>
  100. <view class="spacing">
  101. <input type="text" v-model="secondParams.normalPrice" maxlength="30" placeholder="请输入市场价" placeholder-class="placeholder">
  102. </view>
  103. </view> -->
  104. <!-- <view class="row" v-show="secondParams.secondHandType==2">
  105. <view class="label second">采购价/原价</view>
  106. <view class="spacing second">
  107. <input type="text" v-model="secondParams.originalPrice" maxlength="30" placeholder="请输入采购价/原价" placeholder-class="placeholder"/>
  108. </view>
  109. </view>
  110. <view class="row" v-show="secondParams.secondHandType==2">
  111. <view class="label">数量</view>
  112. <view class="spacing">
  113. <input type="text" v-model="secondParams.stock" maxlength="30" placeholder="请输入数量" placeholder-class="placeholder">
  114. </view>
  115. </view> -->
  116. <view class="row">
  117. <view class="label">商品成色</view>
  118. <view class="spacing">
  119. <input type="text" maxlength="10" v-model="secondParams.productQuality" placeholder="请输入商品成色,如“9成新”" placeholder-class="placeholder">
  120. </view>
  121. </view>
  122. <view class="row">
  123. <view class="label">联系人</view>
  124. <view class="spacing">
  125. <input type="text" maxlength="15" v-model="secondParams.contactName" placeholder="请输入联系人姓名" placeholder-class="placeholder">
  126. </view>
  127. </view>
  128. <view class="row">
  129. <view class="label">联系方式</view>
  130. <view class="spacing">
  131. <input type="text" v-model="secondParams.contactMobile" maxlength="11" placeholder="请输入联系人手机号" placeholder-class="placeholder">
  132. </view>
  133. </view>
  134. <view class="row none">
  135. <view class="label-im">身份验证照片</view>
  136. <view class="label-em">个人请上传身份证正面照片;机构请上传营业执照照片(图片大小不超过5M)</view>
  137. <view class="release-input upload image uploadGoodsImages" >
  138. <view class="upload-file" v-if="secondParams.authenticationImage == ''">
  139. <i class="iconfont icon-shangchuantupian"></i>
  140. <text class="add-text">验证照片</text>
  141. <view ref="goodsImages" class="input-file" @click="uploadUserImageFn"></view>
  142. </view>
  143. <view class="upload-file" v-else>
  144. <image :src="secondParams.authenticationImage" alt="" class="upload-img" ></image>
  145. <i class=" del iconfont icon-shanchu1" @click="removeUserImageFn"></i>
  146. </view>
  147. </view>
  148. </view>
  149. <view class="row">
  150. <view class="label">采美对接人</view>
  151. <view class="spacing">
  152. <input type="text" v-model="secondParams.dockingPeopleName" maxlength="15" placeholder="请输入采美对接人姓名" placeholder-class="placeholder">
  153. </view>
  154. </view>
  155. <view class="row">
  156. <view class="label">对接人联系方式</view>
  157. <view class="spacing">
  158. <input type="text" v-model="secondParams.dockingPeopleMobile" maxlength="11" placeholder="请输入采美对接人手机号" placeholder-class="placeholder">
  159. </view>
  160. </view>
  161. <view class="row">
  162. <view class="label">商品类型</view>
  163. <view class="secondradio">
  164. <radio-group class="row-group" @change="getProductType" >
  165. <label class="row-input" v-for="(item, index) in beauty" :key="index">
  166. <radio class="row-radio" :value="item.value" color="#E15616"/>
  167. <view class="row-text">{{item.name}}</view>
  168. </label>
  169. </radio-group>
  170. </view>
  171. </view>
  172. <view class="row" >
  173. <view class="label">联系地址</view>
  174. <view class="spacing" @click="showMulLinkageThreePicker">
  175. <text class="row-input" :class="addressData.address === '请选择所在地区' ? 'none,placeholder' : ''" >
  176. {{addressData.address}}
  177. </text>
  178. </view>
  179. <text class="iconfont icon-xiayibu"></text>
  180. </view>
  181. <textarea type="text"
  182. class="border-grey address-details"
  183. v-model="secondParams.address"
  184. maxlength="50"
  185. placeholder="请填写详细地址,如街道/小区/门牌等"
  186. placeholder-class="placeholder"/>
  187. </textarea>
  188. <view class="release-main-container">
  189. <view class="release-from">
  190. <view class="label">商品图片</view>
  191. <view class="release-input upload image uploadGoodsImages" >
  192. <view class="upload-file" v-if="GoodsImagesList.length<5">
  193. <i class="iconfont icon-shangchuantupian"></i>
  194. <p class="add-text">商品图片</p>
  195. <view ref="goodsImages" class="input-file" @click="uploadGoodsImagesFn"></view>
  196. </view>
  197. <view class="upload-file" v-for="(item, index) in GoodsImagesList" :key="index">
  198. <image :data-original='item' :src="item" :data-image="item" alt="" class="upload-img" ></image>
  199. <i class=" del iconfont icon-shanchu1" @click="removeGoodsImagesFn(index)"></i>
  200. </view>
  201. </view>
  202. <view class="form-upload-tips">
  203. <i class="iconfont icon-wenhao" ></i>
  204. <view class="wen-tips" >最多上传5张二手商品图片,请尽量全部上传,单张图片不能超过5M</view>
  205. </view>
  206. </view>
  207. </view>
  208. <view class="row">
  209. <view class="label-im">二手出让承诺函文件:</view>
  210. <view class="label-em">(文件大小不超过20M)</view>
  211. <view class="spacing file-none" v-if="secondParams.fileName == ''">
  212. <view class="file-none-button" @click="uploadCommitmentFile">上传</view>
  213. </view>
  214. <view class="spacing file-text" v-else>
  215. <text class="file-text-em">{{ secondParams.fileName }}</text>
  216. <i class=" del iconfont icon-shanchu1" @click="deleteCommitmentFile"></i>
  217. </view>
  218. </view>
  219. <view class="row none">
  220. <view class="label-im">二手出让承诺函图片</view>
  221. <view class="label-em">(若不方便上传承诺函文件,可对承诺函进行拍照或者截图,再上传图片)</view>
  222. <view class="label-em">图片大小不超过5M</view>
  223. <view class="release-input upload image uploadGoodsImages" >
  224. <view class="upload-file" v-if="secondParams.commitmentImage == ''">
  225. <i class="iconfont icon-shangchuantupian"></i>
  226. <text class="add-text">承诺函图片</text>
  227. <view ref="goodsImages" class="input-file" @click="uploadCommitmentImageFn"></view>
  228. </view>
  229. <view class="upload-file" v-else>
  230. <image :src="secondParams.commitmentImage" alt="" class="upload-img" ></image>
  231. <i class=" del iconfont icon-shanchu1" @click="removeCommitmentImageFn"></i>
  232. </view>
  233. </view>
  234. </view>
  235. <view class="productinfo">
  236. <view class="label unlogin-label" style="width: 100%;">商品详细信息</view>
  237. <div class="textarea-wrapper">
  238. <textarea class="textarea"
  239. type="text"
  240. v-model="secondParams.productDetails"
  241. placeholder="请填写商品详细信息,对商品进行更详细的描述"
  242. placeholder-class="placeholder"
  243. maxlength="200"
  244. @input="onTextareaInputInfo"
  245. />
  246. <span class="word-limit">{{secondParams.productDetails.length}}/200</span>
  247. </div>
  248. </view>
  249. <view class="productinfo">
  250. <view class="label unlogin-label" style="width: 100%;">免责声明</view>
  251. <text class="smText" >鉴于本网站提供的二手版块信息包括但不限于公司名称,商品的简介、性能、描述与说明,相关图片、视频等均由卖家自行提供,由卖家对其提供的信息承担相应法律责任。买家应自行甄别商品信息并查验商品性状。本网站对二手版块中买卖双方的交易不提供任何形式的担保与保证,特此声明!</text>
  252. </view>
  253. <view class="row Read">
  254. <span @click="changeBox($event)" class="iconfont xiangliao"
  255. :class="checkbox?'icon-jiagexiangliao':'icon-juxingweigouxuan'" ><span style="margin-left: 10rpx;">已阅读</span></span>
  256. </view>
  257. <view class="BtnAll" :style="{ paddingBottom :isIphoneX ? '68rpx' : '0rpx' }">
  258. <view @click="submitBtn" class="btn-submit">发布</view>
  259. </view>
  260. </form>
  261. <!-- 地址弹窗 -->
  262. <mpvue-city-picker :themeColor="themeColor"
  263. ref="mpvueCityPicker"
  264. :pickerValueDefault="cityPickerValueDefault"
  265. @onCancel="onCancel"
  266. @onConfirm="onConfirm">
  267. </mpvue-city-picker>
  268. </view>
  269. <view class="secondBj thebj" v-show="PopupShow" :class="PopupShow ? 'show':''">
  270. <view class="bjmain theresult">
  271. <text class="title">发布提示</text>
  272. <text class="content"> {{ tipsContentText }} </text>
  273. <view class="paybtn">
  274. <view class="btn cancel" @click.stop="cancelButtonFn">{{ cancelButtonText }}</view>
  275. <view class="btn confirm" @click.stop="confirmButtonFn">{{ confirmButtonText }}</view>
  276. </view>
  277. </view>
  278. </view>
  279. <payment-record ref="payment" v-if="isRequest" :discernReceiptList="discernReceiptList" :receiptAmount="receiptAmount"></payment-record>
  280. </view>
  281. </template>
  282. <script>
  283. import mpvueCityPicker from '@/components/mpvue-citypicker/mpvueCityPicker.vue'
  284. import paymentRecord from '@/components/cm-module/orderDetails/paymentRecord'
  285. import { uploadFileImage , uploadFilePdf } from "@/services/public.js"
  286. import authorize from '@/common/config/authorize.js'
  287. import $reg from '@/common/config/common.js'
  288. import { mapState,mapMutations } from 'vuex';
  289. export default{
  290. name:'secondHandrelease',
  291. components:{
  292. mpvueCityPicker,
  293. paymentRecord,
  294. },
  295. data(){
  296. return{
  297. userIdentity:0,
  298. popupShow:false,
  299. fenlei:[
  300. {name:'二手仪器',value:'1'},
  301. // {name:'临期产品',value:'2'},
  302. {name:'其他',value:'3'},
  303. ],
  304. radioList:[
  305. {name:'美容仪器',value:'1',isChecked:false}
  306. ],
  307. beauty:[
  308. {name:'医美',value:'1'},
  309. {name:'非医美',value:'2'},
  310. ],
  311. BrandList:[],
  312. isShow:false,
  313. GoodsImagesList:[],
  314. secondParams:{
  315. secondHandType:'',//一级分类
  316. instrumentType:'',//二手仪器分类
  317. name:'',
  318. brandId:'',//品牌ID
  319. brandName:'',//其他品牌
  320. fixedYears:'',//出厂
  321. companyName:'',//公司名称
  322. maturityYears:'',//产品到期
  323. price:'',//交易价
  324. detailTalkFlag:1,//是否启用详聊
  325. normalPrice:'',//市场价
  326. originalPrice:'',//采购价
  327. stock:'',//数量
  328. productQuality:'',//商品成色
  329. contactName:'',//联系人
  330. contactMobile:'',//联系方式
  331. authenticationImage:'',//身份验证图片
  332. commitmentImage:'',//承诺函图片
  333. dockingPeopleName:'',//采美对接人姓名
  334. dockingPeopleMobile:'',//采美对接人手机号
  335. secondProductType:'',//
  336. townId:'',//县区地址
  337. address:'',//详细地址
  338. image:'',//图片
  339. fileName:'',
  340. ossName:'',
  341. productDetails:'',//商品详细信息
  342. source:2//二手发布来源.1:WWW,2:小程序,3:后台,4:协销
  343. },
  344. addressData:{
  345. address:'请选择所在地区',
  346. townID:'', //区ID
  347. cityID:'', //区ID
  348. provinceID:'', //区ID
  349. addressDetail: '', //地址
  350. },
  351. brandname:'请选择品牌名称',
  352. checkbox:false,
  353. shoplogoTwo:false,
  354. PopupShow:false,
  355. tipsContentText:'发布二手商品,采美需要收取您每个商品100元的展示费,展示期为3个月支付完成后,商品会在1-2个工作日内进行审核,审核通过后,商品会立即上线',
  356. cancelButtonText:'取消发布',
  357. confirmButtonText:'去支付',
  358. isButtonsType:0,
  359. resultBj:false,
  360. vShow_detailTalkFlag:false,
  361. playid:'',
  362. }
  363. },
  364. methods:{
  365. onTextareaInputInfo(e){
  366. this.secondParams.productDetails = e.detail.value;
  367. },
  368. radioChange(e){//品牌
  369. this.secondParams.brandId = e.target.value;
  370. this.BrandList.forEach((item,index)=>{
  371. if(item.id==this.secondParams.brandId){
  372. this.brandname = item.name;
  373. this.popupShow = false;
  374. }
  375. })
  376. },
  377. showMulLinkageThreePicker() {//三级地址联动
  378. this.isShowInput = true
  379. this.$refs.mpvueCityPicker.show()
  380. },
  381. onConfirm(e) {//获取选择的地址信息
  382. this.addressData.address = e.name;
  383. this.addressData.townID = e.townCode;
  384. this.addressData.cityID = e.cityCode;
  385. this.addressData.provinceID = e.provinceCode;
  386. this.secondParams.townId = this.addressData.townID;
  387. },
  388. hanldOperationConfim(){
  389. this.popupShow = true;
  390. },
  391. hidePopup(){
  392. this.popupShow = false;
  393. },
  394. secondHandRidio(e) {
  395. this.secondParams.secondHandType = e.target.value;
  396. if (e.target.value == 1){
  397. this.isShow = true;
  398. }else {
  399. this.isShow = false;
  400. }
  401. },
  402. secondHandType(e){ //二手仪器
  403. this.secondParams.instrumentType = e.target.value.toString();
  404. },
  405. Detailed(){
  406. this.vShow_detailTalkFlag = !this.vShow_detailTalkFlag;
  407. if(this.vShow_detailTalkFlag){
  408. this.secondParams.detailTalkFlag = 2 ;//启用价格详聊
  409. }else {
  410. this.secondParams.detailTalkFlag = 1 ;//不启用价格详聊
  411. }
  412. },
  413. uploadGoodsImagesFn(event){//上传商品图片
  414. uploadFileImage().then(res =>{
  415. this.GoodsImagesList.push(JSON.parse(res.data).data);
  416. this.secondParams.image =this.GoodsImagesList.toString()+',';
  417. })
  418. },
  419. uploadUserImageFn(event){//上传身份图片
  420. uploadFileImage().then(res =>{
  421. this.secondParams.authenticationImage = JSON.parse(res.data).data;
  422. })
  423. },
  424. uploadCommitmentImageFn(event){//上传承诺函图片
  425. uploadFileImage().then(res =>{
  426. this.secondParams.commitmentImage = JSON.parse(res.data).data;
  427. })
  428. },
  429. uploadCommitmentFile(){//上传承诺函文件
  430. uploadFilePdf().then(res =>{
  431. let data = JSON.parse(res.data).data
  432. this.secondParams.fileName = uni.getStorageSync('fileName');
  433. this.secondParams.ossName = data.ossName;
  434. console.log('fileName',this.secondParams.fileName)
  435. console.log('ossName',this.secondParams.ossName)
  436. })
  437. },
  438. deleteCommitmentFile(){//删除承诺函文件
  439. this.secondParams.fileName = ''
  440. },
  441. removeGoodsImagesFn(index){//删除商品图片
  442. this.GoodsImagesList.splice(index,1);
  443. this.secondParams.image =this.GoodsImagesList.toString()+',';
  444. },
  445. removeUserImageFn(index){//删除身份图片
  446. this.secondParams.authenticationImage = ''
  447. },
  448. removeCommitmentImageFn(index){//删除承诺函图片
  449. this.secondParams.commitmentImage = ''
  450. },
  451. getProductType(e){
  452. this.secondParams.secondProductType = e.target.value ;
  453. },
  454. submitBtn () {
  455. if(this.secondParams.secondHandType == ''){
  456. this.$util.msg('请选择分类',2000);
  457. return;
  458. }
  459. if(this.secondParams.secondHandType == 1 ){
  460. if(this.secondParams.instrumentType ==''){
  461. this.$util.msg('请完善仪器分类',2000);
  462. return;
  463. }
  464. }
  465. if(this.secondParams.brandId == ''){
  466. this.$util.msg('请选择商品品牌',2000);
  467. return;
  468. }
  469. if(this.secondParams.name == ''){
  470. this.$util.msg('请输入商品名称',2000);
  471. return
  472. }
  473. // if(this.secondParams.secondHandType ==2) {
  474. // if (this.secondParams.maturityYears=='') {
  475. // this.$util.msg('请输入产品到期日',2000);
  476. // return
  477. // }
  478. // }
  479. if(!this.$api.isNumber(this.secondParams.price)){
  480. this.$util.msg('请输入交易价',2000);
  481. return
  482. }
  483. // if(this.secondParams.secondHandType ==2) {
  484. // if (!this.$api.isNumber(this.secondParams.normalPrice)) {
  485. // this.$util.msg('请输入市场价',2000);
  486. // return
  487. // }
  488. // if(!this.$api.isNumber(this.secondParams.originalPrice)){
  489. // this.$util.msg('请输入采购价/原价',2000);
  490. // return
  491. // }
  492. // if(!this.$api.isNumber(this.secondParams.stock)){
  493. // this.$util.msg('请输入数量',2000);
  494. // return
  495. // }
  496. // }
  497. if(this.secondParams.productQuality == ''){
  498. this.$util.msg('请输入商品成色',2000);
  499. return
  500. }
  501. if(this.secondParams.contactName == ''){
  502. this.$util.msg('请输入联系人姓名',2000);
  503. return
  504. }
  505. if(this.secondParams.contactMobile == ''){
  506. console.log(this.secondParams.contactMobile)
  507. this.$util.msg('请输入联系方式',2000);
  508. return
  509. }
  510. if(!$reg.isMobile(this.secondParams.contactMobile)){
  511. this.$util.msg('请填写正确的手机号',2000);
  512. return
  513. }
  514. if(this.userIdentity === 1){
  515. if(this.secondParams.dockingPeopleName == ''){
  516. this.$util.msg('请输入采美对接人姓名',2000);
  517. return
  518. }
  519. if(this.secondParams.dockingPeopleMobile == ''){
  520. this.$util.msg('请输入采美对接人手机号',2000);
  521. return
  522. }
  523. }
  524. if(this.secondParams.dockingPeopleMobile !=''){
  525. if(!$reg.isMobile(this.secondParams.dockingPeopleMobile)){
  526. this.$util.msg('请填写正确的采美对接人手机号',2000);
  527. return
  528. }
  529. }
  530. if(this.secondParams.townId == ''|| this.secondParams.townId == undefined){
  531. this.$util.msg('请完善联系地址',2000);
  532. return
  533. }
  534. if(this.secondParams.address == ''){
  535. this.$util.msg('请填写详细地址',2000);
  536. return
  537. }
  538. if(this.GoodsImagesList ==''){
  539. this.$util.msg('请上传图片',2000);
  540. return;
  541. }
  542. if(this.checkbox==false){
  543. this.$util.msg('请勾选已阅读',2000);
  544. return
  545. }
  546. console.log(this.secondParams)
  547. if(this.secondParams.authenticationImage == ''){
  548. this.PopupShow = true
  549. this.tipsContentText = '上传身份验证照片,您的二手商品将获得更好的推荐推荐和曝光,方便您快速卖出。'
  550. this.cancelButtonText = '继续发布'
  551. this.confirmButtonText = '去上传'
  552. this.isButtonsType = 1
  553. return;
  554. }
  555. if(this.secondParams.commitmentImage == '' || this.secondParams.ossName == ''){
  556. this.PopupShow = true
  557. this.tipsContentText = '上传二手出让承诺函,您的二手商品将获得更好的推荐推荐和曝光,方便您快速卖出。'
  558. this.cancelButtonText = '继续发布'
  559. this.confirmButtonText = '去上传'
  560. this.isButtonsType = 1
  561. return;
  562. }
  563. this.SecondHandProduct(this.secondParams)
  564. },
  565. SecondHandProduct(params){//提交发布
  566. this.SecondService.SecondHandProduct(params).then(res=>{
  567. this.PopupShow = true;
  568. this.tipsContentText = '发布二手商品,采美需要收取您每个商品100元的展示费,展示期为3个月支付完成后,商品会在1-2个工作日内进行审核,审核通过后,商品会立即上线'
  569. this.cancelButtonText = '取消发布'
  570. this.confirmButtonText = '去支付'
  571. this.isButtonsType = 2
  572. this.playid= res.data;
  573. }).catch(error =>{
  574. this.$util.msg(error.msg,2000)
  575. this.secondBj = false;
  576. return
  577. })
  578. },
  579. cancelButtonFn(){//弹窗操作按钮
  580. switch(this.isButtonsType){
  581. case 1:
  582. this.SecondHandProduct(this.secondParams)
  583. break;
  584. case 2:
  585. this.PopupShow = false;
  586. break;
  587. }
  588. },
  589. confirmButtonFn(){//弹窗操作按钮
  590. switch(this.isButtonsType){
  591. case 1:
  592. this.PopupShow = false;
  593. break;
  594. case 2:
  595. this.MiniWxPayFor()
  596. this.PopupShow = false;
  597. break;
  598. }
  599. },
  600. MiniWxPayFor(){
  601. authorize.getCode('weixin').then(wechatcode =>{
  602. let params ={
  603. code:wechatcode,
  604. productId:this.playid
  605. }
  606. this.PayService.SecondHandPay(params).then(response =>{
  607. let PayInfo = JSON.parse(response.data.data.payInfo);
  608. this.WxRequestPayment(PayInfo)
  609. }).catch(error =>{
  610. this.$util.msg(error.msg,2000)
  611. })
  612. })
  613. },
  614. WxRequestPayment(data){
  615. let self = this
  616. wx.requestPayment({
  617. 'timeStamp': data.timeStamp,
  618. 'nonceStr': data.nonceStr,
  619. 'package': data.package,
  620. 'signType': data.signType,
  621. 'paySign': data.paySign,
  622. 'success':function(res){
  623. wx.reLaunch({url: '/pages/second/product/product-list'});
  624. },
  625. 'fail':function(res){
  626. self.$util.msg('用户取消支付~')
  627. },
  628. 'complete':function(res){
  629. }
  630. })
  631. },
  632. changeBox:function () {
  633. this.checkbox = !this.checkbox;
  634. },
  635. },
  636. onShow() {
  637. this.SecondService.brandList().then(res =>{//品牌列表
  638. if(res.code == 0){
  639. this.BrandList = res.data;
  640. }
  641. })
  642. this.$api.getComStorage('userInfo').then((resolve) =>{
  643. this.userIdentity = resolve.userIdentity
  644. console.log(this.userIdentity)
  645. }).catch(error =>{
  646. console.log(error)
  647. })
  648. }
  649. }
  650. </script>
  651. <style lang="scss">
  652. view{font-size: 28rpx;}
  653. .my-maintenance{
  654. padding: 20rpx;
  655. }
  656. .bannerimg {
  657. height: 66rpx;
  658. width: 100%;
  659. }
  660. .bannerimg image{
  661. width: 100%;
  662. height: 100% ;
  663. }
  664. .newsTitle {
  665. line-height: 48rpx;
  666. text-align: left;
  667. color: #e15616;
  668. padding:20rpx;
  669. background-color: rgba(225, 86, 22, .1);
  670. }
  671. .nestext{
  672. font-size: 24rpx;
  673. }
  674. .secondradio view{
  675. display: inline-block;
  676. color: #333333;
  677. margin-right: 21rpx;
  678. }
  679. .secondradio{
  680. display: inline-block;
  681. margin-left: 40rpx;
  682. }
  683. .Secondary{
  684. margin-left: 96rpx;
  685. }
  686. .secondradio view.active {
  687. color: #e15616;
  688. }
  689. .placeholder{
  690. color: #b2b2b2;
  691. }
  692. .linqi_text {
  693. width: 607rpx;
  694. height: 68rpx;
  695. background-color: #1890f9;
  696. box-shadow: 0rpx 4rpx 6rpx 0rpx rgba(24, 144, 249, 0.17);
  697. text-align: center;
  698. line-height: 68rpx;
  699. color: #ffffff;
  700. margin: auto;
  701. font-size:24rpx;
  702. position: relative;
  703. }
  704. .jiaobiao {
  705. width: 0;
  706. height: 0;
  707. border-left: 20rpx solid transparent;
  708. border-right: 20rpx solid transparent;
  709. top: -25%;
  710. right: 40%;
  711. border-bottom: 20rpx solid #1890f9;
  712. position: absolute;
  713. }
  714. .label{
  715. color: #666666;
  716. display: inline-block;
  717. }
  718. .label-im{
  719. width: 100%;
  720. line-height: 50rpx;
  721. font-size: $font-size-28;
  722. color: #666666;
  723. text-align: left;
  724. margin-top: 20rpx;
  725. }
  726. .label-em{
  727. line-height: 28rpx;
  728. font-size: $font-size-20;
  729. color: #fea785;
  730. width: 100%;
  731. text-align: left;
  732. }
  733. .label.second{
  734. width: 155rpx;
  735. }
  736. .row .spacing.second{
  737. width: 70%;
  738. }
  739. .row{
  740. border-bottom: 2rpx solid #e1e1e1;
  741. line-height: 90rpx;
  742. height: auto;
  743. position: relative;
  744. &.none{
  745. border-bottom: none;
  746. }
  747. }
  748. .row.fenlei{
  749. height: auto;
  750. margin: 10rpx 0;
  751. border: 0;
  752. }
  753. .select {
  754. position: relative;
  755. color: #b2b2b2;
  756. text-align: left;
  757. user-select: none;
  758. }
  759. .row .spacing{
  760. display: inline-block;
  761. margin-left: 50rpx;
  762. width: 430rpx;
  763. vertical-align:middle;
  764. position: relative;
  765. &.file{
  766. width: 100%;
  767. }
  768. &.file-text{
  769. width: 100%;
  770. line-height: 44rpx;
  771. font-size: 28rpx;
  772. box-sizing: border-box;
  773. margin-left: 0;
  774. .file-text-em{
  775. width: 100%;
  776. text-overflow: ellipsis;
  777. overflow: hidden;
  778. display: -webkit-box;
  779. -webkit-line-clamp: 1;
  780. line-clamp: 1;
  781. -webkit-box-orient: vertical;
  782. line-height: 44rpx;
  783. font-size: 28rpx;
  784. padding-right: 40rpx;
  785. box-sizing: border-box;
  786. position: relative;
  787. }
  788. .icon-shanchu1{
  789. width: 40rpx;
  790. height: 40rpx;
  791. line-height: 40rpx;
  792. display: block;
  793. position: absolute;
  794. top: 0;
  795. right:0;
  796. color: #f94b4b;
  797. font-size: 36rpx;
  798. }
  799. }
  800. &.file-none{
  801. width: 100%;
  802. margin-left: 0;
  803. position: relative;
  804. .file-none-button{
  805. width: 88rpx;
  806. height: 44rpx;
  807. background-color: #e15616;
  808. border-radius: 8rpx;
  809. line-height: 44rpx;
  810. text-align: center;
  811. font-size: 24rpx;
  812. color: #FFFFFF;
  813. position: absolute;
  814. right: 0;
  815. top: -15rpx;
  816. }
  817. }
  818. }
  819. .select .placeholder {
  820. position: relative;
  821. cursor: pointer;
  822. width: 100%;
  823. display: inline-block;
  824. }
  825. .icon-xiayibu{
  826. right: 0rpx;
  827. color: #b2b2b2;
  828. position: absolute;
  829. }
  830. .xiangliao{
  831. font-size: 26rpx;
  832. margin-right: 10rpx;
  833. color: #b2b2b2;
  834. }
  835. .icon-jiagexiangliao{
  836. color: #e15616 !important;
  837. }
  838. .pricecolor{
  839. margin-left: 10rpx;
  840. }
  841. .showflag{
  842. color: #b2b2b2;
  843. }
  844. .border-grey{
  845. width: 100%;
  846. resize: none;
  847. padding: 20rpx 0;
  848. height: 160rpx;
  849. border-bottom: 2rpx solid #e1e1e1;
  850. }
  851. .release-main-container {
  852. overflow: hidden;
  853. margin: 20rpx 0;
  854. }
  855. .uploadGoodsImages{
  856. display: flex;
  857. overflow-x: auto;
  858. overflow-y: hidden;
  859. }
  860. .secondradio{
  861. .row-radio{
  862. transform: scale(.8);
  863. }
  864. .row-input{margin-right: 10rpx;}
  865. }
  866. .linqi_text .p{
  867. font-size: $font-size-20;
  868. }
  869. .upload-file {
  870. float: left;
  871. margin: 20rpx 20rpx 20rpx 0px;
  872. cursor: pointer;
  873. width: 194rpx;
  874. height: 194rpx;
  875. border-radius: 6rpx;
  876. border: solid 2rpx #e1e1e1;
  877. flex-shrink: 0;
  878. position: relative;
  879. display: inline-block;
  880. }
  881. .input-file {
  882. width: 194rpx;
  883. height: 194rpx;
  884. opacity: 0;
  885. cursor: pointer;
  886. position: absolute;
  887. }
  888. .add-text {
  889. font-size: 26rpx;
  890. color: #333330;
  891. opacity: 0.5;
  892. position: absolute;
  893. top: 55%;
  894. right:24%;
  895. }
  896. .upload-img {
  897. width: 100%;
  898. height: 100%;
  899. display: block;
  900. border-radius: .53vw;
  901. }
  902. .icon-shangchuantupian{
  903. width: 46rpx;
  904. height: 46rpx;
  905. color: #b2b2b2;
  906. font-size: 18px;
  907. position: absolute;
  908. top: 30%;
  909. left: 40%;
  910. }
  911. .icon-shanchu1{
  912. width: 40rpx;
  913. height: 40rpx;
  914. line-height: 40rpx;
  915. display: block;
  916. position: absolute;
  917. top: -15rpx;
  918. right:-18rpx;
  919. color: #f94b4b;
  920. font-size: 36rpx;
  921. }
  922. .wen-tips {
  923. width: 664rpx;
  924. height: 68rpx;
  925. line-height: 68rpx;
  926. text-align: center;
  927. color: #FFF;
  928. font-size: 20rpx;
  929. background-color: #1890f9;
  930. box-shadow: 0 0.8vw 1.6vw 0 rgba(24, 144, 249, 0.17);
  931. border-radius: 2rpx;
  932. display: none;
  933. }
  934. .form-upload-tips:hover .wen-tips {
  935. display: block;
  936. }
  937. .textarea-wrapper {
  938. letter-spacing: 2rpx;
  939. line-height: 48rpx;
  940. color: #333333;
  941. position: relative;
  942. font-size: 28rpx;
  943. border: 2rpx solid #b2b2b2;
  944. height: 300rpx;
  945. padding: 16rpx;
  946. border-radius: 6rpx;
  947. margin: 20rpx 0;
  948. }
  949. .textarea-wrapper textarea{
  950. width: 100%;
  951. }
  952. .word-limit {
  953. position: absolute;
  954. right: 2.7vw;
  955. bottom: 2.7vw;
  956. font-size: 3.2vw;
  957. color: #9aa5b5;
  958. }
  959. .smText{
  960. color: #999999;
  961. text-align: left;
  962. line-height: 42rpx;
  963. font-size: 24rpx;
  964. margin-top: 10rpx;
  965. width: 100%;
  966. height: 260rpx;
  967. }
  968. .BtnAll{
  969. width: 100%;
  970. margin-bottom: 20rpx;
  971. .btn-submit{
  972. width: 600rpx;
  973. height: 90rpx;
  974. margin: auto;
  975. text-align: center;
  976. line-height: 90rpx;
  977. color: #fff;
  978. background-image: $btn-confirm;
  979. border-radius: 90rpx;
  980. font-size: 30rpx;
  981. }
  982. }
  983. .row.Read{
  984. border: 0;
  985. text-align: center;
  986. color: #999999;
  987. }
  988. .thebj {
  989. position: fixed;
  990. left: 0;
  991. top: 0;
  992. bottom: 0;
  993. width: 100%;
  994. height: 100%;
  995. background-color: rgba(0, 0, 0, .5);
  996. z-index: 999999;
  997. opacity: 0;
  998. }
  999. .thebj.show{
  1000. opacity: 1;
  1001. }
  1002. .theresult {
  1003. position: absolute;
  1004. top: 50%;
  1005. left: 50%;
  1006. transform: translate(-50%, -50%);
  1007. width:580rpx;
  1008. background-color: #fff;
  1009. border-radius: 32rpx;
  1010. }
  1011. .theresult .title{
  1012. line-height: 100rpx;
  1013. text-align: center;
  1014. display: block;
  1015. color: #333333;
  1016. font-size: 30rpx;
  1017. font-weight: bold;
  1018. border-bottom: 2rpx solid #efefef;
  1019. }
  1020. .theresult .content{
  1021. padding: 30rpx 52rpx;
  1022. line-height: 48rpx;
  1023. color: #666666;
  1024. font-size: 30rpx;
  1025. display: block;
  1026. }
  1027. .paybtn{
  1028. width: 100%;
  1029. height: 90rpx;
  1030. float: left;
  1031. .btn{
  1032. width: 50%;
  1033. height: 90rpx;
  1034. text-align: center;
  1035. line-height: 90rpx;
  1036. font-size: 30rpx;
  1037. display: inline-block;
  1038. float: left;
  1039. &.cancel{
  1040. background-color: #efefef;
  1041. border-radius: 0rpx 0rpx 0rpx 32rpx;
  1042. color: #999999;
  1043. }
  1044. &.confirm{
  1045. background-image: linear-gradient(270deg, #f28f31 0%, #e15616 100%);
  1046. border-radius: 0rpx 0rpx 32rpx 0rpx;
  1047. color: #fff;
  1048. }
  1049. }
  1050. }
  1051. .icon-wenhao{
  1052. color: #1890f9;
  1053. font-size: 35rpx;
  1054. width: 50rpx;
  1055. }
  1056. .form-upload-tips:hover .wen-tips {display: block;}
  1057. .tui-popup-box {
  1058. z-index: 22;
  1059. width: 702rpx;
  1060. padding: 24rpx 24rpx 36rpx 24rpx;
  1061. height: 670rpx;
  1062. position: relative;
  1063. .icon-iconfontguanbi{
  1064. font-size: 40rpx;
  1065. color: #b2b2b2;
  1066. width: 60rpx;
  1067. float: right;
  1068. display: block;
  1069. }
  1070. .content{
  1071. .freight-radio{
  1072. height: 66rpx;
  1073. line-height: 66rpx;
  1074. padding: 0 35rpx;
  1075. .row-group{
  1076. width: 100%;
  1077. // max-height: 605rpx;
  1078. // overflow: auto;
  1079. }
  1080. .row-input{
  1081. height: 66rpx;
  1082. line-height: 66rpx;
  1083. width: 100%;
  1084. display: block;
  1085. }
  1086. .row-radio{
  1087. float: right;
  1088. transform: scale(0.9);
  1089. color: #b2b2b2;
  1090. }
  1091. .row-text{
  1092. font-size: $font-size-28;
  1093. color: #666666;
  1094. float: left;
  1095. }
  1096. }
  1097. }
  1098. }
  1099. checkbox .wx-checkbox-input{
  1100. border-radius: 50%;
  1101. }
  1102. .row-check{
  1103. transform: scale(0.8);
  1104. }
  1105. checkbox .wx-checkbox-input.wx-checkbox-input-checked{
  1106. background: #E15616;
  1107. border: 2rpx solid #e15616;
  1108. }
  1109. checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
  1110. border-radius: 50%;
  1111. border: 2rpx solid #e15616;
  1112. width: 34rpx;
  1113. height: 34rpx;
  1114. line-height: 34rpx;
  1115. text-align: center;
  1116. font-size:34rpx;
  1117. color:#fff;
  1118. background: transparent;
  1119. transform:translate(-50%, -50%) scale(.8);
  1120. -webkit-transform:translate(-50%, -50%) scale(.8);
  1121. }
  1122. </style>