GPT答: |
7i24.cn
|
WXML代码:
```html
<view class="container">
<view class="title">创建投票</view>
<form bindsubmit="submitForm">
<view class="form-group">
<text>标题:</text>
<input type="text" name="title" placeholder="请输入标题"/>
</view>
<view class="form-group">
<text>内容:</text>
<textarea name="content" placeholder="请输入内容"></textarea>
</view>
<view class="form-group">
<text>选项:</text>
<!-- 使用wx:for循环渲染选项 -->
<!-- item为当前遍历的元素,index为索引 -->
<!-- key属性必须加上,用于优化性能 -->
<!-- value属性绑定表单数据 -->
<block wx:for="{{options}}" wx:key="{{index}}">
<input type='radio' name='option' value='{{item}}'/> {{item}}
</block>
</view>
<!-- 搜索模版使用文本框表示-->
< view class = "form-group" >
< text > 搜索模版: </ text >
<input type = "search-template" name = "searchTemplate"/>
</ view >
<!-- 地域限制使用下拉框表示-->
< view class = "form-group" >
< text > 地域限制: </ text >
<select id ="region-select"name ="regionLimitation">
<option value ="0">不限地区</option>
<option value ="1">北京市</option>
<option value ="2">上海市</option>
<option value ="3">广州市</option>
</select>
</ view >
<!-- 时间限制使用日期来表示-->
<view class="form-group">
<text>时间限制:</text>
<input type="date" name="timeLimitation"/>
</view>
<!-- 预览、修改、保存、发布和取消创建投票用按钮来表示 -->
<button class="preview-btn" formType="submit">预览</button>
<button class="edit-btn" bindtap='editForm'>修改</button>
<button class="save-btn" bindtap='saveForm'>保存</button>
<button class="publish-btn" bindtap='publishForm'>发布</button>
<button class = "cancel-create-vote-btn">取消创建投票< / button >
</form>
<!-- 选择添加优惠用按钮来表示 -->
<button class = "add-discount-button">选择添加优惠< / button >
</view >
```
WXSS代码:
```css
.container {
background-color: #fff;
}
.title {
font-size: 24px;
text-align: center;
}
.form-group {
margin-top:20px;
display:flex;
align-items:center;
}
.form-group text{
flex-basis:auto;
margin-right:10px;
}
textarea,input[type=text], select, input[type=date]{
border:none;
border-bottom:solid #ccc .5px ;
padding-bottom:.3em ;
width:auto !important ;
flex-grow :1 ;
font-size :16rpx ;
line-height :1.5em ;
background-color:#f8f8f8;
}
textarea:focus,input[type=text]:focus, select:focus, input[type=date]:focus{
outline:none;
}
button {
display: block;
margin: 20px auto;
width: 200px;
height:40px ;
background-color:#4CAF50 ;
color:#fff ;
border-radius :5px ;
font-size :16rpx ;
line-height :40px ;
text-align:center;
cursor:pointer;
}
```
|