|
|
@@ -0,0 +1,245 @@
|
|
|
+<template>
|
|
|
+ <view>
|
|
|
+ <u-navbar title="我要加盟"></u-navbar>
|
|
|
+ <!-- <view class="head">
|
|
|
+
|
|
|
+ <img src="/static/img/earth_@2.png" alt="">
|
|
|
+
|
|
|
+ </view> -->
|
|
|
+ <view class="main">
|
|
|
+ <view class="main-content">
|
|
|
+ <p class="title">适合对象</p>
|
|
|
+ <view class="text">
|
|
|
+ 已经在经营充电桩业务的商家，可以申请加入“<text style="color: #e14173;">51充电联盟</text>”。
|
|
|
+ </view>
|
|
|
+ <p class="title">平台能为您提供：</p>
|
|
|
+ <view class="text-box">
|
|
|
+ <p>1.便捷的找桩、充电服务，提升用户体验。</p>
|
|
|
+ <p>2.获得更多的用户资源和运营支持，提高市场竞争力。</p>
|
|
|
+ <p>3.良好的平台背书,提高公信力</p>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="application-form ">
|
|
|
+ <view class="name">
|
|
|
+ <p>申请人姓名</p>
|
|
|
+ <u-input placeholder=""></u-input>
|
|
|
+ </view>
|
|
|
+ <view class="tel">
|
|
|
+ <p>联系电话</p>
|
|
|
+ <u-input placeholder=""></u-input>
|
|
|
+ </view>
|
|
|
+ <view class="place">
|
|
|
+ <p>自有电桩地点</p>
|
|
|
+ <textarea class="textarea" placeholder="填写详细位置"></textarea>
|
|
|
+ </view>
|
|
|
+ <view class="type">
|
|
|
+ <p>场地类型</p>
|
|
|
+ <view class="checkbox">
|
|
|
+ <view class="">
|
|
|
+ <u-checkbox-group @change="checkboxGroupChange" active-color="#00B962">
|
|
|
+ <u-checkbox
|
|
|
+ @change="checkboxChange"
|
|
|
+ v-model="item.checked"
|
|
|
+ v-for="(item, index) in typeList" :key="index"
|
|
|
+ :name="item.name"
|
|
|
+ >{{item.name}}</u-checkbox>
|
|
|
+ </u-checkbox-group>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="want">
|
|
|
+ <p>自由电桩数量</p>
|
|
|
+ <view class="checkbox">
|
|
|
+ <view class="">
|
|
|
+ <u-checkbox-group @change="checkboxGroupChange" active-color="#00B962">
|
|
|
+ <u-checkbox
|
|
|
+ @change="checkboxChange"
|
|
|
+ v-model="item.checked"
|
|
|
+ v-for="(item, index) in numList" :key="index"
|
|
|
+ :name="item.name"
|
|
|
+ >{{item.name}}</u-checkbox>
|
|
|
+ </u-checkbox-group>
|
|
|
+
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="hint">
|
|
|
+ *请保持手机畅通，我们将安排专人与您联系。您也可以拨打
|
|
|
+ <text class="tel-num">400-8899-619</text>查询申请审核进度！
|
|
|
+ </view>
|
|
|
+ <u-button type="warning">提交申请</u-button>
|
|
|
+ </view>
|
|
|
+
|
|
|
+
|
|
|
+ </view>
|
|
|
+
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default{
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ typeList: [
|
|
|
+ {
|
|
|
+ name: '电动汽车充电桩（快充）',
|
|
|
+ checked: false,
|
|
|
+ disabled: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '电动汽车充电桩（慢充）',
|
|
|
+ checked: false,
|
|
|
+ disabled: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '电动摩托/自行车充电桩',
|
|
|
+ checked: false,
|
|
|
+ disabled: false
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ numList: [
|
|
|
+ {
|
|
|
+ name: '5台以内',
|
|
|
+ checked: false,
|
|
|
+ disabled: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '5~10台',
|
|
|
+ checked: false,
|
|
|
+ disabled: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '10台以上',
|
|
|
+ checked: false,
|
|
|
+ disabled: false
|
|
|
+ },
|
|
|
+ ]
|
|
|
+
|
|
|
+
|
|
|
+ };
|
|
|
+
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ page {
|
|
|
+
|
|
|
+ background:url(../../static/img/earth_@2.png) no-repeat top center #00b962 ;
|
|
|
+ background-size: 100%;
|
|
|
+ background-position: 50% 4%
|
|
|
+ }
|
|
|
+</style>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .head {
|
|
|
+ img {
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .main {
|
|
|
+ width: 100%;
|
|
|
+ margin-top: 131px;
|
|
|
+ line-height: 20px;
|
|
|
+ border-radius: 16px;
|
|
|
+
|
|
|
+ padding: 0 28px 85px;
|
|
|
+
|
|
|
+ .main-content {
|
|
|
+ padding:24px 24px;
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 16px;
|
|
|
+ .title{
|
|
|
+ height: 18px;
|
|
|
+ color: rgba(16, 16, 16, 100);
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 600;
|
|
|
+
|
|
|
+ }
|
|
|
+ .text{
|
|
|
+ margin-top: 12px;
|
|
|
+ margin-bottom: 24px;
|
|
|
+ }
|
|
|
+ .text-box{
|
|
|
+ margin-top: 12px;
|
|
|
+ p{
|
|
|
+ margin-top: 10px;
|
|
|
+ line-height: 24px;
|
|
|
+ text-align: justify;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .application-form{
|
|
|
+ background-color: #fff;
|
|
|
+ border-radius: 16px;
|
|
|
+ margin-top: 24px;
|
|
|
+ padding: 24px;
|
|
|
+ .u-input{
|
|
|
+ border-radius: 50px;
|
|
|
+ background-color: rgba(232, 236, 234, 100);
|
|
|
+ margin-top: 12px;
|
|
|
+
|
|
|
+ }
|
|
|
+ /deep/.uni-input-input{
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ p{
|
|
|
+ height: 18px;
|
|
|
+ line-height: 18px;
|
|
|
+ color: rgba(16, 16, 16, 100);
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tel,.place,.type,.want{
|
|
|
+ margin-top: 24px;
|
|
|
+ }
|
|
|
+ .textarea{
|
|
|
+ width: 72.2vw;
|
|
|
+ height: 100px;
|
|
|
+ border-radius: 22px;
|
|
|
+ background-color: rgba(232, 236, 234, 100);
|
|
|
+ margin-top: 12px;
|
|
|
+ .uni-textarea-placeholder{
|
|
|
+ padding: 12px;
|
|
|
+ }
|
|
|
+ /deep/.uni-textarea-textarea{
|
|
|
+ margin: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .type{
|
|
|
+ .checkbox{
|
|
|
+ margin-top: 12px;
|
|
|
+ /deep/.u-checkbox{
|
|
|
+
|
|
|
+ margin-top: 4px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .want{
|
|
|
+ /deep/.u-checkbox{
|
|
|
+ width: 50% !important;
|
|
|
+ margin-top: 8px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .hint{
|
|
|
+ margin-top: 12px;
|
|
|
+
|
|
|
+ font-size: 14px;
|
|
|
+ line-height: 20px;
|
|
|
+ text-align: justify;
|
|
|
+ .tel-num{
|
|
|
+ color: #9FC7FF;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ /deep/.u-btn{
|
|
|
+ border-radius: 50px ;
|
|
|
+ margin-top: 24px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+</style>
|
