|
@@ -2,30 +2,72 @@
|
|
|
<view class="center">
|
|
|
<u-form>
|
|
|
<view class="modular">
|
|
|
- <u-form-item label="公司名称" label-width="30%" class="title Regular">
|
|
|
+ <u-form-item label="公司名称" label-width="30%" class="title Medium" :border-bottom="topBorder">
|
|
|
<u-input v-model="deptList.name" input-align="right" class="write Regular" placeholder="请输入公司名称" />
|
|
|
</u-form-item>
|
|
|
</view>
|
|
|
<view class="modular">
|
|
|
- <view class="title Regular">企业概况</view>
|
|
|
- <textarea value="" placeholder="请输入企业概况,如经营项目、产品类型、企业规模等,不超过300个字" class="areaText Regular" v-model="deptList.a"/>
|
|
|
- <view class="title Regular">添加标签(标签应突出企业特色,最多6个)</view>
|
|
|
- <view class="flex">
|
|
|
-
|
|
|
-
|
|
|
+ <view class="title Medium">企业概况</view>
|
|
|
+ <!-- <u-input v-model="value" :type="type" :height="height" :auto-height="autoHeight" placeholder="请输入企业概况,如经营项目、产品类型、企业规模等,不超过300个字" /> -->
|
|
|
+ <textarea value="" placeholder="请输入企业概况,如经营项目、产品类型、企业规模等,不超过300个字" class="areaText Regular"
|
|
|
+ v-model="deptList.a" placeholder-style="color:#AFB3BF"/>
|
|
|
+ <view class="title Regular">添加标签(标签应突出企业特色,最多6个)</view>
|
|
|
+ <view class="flex" style="width: 100%;">
|
|
|
<view class="forLists" v-for="(item,index) in label" :Key="index">
|
|
|
- <u-tag :text="item" mode="dark" class="forList Medium" shape="circle" :show="show" :closeable="closeable" color="#22C572" @close="closeForList(index)"/>
|
|
|
-
|
|
|
+ <u-tag :text="item" mode="dark" class="forList Medium" shape="circle" :show="show"
|
|
|
+ :closeable="closeable" color="#22C572" @close="closeForList(index)" />
|
|
|
</view>
|
|
|
- <u-tag text="+" mode="plain" shape="circle" :show="show1" color="#2E2E2D" bg-color="#FFFFFF" border-color="#F9F9FA" class="add" @click="add"></u-tag>
|
|
|
- </view>
|
|
|
- <view class="addinput flex" v-if="inputShow">
|
|
|
- <u-input v-model="value" type="type" border focus v-if="inputShow" style="border-radius: 50rpx;line-height: 70rpx;font-size: 10px;" placeholder="请输入标签内容,不超过6个字" />
|
|
|
- <u-button :type="types" class="inputOk" shape="circle" @click="addinput">确定</u-button>
|
|
|
- </view>
|
|
|
-
|
|
|
+ <u-tag text="+" mode="plain" shape="circle" :show="show1" color="#2E2E2D" bg-color="#FFFFFF"
|
|
|
+ border-color="#F9F9FA" class="add" @click="add"></u-tag>
|
|
|
+ </view>
|
|
|
+ <view class="addinput flex" v-if="inputShow">
|
|
|
+ <u-input v-model="value" type="type" border focus v-if="inputShow"
|
|
|
+ style="border-radius: 50rpx;line-height: 70rpx;font-size: 10px;" placeholder="请输入标签内容,不超过6个字" />
|
|
|
+ <u-button :type="types" class="inputOk" shape="circle" @click="addinput">确定</u-button>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="modular">
|
|
|
+ <view class="title Regular">场地照片(图片清晰,最多9张)</view>
|
|
|
+ <u-upload :action="action" :file-list="fileList" @on-success="uploadSuccess" @on-remove="imgRemove"
|
|
|
+ :max-count="9"></u-upload>
|
|
|
+ </view>
|
|
|
+ <view class="modular">
|
|
|
+ <view class="title Medium">联系方式</view>
|
|
|
+ <view v-for="(item,index) in Persons">
|
|
|
+ <view class="information flex">
|
|
|
+ <view class="xinxi">
|
|
|
+ <u-form-item label="姓名" label-width="30%" class="Regular" label-position="top"
|
|
|
+ style="font-size: 28rpx; color: #71747C;" :border-bottom="topBorder">
|
|
|
+ <u-input v-model="item.name" class="Regular" placeholder="请输入姓名" />
|
|
|
+ </u-form-item>
|
|
|
+ </view>
|
|
|
+ <view class="xinxi">
|
|
|
+ <u-form-item label="电话" label-width="30%" class="Regular" label-position="top"
|
|
|
+ style="font-size: 28rpx; color: #71747C;" :border-bottom="topBorder">
|
|
|
+ <u-input v-model="item.phone" class="Regular" placeholder="请输入电话" />
|
|
|
+ </u-form-item>
|
|
|
+ </view>
|
|
|
+ <div class="del" @click="delPerson(index)">
|
|
|
+ <span style="font-size: 46rpx; color: #22C572;">×</span>
|
|
|
+ </div>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="addPerson" @click="addPerson">
|
|
|
+ <image src="../../static/img/liangmai/jia@3x.png" mode=""
|
|
|
+ style="width: 26rpx;height: 26rpx;top: 2rpx;"></image>
|
|
|
+ 添加联系人
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="modular">
|
|
|
+ <u-form-item label="邮箱" label-width="30%" class="title Regular">
|
|
|
+ <u-input v-model="deptList.name" input-align="right" class="write Regular" placeholder="请输入电子邮箱" />
|
|
|
+ </u-form-item>
|
|
|
+ <u-form-item label="传真" label-width="30%" class="title Regular" :border-bottom="topBorder">
|
|
|
+ <u-input v-model="deptList.name" input-align="right" class="write Regular" placeholder="请输入传真号" />
|
|
|
+ </u-form-item>
|
|
|
</view>
|
|
|
</u-form>
|
|
|
+ <u-button type="success" shape="circle" style="margin-top: 20rpx;" @click="submit">提交</u-button>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
@@ -34,32 +76,73 @@
|
|
|
data() {
|
|
|
return {
|
|
|
deptList: {},
|
|
|
- label:["世界一流"],
|
|
|
- closeable:true,
|
|
|
- show:true,
|
|
|
- show1:true,
|
|
|
- types:"",
|
|
|
- inputShow:false,
|
|
|
- value:"",
|
|
|
+ label: ["世界一流", "世界500强"],
|
|
|
+ closeable: true,
|
|
|
+ show: true,
|
|
|
+ show1: true,
|
|
|
+ types: "",
|
|
|
+ inputShow: false,
|
|
|
+ value: "", //临时标签内容字段 后期更换
|
|
|
+ action: 'https://www.zthymaoyi.com/upload/admin',
|
|
|
+ fileList: [],
|
|
|
+ imgList: [],
|
|
|
+ Persons: [{
|
|
|
+ name: "张良",
|
|
|
+ phone: "1365411111"
|
|
|
+ }],
|
|
|
+ topBorder: false,
|
|
|
}
|
|
|
},
|
|
|
- methods:{
|
|
|
- add(){
|
|
|
- if(this.label.length >= 6){
|
|
|
+ methods: {
|
|
|
+ add() {
|
|
|
+ if (this.label.length >= 6) {
|
|
|
this.inputShow = false
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
this.inputShow = true
|
|
|
}
|
|
|
-
|
|
|
},
|
|
|
- addinput(){
|
|
|
+ addinput() {
|
|
|
+ if (!this.value) {
|
|
|
+ this.$api.msg('标签内容不能为空')
|
|
|
+ return
|
|
|
+ }
|
|
|
+ if (this.value.length < 2 || this.value.length > 6) {
|
|
|
+ this.$api.msg('标签内容输入有误')
|
|
|
+ return
|
|
|
+ }
|
|
|
this.label.push(this.value)
|
|
|
this.value = ""
|
|
|
this.inputShow = false
|
|
|
},
|
|
|
- closeForList(index){
|
|
|
- this.label.splice(index,1)
|
|
|
- // this.show = false;
|
|
|
+ addPerson() {
|
|
|
+ this.Persons.push({
|
|
|
+ name: "",
|
|
|
+ phone: "",
|
|
|
+ })
|
|
|
+ },
|
|
|
+ delPerson(index) {
|
|
|
+ this.Persons.splice(index, 1)
|
|
|
+ },
|
|
|
+ closeForList(index) {
|
|
|
+ this.label.splice(index, 1)
|
|
|
+ },
|
|
|
+ imgRemove(e) {
|
|
|
+ this.imgList.splice(e, 1)
|
|
|
+ },
|
|
|
+ uploadSuccess(e) {
|
|
|
+ this.imgList.push(e.url)
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ uni.showModal({
|
|
|
+ content: "详细的企业信息有助于客户了解您的企业,是否确定提交?",
|
|
|
+ showCancel: true,
|
|
|
+ confirmText: '提交',
|
|
|
+ success: function(res) {
|
|
|
+ if (res.confirm) {
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
}
|
|
@@ -72,7 +155,7 @@
|
|
|
|
|
|
.title {
|
|
|
margin-left: 20rpx;
|
|
|
- color: #71747C;
|
|
|
+ color: #333333;
|
|
|
line-height: 70rpx;
|
|
|
}
|
|
|
|
|
@@ -83,7 +166,7 @@
|
|
|
|
|
|
.modular {
|
|
|
background-color: #FFFFFF;
|
|
|
- border-radius: 20px;
|
|
|
+ border-radius: 12px;
|
|
|
margin-top: 20px;
|
|
|
}
|
|
|
|
|
@@ -97,7 +180,8 @@
|
|
|
color: #AFB3BF;
|
|
|
font-size: 28rpx;
|
|
|
}
|
|
|
- .add{
|
|
|
+
|
|
|
+ .add {
|
|
|
padding: 15rpx 30rpx;
|
|
|
width: 120rpx;
|
|
|
height: 65rpx;
|
|
@@ -105,27 +189,75 @@
|
|
|
margin-left: 24rpx;
|
|
|
font-size: 30rpx;
|
|
|
font-weight: 600;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
}
|
|
|
- .forLists{
|
|
|
+
|
|
|
+ .forLists {
|
|
|
margin-bottom: 10rpx;
|
|
|
}
|
|
|
- .forList{
|
|
|
+
|
|
|
+ .forList {
|
|
|
+ height: 64rpx;
|
|
|
background-color: #F4FAF8;
|
|
|
padding: 20rpx 30rpx;
|
|
|
color: #22C572;
|
|
|
margin-left: 24rpx;
|
|
|
- text-align:center ;
|
|
|
+ text-align: center;
|
|
|
}
|
|
|
- .addinput{
|
|
|
+
|
|
|
+ .addinput {
|
|
|
width: 70%;
|
|
|
margin: 20rpx auto;
|
|
|
- border-radius:50rpx;
|
|
|
+ border-radius: 50rpx;
|
|
|
}
|
|
|
- .inputOk{
|
|
|
+
|
|
|
+ .inputOk {
|
|
|
width: 100rpx;
|
|
|
border-radius: 40rpx;
|
|
|
background-color: #E9EAE9;
|
|
|
color: #FFFFFF;
|
|
|
border: none;
|
|
|
}
|
|
|
+
|
|
|
+ .picture {
|
|
|
+ width: 144rpx;
|
|
|
+ height: 144rpx;
|
|
|
+ border: 4rpx dashed #AFB3BF;
|
|
|
+ }
|
|
|
+
|
|
|
+ .upload {
|
|
|
+ height: 140rpx;
|
|
|
+ text-align: center;
|
|
|
+ margin: 20px 0;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .addPerson {
|
|
|
+ width: 230rpx;
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ text-align: center;
|
|
|
+ border: 2rpx solid #979797;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ margin: 20rpx auto 20rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .information {
|
|
|
+ background-color: #F4FAF8;
|
|
|
+ width: 96%;
|
|
|
+ height: 180rpx;
|
|
|
+ margin: 0 auto;
|
|
|
+ border: 1rpx dashed #22C572;
|
|
|
+ border-radius: 10rpx;
|
|
|
+ margin-top: 30rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .xinxi {
|
|
|
+ margin-left: 70rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .del {
|
|
|
+ justify-content: flex-end;
|
|
|
+ margin: 10rpx 20rpx 0 0;
|
|
|
+ }
|
|
|
</style>
|