ll

liukangdong

2025-02-25 5857dfa10b70a061b8e4711dd8f18b585ac6fc23

 h5/pages/staff/vehicle/apply.vue

@@ -8,10 +8,7 @@
          <text>预计用车时段</text>
        </view>
        <view class="value" @click="$goBack()">
          <text
            class="mr6"
            :style="{ color: param.startTime ? '#000000' : '#999999' }"
          >
          <text class="mr6" :style="{ color: param.startTime ? '#000000' : '#999999' }">
            <text v-if="param.startTime">
              {{ param.startTime.slice(5, 16) }}至{{
                param.endTime.slice(5, 16)
@@ -28,13 +25,8 @@
          <text>申请车辆</text>
        </view>
        <view class="value" @click="$goBack()">
          <input
            type="text"
            disabled
            placeholder="请输入申请车辆"
            v-model="param.carCode"
            placeholder-style="color: #999999;"
          />
          <input type="text" disabled placeholder="请输入申请车辆" v-model="param.carCode"
            placeholder-style="color: #999999;" />
        </view>
      </view>
      <view class="line">
@@ -43,11 +35,8 @@
          <text>预计出发时间</text>
        </view>
        <view class="value" @click="isShowDatetime = true">
          <text
            class="mr6"
            :style="{ color: param.planUseDate ? '#000000' : '#999999' }"
            >{{ param.planUseDate ? param.planUseDate : "请选择" }}</text
          >
          <text class="mr6" :style="{ color: param.planUseDate ? '#000000' : '#999999' }">{{ param.planUseDate ?
            param.planUseDate : "请选择" }}</text>
          <u-icon name="arrow-right" color="#CCCCCC" size="20"></u-icon>
        </view>
      </view>
@@ -67,12 +56,7 @@
          <text>目的地</text>
        </view>
        <view class="value">
          <input
            type="text"
            placeholder="请输入"
            v-model="param.addr"
            placeholder-style="color: #999999;"
          />
          <input type="text" placeholder="请输入" v-model="param.addr" placeholder-style="color: #999999;" />
        </view>
      </view>
      <view class="line">
@@ -81,15 +65,12 @@
          <text>乘车人员</text>
        </view>
        <view class="value" @click="selPeople">
          <text
            class="mr6"
            :style="{
              color:
                param.memberList && param.memberList.length > 0
                  ? '#000000'
                  : '#999999',
            }"
          >
          <text class="mr6" :style="{
            color:
              param.memberList && param.memberList.length > 0
                ? '#000000'
                : '#999999',
          }">
            <text v-if="param.memberNames">
              <text v-for="(mem, i) in param.memberList" :key="mem.id">
                <template v-if="i < 2">
@@ -97,9 +78,7 @@
                  <text v-if="i < 1 && param.memberList.length > 1">,</text>
                </template>
              </text>
              <text v-if="param.memberList.length > 2"
                >等{{ param.memberList.length }}人</text
              >
              <text v-if="param.memberList.length > 2">等{{ param.memberList.length }}人</text>
            </text>
            <text v-else>请选择</text>
          </text>
@@ -112,41 +91,24 @@
          <text>用车事由</text>
        </view>
        <view class="value">
          <textarea
            type="text"
            placeholder="请输入"
            :maxlength="-1"
            v-model="param.content"
            placeholder-style="color: #999999;"
          />
          <textarea type="text" placeholder="请输入" :maxlength="-1" v-model="param.content"
            placeholder-style="color: #999999;" />
        </view>
      </view>
    </view>
    <view class="tip">
      <view class="title">注意事项：</view>
      <view class="line"
        >1、公司车辆外出需办理用车申请表，经批准后方可外出（借出）。</view
      >
      <view class="line">1、公司车辆外出需办理用车申请表，经批准后方可外出（借出）。</view>
      <view class="line">2、市外用车需总经办审批。</view>
      <view class="line"
        >3、借出车辆必须遵守交通规则，安全行驶。对于车辆发生交通意外，对当事人及第三方造成人身伤害及损失，公司可以协助处理保险公司赔偿相关事宜，但不承担任何责任和费用。</view
      >
      <view class="line"
        >4、公司借给申请人用车，申请借车人为第一责任人，不允许转借给其他人使用，若要借给他人使用。责任人要承担全部责任。</view
      >
         <view class="sub_btn" @click="handleSub">提交</view>
      <view class="line">3、借出车辆必须遵守交通规则，安全行驶。对于车辆发生交通意外，对当事人及第三方造成人身伤害及损失，公司可以协助处理保险公司赔偿相关事宜，但不承担任何责任和费用。</view>
      <view class="line">4、公司借给申请人用车，申请借车人为第一责任人，不允许转借给其他人使用，若要借给他人使用。责任人要承担全部责任。</view>
      <view class="sub_btn" @click="handleSub">提交</view>
    </view>
    <!--  -->
    <!-- :minDate="new Date(param.startTime).getTime()"
      :maxDate="new Date(param.endTime).getTime()" -->
    <u-datetime-picker
      :show="isShowDatetime"
      @confirm="confirmDate"
      :minDate="new Date(param.startTime).getTime()"
      :maxDate="new Date(param.endTime).getTime()"
      @cancel="isShowDatetime = false"
      mode="datetime"
    ></u-datetime-picker>
    <u-datetime-picker :show="isShowDatetime" @confirm="confirmDate" :minDate="new Date(param.startTime).getTime()"
      :maxDate="new Date(param.endTime).getTime()" @cancel="isShowDatetime = false" mode="datetime"></u-datetime-picker>
  </view>
</template>

@@ -164,7 +126,7 @@
  mounted() {
    this.$eventBus.$on('applePeo', (res) => {
      this.$set(this.param, 'memberList', res)
      this.$set(this.param, 'memberIds', res.map(i => i.id).join(','))
      this.$set(this.param, 'memberIds', res.map(i => i.memberId).join(','))
      this.$set(this.param, 'memberNames', res.map(i => i.realname).join(','))
    })
  },
@@ -172,7 +134,7 @@
    console.log(option)
    this.param = { ...option }
    this.minDate = new Date().getTime()
      this.param.planUseDate = dayjs(this.param.startTime).format('YYYY-MM-DD HH:mm')
    this.param.planUseDate = dayjs(this.param.startTime).format('YYYY-MM-DD HH:mm')
  },
  methods: {
    handleSub() {
@@ -227,9 +189,10 @@
</script>

<style lang="scss">
   page{
      background-color: #f7f7f7;
   }
page {
  background-color: #f7f7f7;
}

.main_wrap {
  .line {
    display: flex;
@@ -237,12 +200,14 @@
    align-items: center;
    border-bottom: 1rpx solid #e5e5e5;
    padding: 30rpx;
      background-color: #fff;
      width: 750rpx;
      margin: 0 -30rpx;
    background-color: #fff;
    width: 750rpx;
    margin: 0 -30rpx;

    .label {
      font-size: 30rpx;
      font-weight: 400;

      text {
        &:nth-child(1) {
          color: #e42d2d;
@@ -250,6 +215,7 @@
        }
      }
    }

    .value {
      flex: 1;
      height: 100%;
@@ -257,6 +223,7 @@
      display: flex;
      align-items: center;
      justify-content: flex-end;

      input {
        width: 100%;
        height: 100%;
@@ -267,11 +234,13 @@
      }
    }
  }

  .upload_line {
    padding: 30rpx;
      width: 750rpx;
      margin: 0 -30rpx;
      background-color: #fff;
    width: 750rpx;
    margin: 0 -30rpx;
    background-color: #fff;

    textarea {
      margin-top: 12rpx;
      width: 100%;
@@ -280,6 +249,7 @@
      font-weight: 400;
      color: #222222;
    }

    .adduser_list_item_ipt1_upload {
      margin-top: 24rpx;
      width: 120rpx;
@@ -292,6 +262,7 @@
      align-items: center;
      justify-content: center;
      overflow: hidden;

      image {
        width: 100%;
        height: 100%;
@@ -299,11 +270,12 @@
    }
  }
}

.sub_btn {
  // position: fixed;
  // bottom: 84rpx;
  // left: 30rpx;
   margin-top: 60rpx;
  margin-top: 60rpx;
  width: 690rpx;
  height: 88rpx;
  line-height: 88rpx;
@@ -314,20 +286,24 @@
  font-size: 30rpx;
  color: #ffffff;
}

.tip {
  background: #f7f7f7;
  padding: 30rpx 30rpx 10rpx;
  margin: 0 -30rpx;

  .title {
    line-height: 40rpx;
    margin-bottom: 22rpx;
  }

  .line {
    font-size: 26rpx;
    color: #666666;
    line-height: 36rpx;
  }
}

.main_app {
  padding-bottom: 0;
  // padding-top: 10rpx;