introduce.vue 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314
  1. <template name="fleaMarket">
  2. <view class="fleaMarket">
  3. <view class="second-hand-wrapper">
  4. <view class="top_title">
  5. <view ><image src="https://static.caimei365.com/app/img/icon/icon-logo2.png" mode=""></image></view>
  6. <view class="right-title">
  7. <text class="right-one">二手市场</text>
  8. <text class="right-two">SECOND-HANDMARKET</text>
  9. </view>
  10. </view>
  11. <view class="top_text">
  12. 质量好一点,效率高一点
  13. </view>
  14. <view class="mian_text">
  15. <view class="main-title">采美二手市场介绍<view class="yellow_icon"></view></view>
  16. <span>
  17. 现实生活中,二手商品越来越经济实惠,二手商品也在多个经济生活领域出现。
  18. 面对潜力巨大的二手市场,采美365网于2019年开办美容行业二手交易版块,搭建二手交易平台,
  19. 将拥有闲置商品卖家与求购方(买家)信息集中起来,让交易双方的买卖信息传播得更广泛,交易更有保障。
  20. </span>
  21. </view>
  22. <view class="mian_content top">
  23. <text class="big-title">二手平台运营特色</text><view class="yellow_icon"></view>
  24. <view class="font_content">
  25. <view class="content_list">
  26. <view class="content-title">1.自运营</view>
  27. <text class="content-text">用户自主上传二手商品信息,自主销售,平台提供商品展示位以及商品信息介绍页面,类似“闲鱼”。</text>
  28. </view>
  29. <view class="content_list">
  30. <view class="content-title"> 2.代运营</view>
  31. <text class="content-text">由平台协助销售二手商品,为用户提供贴心且必要的推广辅助,促成交易。</text>
  32. </view>
  33. <view class="content_list">
  34. <view class="content-title">3.第三方服务</view>
  35. <text class="content-text">平台提供第三方服务,如申请第三方评测、延保、维修等,一方面更客观全面展示仪器细节,另一方面,便于仪器机能维护,方便维修等。</text>
  36. </view>
  37. <view class="content_list">
  38. <view class="content-title">4.套餐服务</view>
  39. <text class="content-text">多项组合套餐式服务,满足卖家个性化推广需求。</text>
  40. </view>
  41. <view class="tishiyu">转让方/出售方(以下统称为“卖家”)需上传个人真实信息,平台留存备案后,卖家通过平台专属页面上传需要出售的商品信息,(按后台系统要求填写)。</view>
  42. </view>
  43. </view>
  44. <view class="mian_content">
  45. <text class="big-title">合作模式</text><view class="yellow_icon y m" ></view>
  46. <view class="font_content">
  47. <view class="twobuy">成为自由卖家:二手出售方</view>
  48. <view class="content_list">
  49. <view class="content-title">1.自主发布</view>
  50. <text class="content-text">平台已拥有独立上传信息页面,卖家可进入页面或者通过链接自主上传商品信息,获得在平台二手版块展示机会。平台收取展示位费用,详见第2条</text>
  51. </view>
  52. <view class="content_list">
  53. <view class="content_list">2.自主发布</view>
  54. <text class="content-text"> 卖家每上传一款商品,占据一个展示位,<text class="bluefont">平台收取每款商品100元的展示费用 ,有效期为<text style="font-size: 48px">6</text>个月</text>
  55. 平台提供与该商品匹配的详情信息以及文章信息,降低买家决策成本,以促进销售。特殊政策除外(如特定免费时段)。</text>
  56. </view>
  57. <view class="content_list">
  58. <view class="content-title">3.平台推广服务(代运营)</view>
  59. <text class="content-text"> 卖家如需采美平台提供个性化推广服务,以帮助达成交易 ,平台收取一定服务费或佣金。</text>
  60. </view>
  61. <view class="content_list">
  62. <view class="content-title">4.第三方检测、维修、延保服务</view>
  63. <text class="content-text"> 平台收取服务佣金。 </text>
  64. </view>
  65. <view class="content_list">
  66. <view class="content-title">5.套餐服务</view>
  67. <text class="content-text">多项组合服务。</text>
  68. </view>
  69. </view>
  70. </view >
  71. <view class="mian_content">
  72. <text class="big-title">交易流程</text><view class="yellow_icon y m" ></view>
  73. <view class="font_content">
  74. <view class="content_list">
  75. <view class="content-text">随着越来越多机构青睐性价比高的二手设备,采美二手市场也越来越火热,为了保障买卖双方利益和资金交易安全,
  76. 采美现将二手仪器交易的流程更加规范化,以促进二手市场的健康发展。</view>
  77. </view>
  78. <view class="threebuy">此流程适用于10万以下的设备,10万以上二手设备交易请联系高先生。</view>
  79. <view class="jioayi">具体的流程如下:</view>
  80. <image src="https://admin-b.caimei365.com/userfiles/1/images/photo/2020/11/intro.png" mode="" class="jiaoyi_img"></image>
  81. </view>
  82. </view>
  83. <view class="second-hand-btn" >
  84. <view class="button" @click.stop="gotoform">去发布</view>
  85. <view class="button" @click.stop="gotolist">逛二手市场</view>
  86. <view class="button" @click="gotorepair">去维修</view>
  87. <view class="button" @click="this.$api.switchTabTo('/pages/tabBar/home/index')">去首页</view>
  88. <view class="foot_font">
  89. <view style="color: #ADADAD"> 业务咨询/合作请联系:<label style="color: #666666;margin-right: 10rpx"> 0755-22907771 </label></view>
  90. <view style="color: #ADADAD;">手机:<label style="color: #666666">15817465281</label></view>
  91. </view>
  92. </view>
  93. </view>
  94. </view>
  95. </template>
  96. <script>
  97. export default{
  98. name:'fleaMarket',
  99. components:{
  100. },
  101. methods:{
  102. gotoform:function(){
  103. this.$api.navigateTo('/second/pages/form/form');
  104. },
  105. gotolist:function(){
  106. this.$api.navigateTo('/second/pages/product/product-list');
  107. },
  108. gotorepair:function(){
  109. this.$api.navigateTo('/h5/pages/article/page?linkType=7');
  110. },
  111. },
  112. }
  113. </script>
  114. <style lang="scss">
  115. page{
  116. position: relative;
  117. margin: 40rpx auto 0;
  118. }
  119. .fleaMarket{
  120. padding:20rpx;
  121. background-image: linear-gradient(#FF7676, #E15616);
  122. }
  123. .second-hand-wrapper {
  124. background-image: url("https://static.caimei365.com/app/img/bg/bg22.png");
  125. background-position: 50% 9%;
  126. background-repeat: no-repeat;
  127. background-size: 100%;
  128. image{
  129. width: 100%;
  130. display: block;
  131. margin: 20rpx auto 0;
  132. height: 800rpx;
  133. }
  134. .big-title{
  135. color: #FFFFFF;
  136. letter-spacing: 4rpx;
  137. }
  138. }
  139. .second-hand-btn {
  140. .button{
  141. width: 280rpx;
  142. height: 90rpx;
  143. background: linear-gradient(225deg,rgba(255,107,107,1) 0%,rgba(247,76,0,1) 100%);
  144. border-radius: 30rpx;
  145. color: #fff;
  146. border: none;
  147. font-size: 27rpx;
  148. outline: none;
  149. margin-bottom:20rpx;
  150. margin-right: 20rpx;
  151. line-height: 90rpx;
  152. display: inline-block
  153. }
  154. }
  155. .second-hand-btn {
  156. position: relative;
  157. background: #FFFFFF;
  158. border-radius: 30rpx;
  159. margin-top: 30rpx;
  160. padding:40rpx 22.5rpx 37.5rpx 30rpx;
  161. margin-bottom: 15rpx;
  162. border-bottom: 9rpx solid #f1ac90;
  163. border-right: 9rpx solid #f1ac90;
  164. text-align: center;
  165. }
  166. .top_title{
  167. padding: 40rpx 0 40rpx 0;
  168. text-align: center;
  169. .right-one{
  170. letter-spacing: 12rpx;
  171. font-size: 40rpx;
  172. font-weight: bold;
  173. color: #FFFFFF;
  174. letter-spacing: 4rpx;
  175. }
  176. .right-two{
  177. color: #FFFFFF;
  178. font-size: 20rpx;
  179. display: block;
  180. }
  181. image{
  182. width: 100%;
  183. height: 100%;
  184. }
  185. }
  186. .top_text{
  187. font-size: 60rpx;
  188. color: #FFFFFF;
  189. font-style: oblique;
  190. font-weight: bold;
  191. margin-top:40rpx;
  192. text-align: center;
  193. }
  194. .mian_text{
  195. margin-top: 75rpx;
  196. color: #FFFFFF;
  197. font-size: 22rpx;
  198. padding: 0 30rpx 0 30rpx;
  199. line-height: 40rpx;
  200. letter-spacing: 4rpx;
  201. .main-title{
  202. font-size:36rpx;
  203. font-weight: bold;
  204. padding-bottom: 37.5rpx;
  205. }
  206. }
  207. .mian_content{
  208. margin-top: 80rpx;
  209. .big-title{
  210. font-size: 36rpx;
  211. font-weight: bold;
  212. }
  213. &.top{
  214. margin-top: 500rpx;
  215. }
  216. }
  217. .font_content{
  218. background: #FFFFFF;
  219. border-radius:37.5rpx;
  220. margin-top: 30rpx;
  221. padding:18.5rpx;
  222. font-weight: 400;
  223. line-height: 45rpx;
  224. color: rgba(109,114,120,1);
  225. opacity: 1;
  226. position: relative;
  227. border-bottom:9.75rpx solid #f1ac90;
  228. border-right: 9.75rpx solid #f1ac90;
  229. }
  230. .content_list{
  231. margin-bottom: 37.5rpx;
  232. .content-title{
  233. font-size:30rpx;
  234. font-family:Source Han Sans CN;
  235. }
  236. .content-text{
  237. font-size: 22rpx;
  238. }
  239. }
  240. .tishiyu{
  241. background: #FFF8F8;
  242. font-size:24rpx;
  243. font-family: Source Han Sans CN;
  244. font-weight: 400;
  245. line-height: 40rpx;
  246. color: #FF7354;
  247. opacity: 1;
  248. padding: 18rpx;
  249. border-radius: 20rpx
  250. }
  251. .twobuy{
  252. background: #EF5C3C;
  253. border-radius: 15rpx;
  254. font-size: 26rpx;
  255. font-family: AlibabaPuHuiTiB;
  256. opacity: 1;
  257. padding: 6rpx;
  258. color: #FFFFFF;
  259. margin-bottom: 19.5rpx;
  260. text-align: center;
  261. width: 360rpx;
  262. }
  263. .threebuy{
  264. background: #EF5C3C;
  265. border-radius: 9.75rpx;
  266. font-size: 27.7rpx;
  267. color: #fff;
  268. padding: 6rpx;
  269. margin-bottom: 37.5rpx;
  270. }
  271. .bluefont{
  272. font-size: 24rpx !important;
  273. color: #0091FF;
  274. }
  275. .foot_font{
  276. text-align: center;
  277. font-size: 34rpx;
  278. line-height: 52rpx;
  279. }
  280. .yellow_icon{
  281. width: 315rpx;
  282. height: 22.5rpx;
  283. background: rgba(250,185,0,1);
  284. opacity: 1;
  285. margin-top: -22.5rpx;
  286. }
  287. .yellow_icon.m{
  288. width: 160rpx;
  289. }
  290. .top_title view{
  291. display: inline-block;
  292. }
  293. .jiaoyi{
  294. font-size:24rpx;
  295. }
  296. .jiaoyi_pimg{
  297. display: none !important;
  298. }
  299. .top_title view:nth-child(1){
  300. // margin-right: 20rpx;
  301. width: 104rpx;
  302. height: 92rpx;
  303. }
  304. .right-title{
  305. width: 250rpx;
  306. }
  307. </style>