baoshi-was/resources/views/maintenance/priceModel/express/_detailModal.blade.php

<div class="modal fade" tabindex="-1" role="dialog" id="detailModal">
    <div class="modal-dialog modal-lg modal-dialog-centered modal-dialog-scrollable">
        <div class="modal-content">
            <div class="modal-header">
                <div class="row w-100">
                    <input id="file" type="file" style="display:none" accept=".csv, .xlsx, .xls" @change="importDetail($event)"/>
                    @can("计费模型-作业-录入")<button type="button" class="btn btn-sm btn-outline-info col-1" @click="selectFile()">导入</button>@endcan
                    <button type="button" class="btn btn-sm btn-outline-dark col-1" @click="exportDetail()">导出</button>
                    <div class="font-weight-bolder offset-3">“<label class="text-primary">@{{ name }}</label>”模型收费标准</div>
                </div>
            </div>
            <div class="modal-body">
                <div class="w-100 text-center mb-1" v-if="errors.length > 0">
                    <button class="btn btn-sm btn-danger mb-1" @click="isShowError = true" v-if="!isShowError">@{{ errors.length }}条错误,点击展开</button>
                    <button class="btn btn-sm btn-dark mb-1" @click="isShowError = false" v-else>收起错误展示</button>
                    <div v-if="isShowError" class="container-fluid text-danger font-weight-bolder">
                        <div class="row text-left">
                            <div class="col-6" v-for="error in errors">@{{ error }}</div>
                        </div>
                    </div>
                </div>
                <table class="table table-sm table-bordered">
                    <tr class="text-success">
                        <th>操作</th>
                        <th>省</th>
                        <th>首重价格</th>
                        <th>续重价格</th>
                        <th>操作</th>
                    </tr>
                    <tr v-for="(detail,i) in details[id]">
                        <td>
                            <div v-if="detail.edit">
                                <button type="button" class="btn btn-sm btn-success" @click="submitDetail(detail)">确定</button>
                                <button type="button" class="btn btn-sm btn-danger" @click="delDetail(detail,i)">取消</button>
                            </div>
                            <div v-else>
                                @can("计费模型-作业-录入")<button type="button" class="btn btn-sm btn-outline-info" @click="addDetail()" v-if="i == 0">新增</button>@endcan
                                @can("计费模型-作业-编辑")<button type="button" class="btn btn-sm btn-outline-primary" v-if="detail.id" @click="updateDetail(detail)">修改</button>@endcan
                            </div>
                        </td>
                        <td>
                            <label v-if="detail.edit && !detail.id">
                                <select class="form-control form-control-sm" v-model="detail.province_id">
                                    <option v-for="province in provinces" :value="province.id">@{{ province.name }}</option>
                                </select>
                            </label>
                            <label v-else>@{{ detail.province ? detail.province.name : '' }}</label>
                        </td>
                        <td>
                            <label v-if="detail.edit"><input type="number" min="0" step="0.001" class="form-control form-control-sm" :id="'initial-'+detail.id"
                                                             v-model="detail.initial_weight_price" :data="detail.initial_weight_price"></label>
                            <label v-else>@{{ detail.initial_weight_price }}</label>
                        </td>
                        <td>
                            <label v-if="detail.edit"><input type="number" min="0" step="0.001" class="form-control form-control-sm" :id="'additional-'+detail.id"
                                                             v-model="detail.additional_weight_price" :data="detail.additional_weight_price"></label>
                            <label v-else>@{{ detail.additional_weight_price }}</label>
                        <td>
                            @can("计费模型-作业-编辑")<button type="button" class="btn btn-sm btn-outline-danger" @click="deletePriceModel(detail.id,i)" v-if="detail.id">删</button>@endcan
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>
</div>