form.vue 34 KB

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