form.vue 34 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141
  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">(个人请上传身份证正面照片;机构请上传营业执照照片)</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">二手出让承诺函文件</view>
  212. <view class="spacing file-none" v-if="secondParams.fileName == ''">
  213. <view class="file-none-button" @click="uploadCommitmentFile">上传</view>
  214. </view>
  215. <view class="spacing file-text" v-else>
  216. <text class="file-text-em">{{ secondParams.fileName }}</text>
  217. <i class=" del iconfont icon-shanchu1" @click="deleteCommitmentFile"></i>
  218. </view>
  219. </view>
  220. <view class="row none">
  221. <view class="label-im">二手出让承诺函图片</view>
  222. <view class="label-em">(若不方便上传承诺函文件,可对承诺函进行拍照或者截图,再上传图片)</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. {name:'重光电',value:'2',isChecked:false},
  307. {name:'耗材配件',value:'3',isChecked:false},
  308. ],
  309. beauty:[
  310. {name:'医美',value:'1'},
  311. {name:'非医美',value:'2'},
  312. ],
  313. BrandList:[],
  314. isShow:false,
  315. GoodsImagesList:['https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2306696130,3636777462&fm=26&gp=0.jpg'],
  316. secondParams:{
  317. secondHandType:'',//一级分类
  318. instrumentType:'',//二手仪器分类
  319. name:'',
  320. brandId:'',//品牌ID
  321. brandName:'',//其他品牌
  322. fixedYears:'',//出厂
  323. companyName:'',//公司名称
  324. maturityYears:'',//产品到期
  325. price:'',//交易价
  326. detailTalkFlag:1,//是否启用详聊
  327. normalPrice:'',//市场价
  328. originalPrice:'',//采购价
  329. stock:'',//数量
  330. productQuality:'',//商品成色
  331. contactName:'',//联系人
  332. contactMobile:'',//联系方式
  333. authenticationImage:'https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2306696130,3636777462&fm=26&gp=0.jpg',//身份验证图片
  334. commitmentImage:'https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2306696130,3636777462&fm=26&gp=0.jpg',//承诺函图片
  335. dockingPeopleName:'',//采美对接人姓名
  336. dockingPeopleMobile:'',//采美对接人手机号
  337. secondProductType:'',//
  338. townId:'',//县区地址
  339. address:'',//详细地址
  340. image:'https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2306696130,3636777462&fm=26&gp=0.jpg',//图片
  341. fileName:'',
  342. ossName:'',
  343. productDetails:'',//商品详细信息
  344. source:2//二手发布来源.1:WWW,2:小程序,3:后台,4:协销
  345. },
  346. addressData:{
  347. address:'请选择所在地区',
  348. townID:'', //区ID
  349. cityID:'', //区ID
  350. provinceID:'', //区ID
  351. addressDetail: '', //地址
  352. },
  353. brandname:'请选择品牌名称',
  354. checkbox:false,
  355. shoplogoTwo:false,
  356. PopupShow:false,
  357. tipsContentText:'发布二手商品,采美需要收取您每个商品100元的展示费,展示期为3个月支付完成后,商品会在1-2个工作日内进行审核,审核通过后,商品会立即上线',
  358. cancelButtonText:'取消发布',
  359. confirmButtonText:'去支付',
  360. isButtonsType:0,
  361. resultBj:false,
  362. vShow_detailTalkFlag:false,
  363. playid:'',
  364. }
  365. },
  366. methods:{
  367. onTextareaInputInfo(e){
  368. this.secondParams.productDetails = e.detail.value;
  369. },
  370. radioChange(e){//品牌
  371. this.secondParams.brandId = e.target.value;
  372. this.BrandList.forEach((item,index)=>{
  373. if(item.id==this.secondParams.brandId){
  374. this.brandname = item.name;
  375. this.popupShow = false;
  376. }
  377. })
  378. },
  379. showMulLinkageThreePicker() {//三级地址联动
  380. this.isShowInput = true
  381. this.$refs.mpvueCityPicker.show()
  382. },
  383. onConfirm(e) {//获取选择的地址信息
  384. this.addressData.address = e.name;
  385. this.addressData.townID = e.townCode;
  386. this.addressData.cityID = e.cityCode;
  387. this.addressData.provinceID = e.provinceCode;
  388. this.secondParams.townId = this.addressData.townID;
  389. },
  390. hanldOperationConfim(){
  391. this.popupShow = true;
  392. },
  393. hidePopup(){
  394. this.popupShow = false;
  395. },
  396. secondHandRidio(e) {
  397. this.secondParams.secondHandType = e.target.value;
  398. if (e.target.value == 1){
  399. this.isShow = true;
  400. }else {
  401. this.isShow = false;
  402. }
  403. },
  404. secondHandType(e){ //二手仪器
  405. this.secondParams.instrumentType = e.target.value.toString();
  406. },
  407. Detailed(){
  408. this.vShow_detailTalkFlag = !this.vShow_detailTalkFlag;
  409. if(this.vShow_detailTalkFlag){
  410. this.secondParams.detailTalkFlag = 2 ;//启用价格详聊
  411. }else {
  412. this.secondParams.detailTalkFlag = 1 ;//不启用价格详聊
  413. }
  414. },
  415. uploadGoodsImagesFn(event){//上传商品图片
  416. uploadFileImage().then(res =>{
  417. this.GoodsImagesList.push(JSON.parse(res.data).data);
  418. this.secondParams.image =this.GoodsImagesList.toString()+',';
  419. })
  420. },
  421. uploadUserImageFn(event){//上传身份图片
  422. uploadFileImage().then(res =>{
  423. this.secondParams.authenticationImage = JSON.parse(res.data).data;
  424. })
  425. },
  426. uploadCommitmentImageFn(event){//上传承诺函图片
  427. uploadFileImage().then(res =>{
  428. this.secondParams.commitmentImage = JSON.parse(res.data).data;
  429. })
  430. },
  431. uploadCommitmentFile(){//上传承诺函文件
  432. uploadFilePdf().then(res =>{
  433. let data = JSON.parse(res.data).data
  434. this.secondParams.fileName = uni.getStorageSync('fileName');
  435. this.secondParams.ossName = data.ossName;
  436. console.log('fileName',this.secondParams.fileName)
  437. console.log('ossName',this.secondParams.ossName)
  438. })
  439. },
  440. deleteCommitmentFile(){//删除承诺函文件
  441. this.UploadService.PostFileDelete(
  442. {
  443. ossName:this.secondParams.ossName,
  444. }
  445. )
  446. .then(res=>{
  447. this.secondParams.fileName = '';
  448. this.secondParams.ossName = '';
  449. })
  450. .catch(error =>{
  451. console.log('删除文件异常提示===>',error.msg)
  452. })
  453. },
  454. removeGoodsImagesFn(index){//删除商品图片
  455. this.GoodsImagesList.splice(index,1);
  456. this.secondParams.image =this.GoodsImagesList.toString()+',';
  457. },
  458. removeUserImageFn(index){//删除身份图片
  459. this.secondParams.authenticationImage = ''
  460. },
  461. removeCommitmentImageFn(index){//删除承诺函图片
  462. this.secondParams.commitmentImage = ''
  463. },
  464. getProductType(e){
  465. this.secondParams.secondProductType = e.target.value ;
  466. },
  467. submitBtn () {
  468. if(this.secondParams.secondHandType == ''){
  469. this.$util.msg('请选择分类',2000);
  470. return;
  471. }
  472. if(this.secondParams.secondHandType == 1 ){
  473. if(this.secondParams.instrumentType ==''){
  474. this.$util.msg('请完善仪器分类',2000);
  475. return;
  476. }
  477. }
  478. if(this.secondParams.brandId == ''){
  479. this.$util.msg('请选择商品品牌',2000);
  480. return;
  481. }
  482. if(this.secondParams.name == ''){
  483. this.$util.msg('请输入商品名称',2000);
  484. return
  485. }
  486. // if(this.secondParams.secondHandType ==2) {
  487. // if (this.secondParams.maturityYears=='') {
  488. // this.$util.msg('请输入产品到期日',2000);
  489. // return
  490. // }
  491. // }
  492. if(!this.$api.isNumber(this.secondParams.price)){
  493. this.$util.msg('请输入交易价',2000);
  494. return
  495. }
  496. // if(this.secondParams.secondHandType ==2) {
  497. // if (!this.$api.isNumber(this.secondParams.normalPrice)) {
  498. // this.$util.msg('请输入市场价',2000);
  499. // return
  500. // }
  501. // if(!this.$api.isNumber(this.secondParams.originalPrice)){
  502. // this.$util.msg('请输入采购价/原价',2000);
  503. // return
  504. // }
  505. // if(!this.$api.isNumber(this.secondParams.stock)){
  506. // this.$util.msg('请输入数量',2000);
  507. // return
  508. // }
  509. // }
  510. if(this.secondParams.productQuality == ''){
  511. this.$util.msg('请输入商品成色',2000);
  512. return
  513. }
  514. if(this.secondParams.contactName == ''){
  515. this.$util.msg('请输入联系人姓名',2000);
  516. return
  517. }
  518. if(this.secondParams.contactMobile == ''){
  519. console.log(this.secondParams.contactMobile)
  520. this.$util.msg('请输入联系方式',2000);
  521. return
  522. }
  523. if(!$reg.isMobile(this.secondParams.contactMobile)){
  524. this.$util.msg('请填写正确的手机号',2000);
  525. return
  526. }
  527. if(this.userIdentity === 1){
  528. if(this.secondParams.dockingPeopleName == ''){
  529. this.$util.msg('请输入采美对接人姓名',2000);
  530. return
  531. }
  532. if(this.secondParams.dockingPeopleMobile == ''){
  533. this.$util.msg('请输入采美对接人手机号',2000);
  534. return
  535. }
  536. }
  537. if(this.secondParams.dockingPeopleMobile !=''){
  538. if(!$reg.isMobile(this.secondParams.dockingPeopleMobile)){
  539. this.$util.msg('请填写正确的采美对接人手机号',2000);
  540. return
  541. }
  542. }
  543. if(this.secondParams.townId == ''|| this.secondParams.townId == undefined){
  544. this.$util.msg('请完善联系地址',2000);
  545. return
  546. }
  547. if(this.secondParams.address == ''){
  548. this.$util.msg('请填写详细地址',2000);
  549. return
  550. }
  551. if(this.GoodsImagesList ==''){
  552. this.$util.msg('请上传图片',2000);
  553. return;
  554. }
  555. if(this.checkbox==false){
  556. this.$util.msg('请勾选已阅读',2000);
  557. return
  558. }
  559. console.log(this.secondParams)
  560. if(this.secondParams.authenticationImage == ''){
  561. this.PopupShow = true
  562. this.tipsContentText = '上传身份验证照片。您的二手商品将获得更好的推荐推荐和曝光,方便您快速卖出。'
  563. this.cancelButtonText = '继续发布'
  564. this.confirmButtonText = '去上传'
  565. this.isButtonsType = 1
  566. return;
  567. }
  568. if(this.secondParams.commitmentImage == '' || this.secondParams.ossName == ''){
  569. this.PopupShow = true
  570. this.tipsContentText = '上传二手出让承诺函。您的二手商品将获得更好的推荐推荐和曝光,方便您快速卖出。'
  571. this.cancelButtonText = '继续发布'
  572. this.confirmButtonText = '去上传'
  573. this.isButtonsType = 1
  574. return;
  575. }
  576. this.SecondHandProduct(this.secondParams)
  577. },
  578. SecondHandProduct(params){//提交发布
  579. this.SecondService.SecondHandProduct(params).then(res=>{
  580. this.PopupShow = true;
  581. this.tipsContentText = '发布二手商品,采美需要收取您每个商品100元的展示费,展示期为3个月支付完成后,商品会在1-2个工作日内进行审核,审核通过后,商品会立即上线'
  582. this.cancelButtonText = '取消发布'
  583. this.confirmButtonText = '去支付'
  584. this.isButtonsType = 2
  585. this.playid= res.data;
  586. }).catch(error =>{
  587. this.$util.msg(error.msg,2000)
  588. this.secondBj = false;
  589. return
  590. })
  591. },
  592. cancelButtonFn(){//弹窗操作按钮
  593. switch(this.isButtonsType){
  594. case 1:
  595. this.SecondHandProduct(this.secondParams)
  596. break;
  597. case 2:
  598. this.PopupShow = false;
  599. break;
  600. }
  601. },
  602. confirmButtonFn(){//弹窗操作按钮
  603. switch(this.isButtonsType){
  604. case 1:
  605. this.PopupShow = false;
  606. break;
  607. case 2:
  608. this.MiniWxPayFor()
  609. this.PopupShow = false;
  610. break;
  611. }
  612. },
  613. MiniWxPayFor(){
  614. authorize.getCode('weixin').then(wechatcode =>{
  615. let params ={
  616. code:wechatcode,
  617. productId:this.playid
  618. }
  619. this.PayService.SecondHandPay(params).then(response =>{
  620. let PayInfo = JSON.parse(response.data.data.payInfo);
  621. this.WxRequestPayment(PayInfo)
  622. }).catch(error =>{
  623. this.$util.msg(error.msg,2000)
  624. })
  625. })
  626. },
  627. WxRequestPayment(data){
  628. let self = this
  629. wx.requestPayment({
  630. 'timeStamp': data.timeStamp,
  631. 'nonceStr': data.nonceStr,
  632. 'package': data.package,
  633. 'signType': data.signType,
  634. 'paySign': data.paySign,
  635. 'success':function(res){
  636. wx.reLaunch({url: 'second/pages/product/product-list'});
  637. },
  638. 'fail':function(res){
  639. self.$util.msg('用户取消支付~')
  640. },
  641. 'complete':function(res){
  642. }
  643. })
  644. },
  645. changeBox:function () {
  646. this.checkbox = !this.checkbox;
  647. },
  648. },
  649. onShow() {
  650. this.SecondService.brandList().then(res =>{//品牌列表
  651. if(res.code == 0){
  652. this.BrandList = res.data;
  653. }
  654. })
  655. this.$api.getComStorage('userInfo').then((resolve) =>{
  656. this.userIdentity = resolve.userIdentity
  657. console.log(this.userIdentity)
  658. }).catch(error =>{
  659. console.log(error)
  660. })
  661. }
  662. }
  663. </script>
  664. <style lang="scss">
  665. view{font-size: 28rpx;}
  666. .my-maintenance{
  667. padding: 20rpx;
  668. }
  669. .bannerimg {
  670. height: 66rpx;
  671. width: 100%;
  672. }
  673. .bannerimg image{
  674. width: 100%;
  675. height: 100% ;
  676. }
  677. .newsTitle {
  678. line-height: 48rpx;
  679. text-align: left;
  680. color: #e15616;
  681. padding:20rpx;
  682. background-color: rgba(225, 86, 22, .1);
  683. }
  684. .nestext{
  685. font-size: 24rpx;
  686. }
  687. .secondradio view{
  688. display: inline-block;
  689. color: #333333;
  690. margin-right: 21rpx;
  691. }
  692. .secondradio{
  693. display: inline-block;
  694. margin-left: 40rpx;
  695. }
  696. .Secondary{
  697. margin-left: 96rpx;
  698. }
  699. .secondradio view.active {
  700. color: #e15616;
  701. }
  702. .placeholder{
  703. color: #b2b2b2;
  704. }
  705. .linqi_text {
  706. width: 607rpx;
  707. height: 68rpx;
  708. background-color: #1890f9;
  709. box-shadow: 0rpx 4rpx 6rpx 0rpx rgba(24, 144, 249, 0.17);
  710. text-align: center;
  711. line-height: 68rpx;
  712. color: #ffffff;
  713. margin: auto;
  714. font-size:24rpx;
  715. position: relative;
  716. }
  717. .jiaobiao {
  718. width: 0;
  719. height: 0;
  720. border-left: 20rpx solid transparent;
  721. border-right: 20rpx solid transparent;
  722. top: -25%;
  723. right: 40%;
  724. border-bottom: 20rpx solid #1890f9;
  725. position: absolute;
  726. }
  727. .label{
  728. color: #666666;
  729. display: inline-block;
  730. }
  731. .label-im{
  732. width: 100%;
  733. line-height: 50rpx;
  734. font-size: $font-size-28;
  735. color: #666666;
  736. text-align: left;
  737. margin-top: 20rpx;
  738. }
  739. .label-em{
  740. line-height: 28rpx;
  741. font-size: $font-size-20;
  742. color: #fea785;
  743. width: 100%;
  744. text-align: left;
  745. }
  746. .label.second{
  747. width: 155rpx;
  748. }
  749. .row .spacing.second{
  750. width: 70%;
  751. }
  752. .row{
  753. border-bottom: 2rpx solid #e1e1e1;
  754. line-height: 90rpx;
  755. height: auto;
  756. position: relative;
  757. &.none{
  758. border-bottom: none;
  759. }
  760. }
  761. .row.fenlei{
  762. height: auto;
  763. margin: 10rpx 0;
  764. border: 0;
  765. }
  766. .select {
  767. position: relative;
  768. color: #b2b2b2;
  769. text-align: left;
  770. user-select: none;
  771. }
  772. .row .spacing{
  773. display: inline-block;
  774. margin-left: 50rpx;
  775. width: 430rpx;
  776. vertical-align:middle;
  777. position: relative;
  778. &.file{
  779. width: 400rpx;
  780. }
  781. &.file-text{
  782. width: 400rpx;
  783. line-height: 44rpx;
  784. font-size: 28rpx;
  785. padding-right: 40rpx;
  786. box-sizing: border-box;
  787. .file-text-em{
  788. width: 400rpx;
  789. text-overflow: ellipsis;
  790. overflow: hidden;
  791. display: -webkit-box;
  792. -webkit-line-clamp: 1;
  793. line-clamp: 1;
  794. -webkit-box-orient: vertical;
  795. line-height: 44rpx;
  796. font-size: 28rpx;
  797. padding-right: 40rpx;
  798. box-sizing: border-box;
  799. position: relative;
  800. }
  801. .icon-shanchu1{
  802. width: 40rpx;
  803. height: 40rpx;
  804. line-height: 40rpx;
  805. display: block;
  806. position: absolute;
  807. top: 0;
  808. right:0;
  809. color: #f94b4b;
  810. font-size: 36rpx;
  811. }
  812. }
  813. &.file-none{
  814. width: 400rpx;
  815. position: relative;
  816. .file-none-button{
  817. width: 88rpx;
  818. height: 44rpx;
  819. background-color: #e15616;
  820. border-radius: 8rpx;
  821. line-height: 44rpx;
  822. text-align: center;
  823. font-size: 24rpx;
  824. color: #FFFFFF;
  825. position: absolute;
  826. right: 0;
  827. top: -15rpx;
  828. }
  829. }
  830. }
  831. .select .placeholder {
  832. position: relative;
  833. cursor: pointer;
  834. width: 100%;
  835. display: inline-block;
  836. }
  837. .icon-xiayibu{
  838. right: 0rpx;
  839. color: #b2b2b2;
  840. position: absolute;
  841. }
  842. .xiangliao{
  843. font-size: 26rpx;
  844. margin-right: 10rpx;
  845. color: #b2b2b2;
  846. }
  847. .icon-jiagexiangliao{
  848. color: #e15616 !important;
  849. }
  850. .pricecolor{
  851. margin-left: 10rpx;
  852. }
  853. .showflag{
  854. color: #b2b2b2;
  855. }
  856. .border-grey{
  857. width: 100%;
  858. resize: none;
  859. padding: 20rpx 0;
  860. height: 160rpx;
  861. border-bottom: 2rpx solid #e1e1e1;
  862. }
  863. .release-main-container {
  864. overflow: hidden;
  865. margin: 20rpx 0;
  866. }
  867. .uploadGoodsImages{
  868. display: flex;
  869. overflow-x: auto;
  870. overflow-y: hidden;
  871. }
  872. .secondradio{
  873. .row-radio{
  874. transform: scale(.8);
  875. }
  876. .row-input{margin-right: 10rpx;}
  877. }
  878. .linqi_text .p{
  879. font-size: $font-size-20;
  880. }
  881. .upload-file {
  882. float: left;
  883. margin: 20rpx 20rpx 20rpx 0px;
  884. cursor: pointer;
  885. width: 194rpx;
  886. height: 194rpx;
  887. border-radius: 6rpx;
  888. border: solid 2rpx #e1e1e1;
  889. flex-shrink: 0;
  890. position: relative;
  891. display: inline-block;
  892. }
  893. .input-file {
  894. width: 194rpx;
  895. height: 194rpx;
  896. opacity: 0;
  897. cursor: pointer;
  898. position: absolute;
  899. }
  900. .add-text {
  901. font-size: 26rpx;
  902. color: #333330;
  903. opacity: 0.5;
  904. position: absolute;
  905. top: 55%;
  906. right:24%;
  907. }
  908. .upload-img {
  909. width: 100%;
  910. height: 100%;
  911. display: block;
  912. border-radius: .53vw;
  913. }
  914. .icon-shangchuantupian{
  915. width: 46rpx;
  916. height: 46rpx;
  917. color: #b2b2b2;
  918. font-size: 18px;
  919. position: absolute;
  920. top: 30%;
  921. left: 40%;
  922. }
  923. .icon-shanchu1{
  924. width: 40rpx;
  925. height: 40rpx;
  926. line-height: 40rpx;
  927. display: block;
  928. position: absolute;
  929. top: -15rpx;
  930. right:-18rpx;
  931. color: #f94b4b;
  932. font-size: 36rpx;
  933. }
  934. .wen-tips {
  935. width: 664rpx;
  936. height: 68rpx;
  937. line-height: 68rpx;
  938. text-align: center;
  939. color: #FFF;
  940. font-size: 20rpx;
  941. background-color: #1890f9;
  942. box-shadow: 0 0.8vw 1.6vw 0 rgba(24, 144, 249, 0.17);
  943. border-radius: 2rpx;
  944. display: none;
  945. }
  946. .form-upload-tips:hover .wen-tips {
  947. display: block;
  948. }
  949. .textarea-wrapper {
  950. letter-spacing: 2rpx;
  951. line-height: 48rpx;
  952. color: #333333;
  953. position: relative;
  954. font-size: 28rpx;
  955. border: 2rpx solid #b2b2b2;
  956. height: 300rpx;
  957. padding: 16rpx;
  958. border-radius: 6rpx;
  959. margin: 20rpx 0;
  960. }
  961. .textarea-wrapper textarea{
  962. width: 100%;
  963. }
  964. .word-limit {
  965. position: absolute;
  966. right: 2.7vw;
  967. bottom: 2.7vw;
  968. font-size: 3.2vw;
  969. color: #9aa5b5;
  970. }
  971. .smText{
  972. color: #999999;
  973. text-align: left;
  974. line-height: 42rpx;
  975. font-size: 24rpx;
  976. margin-top: 10rpx;
  977. width: 100%;
  978. height: 260rpx;
  979. }
  980. .BtnAll{
  981. width: 100%;
  982. margin-bottom: 20rpx;
  983. .btn-submit{
  984. width: 600rpx;
  985. height: 90rpx;
  986. margin: auto;
  987. text-align: center;
  988. line-height: 90rpx;
  989. color: #fff;
  990. background-image: linear-gradient(315deg,
  991. #f28f31 0%,
  992. #e15616 100%);
  993. border-radius: 90rpx;
  994. font-size: 30rpx;
  995. }
  996. }
  997. .row.Read{
  998. border: 0;
  999. text-align: center;
  1000. color: #999999;
  1001. }
  1002. .thebj {
  1003. position: fixed;
  1004. left: 0;
  1005. top: 0;
  1006. bottom: 0;
  1007. width: 100%;
  1008. height: 100%;
  1009. background-color: rgba(0, 0, 0, .5);
  1010. z-index: 999999;
  1011. opacity: 0;
  1012. }
  1013. .thebj.show{
  1014. opacity: 1;
  1015. }
  1016. .theresult {
  1017. position: absolute;
  1018. top: 50%;
  1019. left: 50%;
  1020. transform: translate(-50%, -50%);
  1021. width:580rpx;
  1022. background-color: #fff;
  1023. border-radius: 32rpx;
  1024. }
  1025. .theresult .title{
  1026. line-height: 100rpx;
  1027. text-align: center;
  1028. display: block;
  1029. color: #333333;
  1030. font-size: 30rpx;
  1031. font-weight: bold;
  1032. border-bottom: 2rpx solid #efefef;
  1033. }
  1034. .theresult .content{
  1035. padding: 30rpx 52rpx;
  1036. line-height: 48rpx;
  1037. color: #666666;
  1038. font-size: 30rpx;
  1039. display: block;
  1040. }
  1041. .paybtn{
  1042. width: 100%;
  1043. height: 90rpx;
  1044. float: left;
  1045. .btn{
  1046. width: 50%;
  1047. height: 90rpx;
  1048. text-align: center;
  1049. line-height: 90rpx;
  1050. font-size: 30rpx;
  1051. display: inline-block;
  1052. float: left;
  1053. &.cancel{
  1054. background-color: #efefef;
  1055. border-radius: 0rpx 0rpx 0rpx 32rpx;
  1056. color: #999999;
  1057. }
  1058. &.confirm{
  1059. background-image: linear-gradient(270deg, #f28f31 0%, #e15616 100%);
  1060. border-radius: 0rpx 0rpx 32rpx 0rpx;
  1061. color: #fff;
  1062. }
  1063. }
  1064. }
  1065. .icon-wenhao{
  1066. color: #1890f9;
  1067. font-size: 35rpx;
  1068. width: 50rpx;
  1069. }
  1070. .form-upload-tips:hover .wen-tips {display: block;}
  1071. .tui-popup-box {
  1072. z-index: 22;
  1073. width: 702rpx;
  1074. padding: 24rpx 24rpx 36rpx 24rpx;
  1075. height: 670rpx;
  1076. position: relative;
  1077. .icon-iconfontguanbi{
  1078. font-size: 40rpx;
  1079. color: #b2b2b2;
  1080. width: 60rpx;
  1081. float: right;
  1082. display: block;
  1083. }
  1084. .content{
  1085. .freight-radio{
  1086. height: 66rpx;
  1087. line-height: 66rpx;
  1088. padding: 0 35rpx;
  1089. .row-group{
  1090. width: 100%;
  1091. // max-height: 605rpx;
  1092. // overflow: auto;
  1093. }
  1094. .row-input{
  1095. height: 66rpx;
  1096. line-height: 66rpx;
  1097. width: 100%;
  1098. display: block;
  1099. }
  1100. .row-radio{
  1101. float: right;
  1102. transform: scale(0.9);
  1103. color: #b2b2b2;
  1104. }
  1105. .row-text{
  1106. font-size: $font-size-28;
  1107. color: #666666;
  1108. float: left;
  1109. }
  1110. }
  1111. }
  1112. }
  1113. checkbox .wx-checkbox-input{
  1114. border-radius: 50%;
  1115. }
  1116. .row-check{
  1117. transform: scale(0.8);
  1118. }
  1119. checkbox .wx-checkbox-input.wx-checkbox-input-checked{
  1120. background: #E15616;
  1121. border: 2rpx solid #e15616;
  1122. }
  1123. checkbox .wx-checkbox-input.wx-checkbox-input-checked::before{
  1124. border-radius: 50%;
  1125. border: 2rpx solid #e15616;
  1126. width: 34rpx;
  1127. height: 34rpx;
  1128. line-height: 34rpx;
  1129. text-align: center;
  1130. font-size:34rpx;
  1131. color:#fff;
  1132. background: transparent;
  1133. transform:translate(-50%, -50%) scale(.8);
  1134. -webkit-transform:translate(-50%, -50%) scale(.8);
  1135. }
  1136. </style>