baoshi-was/resources/views/customer/project/part/_storage.blade.php

<div class="row">
    <label for="name" class="col-2 text-info">名称</label>
    <input id="name" type="text" :class="errors.name ? 'is-invalid' : ''" class="col-6 form-control" v-model="model.storage.name">
    <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.name">
        <strong>@{{ errors.name[0] }}</strong>
    </span>
</div>
<div class="row mt-3">
    <label for="counting_type" class="col-2 text-info">计费类型</label>
    <select id="counting_type" class="col-3 form-control"
            :class="errors.counting_type ? 'is-invalid' : ''" v-model="model.storage.counting_type">
        <option v-for="type in pool.counting_type" :value="type">@{{ type }}</option>
    </select>
    <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.counting_type">
        <strong>@{{ errors.counting_type[0] }}</strong>
    </span>
</div>
<div class="row mt-3">
    <label for="using_type" class="col-2 text-info">用仓类型</label>
    <select id="using_type" class="col-3 form-control"
            :class="errors.using_type ? 'is-invalid' : ''" v-model="model.storage.using_type">
        <option v-for="type in pool.using_type" :value="type">@{{ type }}</option>
    </select>
    <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.using_type">
        <strong>@{{ errors.using_type[0] }}</strong>
    </span>
</div>
<div class="row mt-3">
    <label for="minimum_area" class="col-2">最低起租面积</label>
    <input id="minimum_area" type="number" min="0" step="0.001" class="col-6 form-control"
           :class="errors.minimum_area ? 'is-invalid' : ''" v-model="model.storage.minimum_area">
    <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.minimum_area">
        <strong>@{{ errors.minimum_area[0] }}</strong>
    </span>
</div>
<div class="row mt-3">
    <label for="isInterval" class="col-2 text-info">设定区间</label>
    <input id="isInterval" type="checkbox" class="switch"  v-model="model.storage.isInterval">
</div>
<div class="row mt-3">
    <div class="col-4 row">
        <label for="unit_id" class="col-4 text-info">单位</label>
        <select id="unit_id" class="offset-3 col-5 form-control"
                :class="errors.unit_id ? 'is-invalid' : ''" v-model="model.storage.unit_id">
            <option v-for="unit in pool.units" :value="unit.id" v-if="unit.name == 'm²' || unit.name=='㎡' || unit.name == 'm³' || unit.name == '件'">
                @{{ unit.name }}</option>
        </select>
        <span class="invalid-feedback mt-0 offset-6" role="alert" v-if="errors.unit_id">
            <strong>@{{ errors.unit_id[0] }}</strong>
        </span>
    </div>
    <div class="col-3 row m-0">
        <label for="time_unit_id" class="col-5 offset-1 text-info">计时</label>
        <select id="time_unit_id" class="col-6 form-control"
                :class="errors.time_unit_id ? 'is-invalid' : ''" v-model="model.storage.time_unit_id">
            <option v-for="unit in pool.units" :value="unit.id" v-if="unit.name == '日' || unit.name == '月'">@{{ unit.name }}</option>
        </select>
        <span class="invalid-feedback mt-0 offset-6" role="alert" v-if="errors.time_unit_id">
            <strong>@{{ errors.time_unit_id[0] }}</strong>
        </span>
    </div>
    <div class="col-3 row m-0" v-if="!model.storage.isInterval">
        <label for="price" class="col-5 offset-1 text-info">单价</label>
        <input id="price" type="number" min="0" step="0.001" class="col-6 form-control"
               :class="errors['price.0'] ? 'is-invalid' : ''" v-model="model.storage.price[0]">
        <span class="invalid-feedback mt-0 offset-6" role="alert" v-if="errors['price.0']">
            <strong>@{{ errors['price.0'][0] }}</strong>
        </span>
    </div>
</div>
<div class="row mt-3" v-if="model.storage.isInterval">
    <label for="amount_interval" class="col-2 text-info">数量区间</label>
    <div class="col-8 scrollbar overflow-y-scrollbar-200">
        <div class="row mt-0 text-muted">
            <label class="col-4 offset-2 text-center">区间值</label>
            <label class="col-5 text-center">单价</label>
        </div>
        <div class="row mt-1" v-for="(amount,i) in model.storage.amount_interval">
            <label class="col-2">
                <span class="fa fa-plus cursor-pointer" @click="addStoreAmount()">&nbsp;增加</span>
            </label>
            <label class="col-4">
                <input type="number" class="form-control form-control-sm" :class="errors['amount_interval.'+i] ? 'is-invalid' : ''"
                       step="1" :min="Number(model.storage.amount_interval[i-1] ? model.storage.amount_interval[i-1] : 0)+1" v-model="model.storage.amount_interval[i]">
            </label>
            <label class="col-5 text-center">
                <input type="number" class="form-control form-control-sm"  step="0.01" v-model="model.storage.price[i]" :class="errors['price.'+i] ? 'is-invalid' : ''"
                       :placeholder="model.storage.amount_interval[i] ?
                       ('区间范围：'+model.storage.amount_interval[i]+(model.storage.amount_interval[i+1] ? '-'+(model.storage.amount_interval[i+1]-1) : ' +')) : ''">
            </label>
            <label class="col-1">
                <span class="cursor-pointer text-danger font-weight-bold h4" @click="delStoreAmount(i)" v-if="i!=0">&times;</span>
            </label>
            <label class="small text-danger offset-2 col-4" role="alert" v-if="errors['amount_interval.'+i]">
                <strong>@{{ errors['amount_interval.'+i][0] }}</strong>
            </label>
            <label class="small text-danger col-5" :class="!errors['amount_interval.'+i] ? 'offset-6' : ''" role="alert" v-if="errors['price.'+i]">
                <strong>@{{ errors['price.'+i][0] }}</strong>
            </label>
        </div>
    </div>
</div>
<div class="row mt-3">
    <label for="discount_type" class="col-2 text-info">减免类型</label>
    <select id="discount_type" class="col-3 form-control"
            :class="errors.discount_type ? 'is-invalid' : ''" v-model="model.storage.discount_type">
        <option v-for="type in pool.discount_type" :value="type">@{{ type }}</option>
    </select>
    <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.discount_type">
        <strong>@{{ errors.discount_type[0] }}</strong>
    </span>
</div>
<div class="row mt-3" v-if="model.storage.discount_type != '无减免'">
    <label for="discount_value" class="col-2">减免值</label>
    <label class="col-6 mb-0 input-group ml-0">
        <input id="discount_value" type="number" min="0" step="0.01" class="col-6 form-control" style="margin-left: -4%"
               :class="errors.discount_value ? 'is-invalid' : ''" v-model="model.storage.discount_value">
        <span class="d-block input-group-append">
            <span class="input-group-text font-weight-bold" v-if="model.storage.discount_type == '按单减免'">单减 1@{{ poolMapping.units[model.storage.unit_id] }}</span>
            <span class="input-group-text font-weight-bold" v-else>@{{ poolMapping.units[model.storage.unit_id] }}</span>
        </span>
    </label>
    <span class="invalid-feedback mt-0 offset-2" role="alert" v-if="errors.discount_value">
        <strong>@{{ errors.discount_value[0] }}</strong>
    </span>
</div>
<div class="row mt-3">
    <label for="tax_rate_id" class="col-2 text-muted">税率</label>
    <select id="tax_rate_id" class="col-3 form-control" v-model="model.storage.tax_rate_id" :class="errors.tax_rate_id ? 'is-invalid' : ''">
        <option> </option>
        <option v-for="tax in pool.taxRates" :value="tax.id">@{{ tax.value }}%</option>
    </select>
</div>