|
|
@@ -24,20 +24,30 @@
|
|
|
<view class="label">备注信息</view>
|
|
|
<input class="input" type="text" v-model="form.remark" placeholder="选填" />
|
|
|
</view>
|
|
|
- <view class="form-item">
|
|
|
+ <view class="form-item action-row">
|
|
|
<view class="label">生效时间</view>
|
|
|
- <view class="value">实时生效</view>
|
|
|
+ <view class="value" @click="openDatePicker">
|
|
|
+ <text v-if="!form.effectiveDate">马上生效（点击可改生效时间）</text>
|
|
|
+ <text v-else>{{form.effectiveDate}}</text>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<view class="footer-btn">
|
|
|
<button class="cancel-btn" @click="cancel">取消</button>
|
|
|
<button class="confirm-btn" @click="confirm">发放</button>
|
|
|
</view>
|
|
|
+
|
|
|
+ <view v-if="datePickerShow" class="date-picker-mask" @click="datePickerShow = false"></view>
|
|
|
+ <mx-date-picker :show="datePickerShow" format="yyyy-mm-dd" type="date" :value="datePickerValue" :show-tips="true" @confirm="confirmDatePicker" @cancel="datePickerShow = false" />
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import { createHb } from '@/api/hb';
|
|
|
+import MxDatePicker from '@/components/mx-datepicker/mx-datepicker.vue';
|
|
|
export default {
|
|
|
+ components: {
|
|
|
+ MxDatePicker
|
|
|
+ },
|
|
|
data() {
|
|
|
return {
|
|
|
userId: 0,
|
|
|
@@ -48,8 +58,11 @@ export default {
|
|
|
amount: '',
|
|
|
days: '',
|
|
|
minConsume: '',
|
|
|
- remark: ''
|
|
|
- }
|
|
|
+ remark: '',
|
|
|
+ effectiveDate: ''
|
|
|
+ },
|
|
|
+ datePickerShow: false,
|
|
|
+ datePickerValue: ''
|
|
|
};
|
|
|
},
|
|
|
onLoad(options) {
|
|
|
@@ -61,6 +74,14 @@ export default {
|
|
|
},
|
|
|
methods: {
|
|
|
init() {},
|
|
|
+ openDatePicker() {
|
|
|
+ this.datePickerValue = this.form.effectiveDate || '';
|
|
|
+ this.datePickerShow = true;
|
|
|
+ },
|
|
|
+ confirmDatePicker(e) {
|
|
|
+ this.form.effectiveDate = e.value;
|
|
|
+ this.datePickerShow = false;
|
|
|
+ },
|
|
|
cancel() {
|
|
|
uni.navigateBack();
|
|
|
},
|
|
|
@@ -145,5 +166,15 @@ export default {
|
|
|
height: 80upx;
|
|
|
}
|
|
|
}
|
|
|
+.date-picker-mask {
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ right: 0;
|
|
|
+ bottom: 0;
|
|
|
+ background-color: rgba(0, 0, 0, 0.5);
|
|
|
+ z-index: 99;
|
|
|
+ animation: fadeIn 0.3s ease-in-out;
|
|
|
+}
|
|
|
</style>
|
|
|
|
