|
@@ -0,0 +1,230 @@
|
|
|
+<template>
|
|
|
+ <view >
|
|
|
+ <u-navbar title="免费安桩"></u-navbar>
|
|
|
+ <view class="main">
|
|
|
+ <view class="text">
|
|
|
+ 为响应政府号召,积极推动充电桩普及,“51充电联盟”现面向公共停车场、私家车位提供“免费安桩”服务,有意加盟“51充电联盟”的机构和个人,均可申请免费安装电动汽车/摩托车/自行车充电桩,在平台的运营支持下,共享风口红利。
|
|
|
+ </view>
|
|
|
+ <view class="suited">
|
|
|
+ <p class="title">适合对象 :</p>
|
|
|
+ <view class="content">
|
|
|
+ <p>1.停车场、停车棚</p>
|
|
|
+ <view class="suited-text">
|
|
|
+ 商超、小区、园区、医院等停车场。通过经营充电业务开源增收。
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="content">
|
|
|
+ <p>2.私人车位所有者</p>
|
|
|
+ <view class="suited-text">
|
|
|
+ 可通过共享车位空闲时段,为他人提供充电便利获取被动收入。
|
|
|
+ </view>
|
|
|
+ </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 wantList" :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
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ wantList: [
|
|
|
+ {
|
|
|
+ name: '电动汽车充电桩',
|
|
|
+ checked: false,
|
|
|
+ disabled: false
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '电动摩托/自行车充电桩',
|
|
|
+ checked: false,
|
|
|
+ disabled: false
|
|
|
+ },
|
|
|
+
|
|
|
+ ]
|
|
|
+
|
|
|
+
|
|
|
+ };
|
|
|
+
|
|
|
+ },
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style>
|
|
|
+ page{
|
|
|
+ background-color: #00b962;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+
|
|
|
+<style lang="scss" scoped>
|
|
|
+ .main{
|
|
|
+ padding: 36px 28px 85px;
|
|
|
+ .text{
|
|
|
+ color: rgba(255, 255, 255, 100);
|
|
|
+ font-size: 18px;
|
|
|
+ text-align: justify;
|
|
|
+
|
|
|
+ }
|
|
|
+ .suited{
|
|
|
+ background-color: #fff;
|
|
|
+ margin-top: 24px;
|
|
|
+ padding: 24px;
|
|
|
+ border-radius: 16px;
|
|
|
+ .title{
|
|
|
+ height: 18px;
|
|
|
+ color: rgba(16, 16, 16, 100);
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ .content{
|
|
|
+ margin-top: 12px;
|
|
|
+ p{
|
|
|
+ font-weight: 550;
|
|
|
+ font-size: 14px
|
|
|
+ }
|
|
|
+ .suited-text{
|
|
|
+ margin-top: 10px;
|
|
|
+ line-height: 20px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ .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{
|
|
|
+ width: 50% !important;
|
|
|
+ margin-top: 4px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ }
|
|
|
+ .want{
|
|
|
+ /deep/.u-checkbox{
|
|
|
+ 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>
|