| | |
| | | <div class="modal_wrap"> |
| | | <el-form :model="form" ref="formRef" class="el_form" :rules="rules"> |
| | | <el-form-item label="用车范围" prop="type"> |
| | | <el-radio v-model="form.type" style="width: 80px;" :label="0">市内用车</el-radio> |
| | | <el-radio v-model="form.type" style="width: 80px;" :label="1">市外用车</el-radio> |
| | | <el-radio v-model="form.type" style="width: 80px" :label="0" |
| | | >市内用车</el-radio |
| | | > |
| | | <el-radio v-model="form.type" style="width: 80px" :label="1" |
| | | >市外用车</el-radio |
| | | > |
| | | </el-form-item> |
| | | <el-form-item label="选择车辆" prop="carId"> |
| | | <el-select v-model="form.carId" placeholder="选择车辆"> |
| | |
| | | </el-form-item> |
| | | <el-form-item label="预计出发时间" prop="planUseDate"> |
| | | <el-date-picker |
| | | v-if="form.type == '0'" |
| | | :disabled="!form.startTime" |
| | | v-model="form.planUseDate" |
| | | format="yyyy-MM-dd HH:mm:ss" |
| | | format="yyyy-MM-dd HH:mm" |
| | | value-format="yyyy-MM-dd HH:mm:ss" |
| | | :picker-options="pickerOptions" |
| | | default-time="08:00:00" |
| | | type="datetime" |
| | | placeholder="选择日期时间" |
| | | > |
| | | </el-date-picker> |
| | | /> |
| | | <el-date-picker |
| | | v-if="form.type == '1'" |
| | | :disabled="!form.startTime" |
| | | v-model="form.planUseDate" |
| | | format="yyyy-MM-dd HH:mm" |
| | | value-format="yyyy-MM-dd HH:mm:ss" |
| | | :picker-options="pickerOptions2" |
| | | default-time="08:00:00" |
| | | type="datetime" |
| | | placeholder="选择日期时间" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="目的地" prop="addr"> |
| | | <el-input v-model="form.addr" placeholder="请输入内容"></el-input> |
| | |
| | | <h1>注意事项:</h1> |
| | | <div>1、公司车辆外出需办理用车申请表,经批准后方可外出(借出)。</div> |
| | | <div>2、市外用车需领导审核。</div> |
| | | <div>3、借出车辆必须遵守交通规则,安全行驶。对于车辆发生交通意外,对当事人及第三方造成人身伤害及损失,公司可以协助处理保险公司赔偿相关事宜,但不承担任何责任和费用。</div> |
| | | <div>4、公司借给申请人用车,申请借车人为第一责任人,不允许转借给其他人使用,若要借给他人使用。责任人要承担全部责任。</div> |
| | | <div> |
| | | 3、借出车辆必须遵守交通规则,安全行驶。对于车辆发生交通意外,对当事人及第三方造成人身伤害及损失,公司可以协助处理保险公司赔偿相关事宜,但不承担任何责任和费用。 |
| | | </div> |
| | | <div> |
| | | 4、公司借给申请人用车,申请借车人为第一责任人,不允许转借给其他人使用,若要借给他人使用。责任人要承担全部责任。 |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | |
| | | value-format="yyyy-MM-dd" |
| | | type="date" |
| | | placeholder="选择日期" |
| | | :picker-options="{ |
| | | disabledDate(time) { |
| | | return time.getTime() < Date.now() - 8.64e7; |
| | | } |
| | | }" |
| | | @change="seletedDate" |
| | | > |
| | | </el-date-picker> |
| | |
| | | <span>{{ item.memberIds.split(",").length }}人</span> |
| | | </div> |
| | | <div class="line"> |
| | | <text>用车事由</text> |
| | | <text>{{ item.content }}</text> |
| | | <span>用车事由</span> |
| | | <span>{{ item.content }}</span> |
| | | </div> |
| | | <div class="line"> |
| | | <span>申请人</span> |
| | |
| | | import { allList as getCarList } from '@/api/business/cars' |
| | | import { carCanReservationDate, carUseBookCraete, carUseBookList } from '@/api/business/carUseBook' |
| | | import { findTypeMemberInfo } from '@/api/business/memberCard' |
| | | import dayjs from 'dayjs' |
| | | export default { |
| | | name: 'OperCarUseBookParamWindow', |
| | | extends: BaseOpera, |
| | |
| | | carsList: [], |
| | | form: { |
| | | type: 0, |
| | | startTime: '', |
| | | endTime: '', |
| | | memberIds: [] |
| | | }, |
| | | pickerOptions: { |
| | | disabledDate: (time) => { |
| | | if (this.form.startTime && this.form.endTime) { |
| | | const minTime = new Date(this.form.startTime).getTime() - 8.64e7 |
| | | const maxTime = new Date(this.form.endTime).getTime() |
| | | return ( |
| | | time.getTime() < minTime |
| | | time.getTime() < minTime || time.getTime() > maxTime |
| | | ) |
| | | } else { |
| | | return time.getTime() < Date.now() - 8.64e7 |
| | | } |
| | | }, |
| | | selectableRange: '00:00:00 - 23:59:59' |
| | | }, |
| | | pickerOptions2: { |
| | | disabledDate: (time) => { |
| | | if (this.form.startTime && this.form.endTime) { |
| | | const minTime = new Date(this.form.startTime).getTime() |
| | | const maxTime = new Date(this.form.endTime).getTime() |
| | | return ( |
| | | time.getTime() < minTime || time.getTime() > maxTime |
| | | ) |
| | | } else { |
| | | return time.getTime() < Date.now() - 8.64e7 |
| | | } |
| | | }, |
| | | selectableRange: '00:00:00 - 23:59:59' |
| | | }, |
| | | // 验证规则 |
| | | rules: { |
| | |
| | | memberIds: [{ type: 'array', required: true, message: '请选择', trigger: 'change' }], |
| | | content: [{ required: true, message: '请输入', trigger: 'blur' }] |
| | | } |
| | | } |
| | | }, |
| | | watch: { |
| | | 'form.planUseDate': { |
| | | handler (newValue, oldValue) { |
| | | if (newValue) { |
| | | this.$set(this.pickerOptions, 'selectableRange', this.form.startTime.slice(11, 19) + ' - ' + this.form.endTime.slice(11, 19)) |
| | | // this.startPickerOptions = this.startPickerOptions |
| | | } |
| | | }, |
| | | deep: true, |
| | | immediate: true |
| | | } |
| | | }, |
| | | created () { |
| | |
| | | } |
| | | } |
| | | .have_info { |
| | | padding: 0 0 120px; |
| | | padding: 0 0 60px; |
| | | .tit { |
| | | color: #ed4545; |
| | | margin: 20px 0 12px; |
| | |
| | | .line { |
| | | display: flex; |
| | | margin-bottom: 10px; |
| | | text { |
| | | span { |
| | | &:nth-of-type(1) { |
| | | width: 80px; |
| | | color: #888888; |