<el-header height="62px" class="filter-container">
<el-row>
<el-col :span="21">
<el-form :inline="true" :model="formSearch" class="demo-form-inline">
<el-form-item>
<el-input v-model="formSearch.value" placeholder="请输入水道名称" clearable></el-input>
</el-form-item>
<el-form-item>
<el-select v-model="formSearch.type" filterable clearable placeholder="请选择水道类型">
<el-option v-for="item in dataType" :key="item.value" :label="item.text" :value="item.value">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-select v-model="formSearch.official" placeholder="请选择水道性质" filterable clearable>
<el-option key="true" label="正式水道" value="true"></el-option>
<el-option key="false" label="测试水道" value="false"></el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="loadMain" size="small" icon="el-icon-search" round>搜索</el-button>
</el-form-item>
</el-form>
</el-col>
<el-col :span="3" style="text-align: right">
<el-button @click="handleAdd" v-show="visibleBtnAdd" type="success" size="small" icon="el-icon-plus" round>新增水道</el-button>
</el-col>
</el-row>
</el-header>
<el-main ref="layoutMain" class="table-container">
<el-table :data="dataMain" :height="heightMain" stripe highlight-current-row class="el-table-border">
<el-table-column prop="name" label="水道名称"></el-table-column>
<el-table-column prop="swzName" label="水位站"></el-table-column>
<el-table-column prop="typeName" label="水道类型" width="100"></el-table-column>
<el-table-column prop="isOfficial" label="水道性质" align="center" width="100" :formatter="formatOfficial"></el-table-column>
<el-table-column prop="startName" label="水道起点" width="100"></el-table-column>
<el-table-column prop="endName" label="水道讫点" width="100"></el-table-column>
<el-table-column label="里程" width="100">
<template slot-scope="scope">{{ Math.abs(scope.row.endMileage - scope.row.startMileage) + '公里' }}</template>
</el-table-column>
<el-table-column prop="remark" label="水道概况" width="200"></el-table-column>
<el-table-column label="操作" align="center" fixed="right" width="150">
<template slot-scope="scope">
<el-button @click="handleEdit(scope.row)" v-show="visibleBtnEdit" type="primary" size="mini" round plain>编辑</el-button>
<el-button @click="handleDelete(scope.row)" v-show="visibleBtnDelete" type="danger" size="mini" round plain>删除</el-button>
</template>
</el-table-column>
</el-table>
</el-main>
<el-footer>
<el-pagination
@size-change="handlePageSizeChange"
@current-change="handlePageCurrentChange"
:current-page="dataPage"
:page-sizes="[10, 20, 50, 100]"
:page-size="dataSize"
:total="dataTotal"
layout="total, sizes, prev, pager, next, jumper">
</el-pagination>
</el-footer>
<el-dialog
:title="dataRecordTitle[actionDialogRecord]"
:visible.sync="visibleDialogRecord"
:close-on-click-modal="false"
:before-close="handleClose" >
<el-form
class="large-space"
ref="formRecord"
:model="formRecord"
:rules="ruleRecord"
label-position="left"
label-width="90px">
<el-row :gutter="24">
<el-col :span="4"><strong>图片信息</strong></el-col>
<el-col :span="20">
<el-upload
:action="imageUpload"
:headers="headers"
:with-credentials="true"
list-type="picture-card"
:file-list="formRecord.waterInfomationPicDTO"
:on-success="handleAvatarSuccess"
:on-preview="handlePictureCardPreview"
:before-upload="beforeAvatarUpload"
:on-remove="handleRemove" style="float: left; margin-bottom: 10px">
<i class="el-icon-plus"></i>
</el-upload>
<el-dialog :visible.sync="dialogVisible" size="tiny">
<img width="100%" :src="dialogImageUrl" alt="">
</el-dialog>
</el-col>
</el-row>
<el-form-item label="水道名称" prop="name">
<el-input v-model="formRecord.name"></el-input>
</el-form-item>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="水道类型" prop="type">
<el-select v-model="formRecord.type" filterable placeholder="请选择水道类型" style="width: 100%">
<el-option v-for="item in dataType" :key="item.value" :label="item.text" :value="item.value">
</el-option>
</el-select>
</el-form-item></el-col>
<el-col :span="12"><el-form-item label="水道性质" prop="official">
<el-switch
v-model="formRecord.official"
:disabled.sync="disabledSelOfficial"
active-text="正式水道"
inactive-text="测试水道"
></el-switch>
</el-form-item></el-col>
</el-row>
<!-- <el-form-item label="位置" prop="waterway">
<map-box v-loading="loadingWaterway" @mapReady="handleMapReady" class="map-box"></map-box>
</el-form-item> -->
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="水道起点" prop="start">
<el-select ref="selStart" v-model="formRecord.start" filterable placeholder="请选择水道起点" style="width: 100%">
<el-option v-for="item in dataNode" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item></el-col>
<el-col :span="12"><el-form-item label="水道讫点" prop="end">
<el-select ref="selEnd" v-model="formRecord.end" filterable placeholder="请选择水道讫点" style="width: 100%">
<el-option v-for="item in dataNode" :key="item.id" :label="item.name" :value="item.id">
</el-option>
</el-select>
</el-form-item></el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12"><el-form-item label="水位站" prop="swzId">
<el-select ref="selStation" v-model="formRecord.swzId" filterable placeholder="请选择关联水位站" style="width: 100%">
<el-option v-for="item in dataWaterStation" :key="item[0]" :label="item[1]" :value="item[0]">
</el-option>
</el-select>
</el-form-item></el-col>
</el-row>
<el-form-item label="水道概况" prop="remark">
<el-input type="textarea" v-model="formRecord.remark"></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="handleCancel">取消</el-button>
<el-button @click="handleSave" type="primary">保存</el-button>
</div>
</el-dialog>
vue 修改的时候报undefind错误
- 写回答
- 好问题 0 提建议
- 追加酬金
- 关注问题
- 邀请回答
-
1条回答
- shichengzhe 2019-05-19 10:24关注
data() {
return {
visibleBtnAdd: true,
visibleBtnEdit: true,
visibleBtnDelete: true,
formSearch: {
type: undefined,
value: '',
official: undefined
},
formRecord: {
id: null,
name: '',
type: null,
official: true,
waterway: null,
startId: null,
endId: null,
start: null,
end: null,
swzId: null,
remark: '',
waterInfomationPicDTO: []
},
在声明的时候,你的official属性错了,应该为true,希望能给你有些帮助本回答被题主选为最佳回答 , 对您是否有帮助呢?解决 无用评论 打赏 举报
悬赏问题
- ¥20 我想使用一些网络协议或者部分协议也行,主要想实现类似于traceroute的一定步长内的路由拓扑功能
- ¥30 深度学习,前后端连接
- ¥15 孟德尔随机化结果不一致
- ¥15 apm2.8飞控罗盘bad health,加速度计校准失败
- ¥15 求解O-S方程的特征值问题给出边界层布拉休斯平行流的中性曲线
- ¥15 谁有desed数据集呀
- ¥20 手写数字识别运行c仿真时,程序报错错误代码sim211-100
- ¥15 关于#hadoop#的问题
- ¥15 (标签-Python|关键词-socket)
- ¥15 keil里为什么main.c定义的函数在it.c调用不了