|
|
@@ -1,121 +1,131 @@
|
|
|
<!--港口-->
|
|
|
<template>
|
|
|
- <basic-container>
|
|
|
- <avue-crud :option="option"
|
|
|
- :table-loading="loading"
|
|
|
- :data="data"
|
|
|
- :page.sync="page"
|
|
|
- :permission="permissionList"
|
|
|
- id="out-table"
|
|
|
- :header-cell-class-name="headerClassName"
|
|
|
- :before-open="beforeOpen"
|
|
|
- v-model="form"
|
|
|
- ref="crud"
|
|
|
- @row-update="rowUpdate"
|
|
|
- @row-save="rowSave"
|
|
|
- @row-del="rowDel"
|
|
|
- @search-change="searchChange"
|
|
|
- @search-reset="searchReset"
|
|
|
- @selection-change="selectionChange"
|
|
|
- @current-change="currentChange"
|
|
|
- @size-change="sizeChange"
|
|
|
- @refresh-change="refreshChange"
|
|
|
- @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 298)"
|
|
|
- @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 298)"
|
|
|
- @on-load="onLoad">
|
|
|
- <template slot="menuLeft">
|
|
|
- <el-button type="danger"
|
|
|
- size="small"
|
|
|
- icon="el-icon-delete"
|
|
|
- plain
|
|
|
- @click="handleDelete">删 除
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- <template slot="remarks" slot-scope="scope">
|
|
|
- <avue-text-ellipsis :text="scope.row.remarks" :height="30" use-tooltip placement="top">
|
|
|
- <small slot="more">...</small>
|
|
|
- </avue-text-ellipsis>
|
|
|
- </template>
|
|
|
- <template slot="extendedDataArr" slot-scope="scope">
|
|
|
+ <div>
|
|
|
+ <basic-container v-if="isShow">
|
|
|
+ <avue-crud :option="option"
|
|
|
+ :table-loading="loading"
|
|
|
+ :data="data"
|
|
|
+ :page.sync="page"
|
|
|
+ :permission="permissionList"
|
|
|
+ id="out-table"
|
|
|
+ :header-cell-class-name="headerClassName"
|
|
|
+ :before-open="beforeOpen"
|
|
|
+ v-model="form"
|
|
|
+ ref="crud"
|
|
|
+ @row-update="rowUpdate"
|
|
|
+ @row-save="rowSave"
|
|
|
+ @row-del="rowDel"
|
|
|
+ @search-change="searchChange"
|
|
|
+ @search-reset="searchReset"
|
|
|
+ @selection-change="selectionChange"
|
|
|
+ @current-change="currentChange"
|
|
|
+ @size-change="sizeChange"
|
|
|
+ @refresh-change="refreshChange"
|
|
|
+ @resetColumn="resetColumnTwo('crud', 'option', 'optionBack', 298)"
|
|
|
+ @saveColumn="saveColumnTwo('crud', 'option', 'optionBack', 298)"
|
|
|
+ @on-load="onLoad">
|
|
|
+ <template slot-scope="scope" slot="menuLeft">
|
|
|
+ <el-button type="primary"
|
|
|
+ size="small"
|
|
|
+ icon="el-icon-plus"
|
|
|
+ @click="addbtnfun()">新增
|
|
|
+ </el-button>
|
|
|
+ <el-button type="danger"
|
|
|
+ size="small"
|
|
|
+ icon="el-icon-delete"
|
|
|
+ plain
|
|
|
+ @click="handleDelete">删 除
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
+ <template slot="remarks" slot-scope="scope">
|
|
|
+ <avue-text-ellipsis :text="scope.row.remarks" :height="30" use-tooltip placement="top">
|
|
|
+ <small slot="more">...</small>
|
|
|
+ </avue-text-ellipsis>
|
|
|
+ </template>
|
|
|
+ <template slot="extendedDataArr" slot-scope="scope">
|
|
|
<span style="color: #1e9fff" @click="extendedDataview(scope.row)">
|
|
|
{{scope.row.extendedDataArr.length}}
|
|
|
</span>
|
|
|
- </template>
|
|
|
- <template slot-scope="{type,disabled,row}" slot="extendedDataArrForm">
|
|
|
- <el-button type="primary"
|
|
|
- size="small"
|
|
|
- @click="dialogVisible = true">EDI CODE
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
+ </template>
|
|
|
+ <template slot-scope="{type,disabled,row}" slot="extendedDataArrForm">
|
|
|
+ <el-button type="primary"
|
|
|
+ size="small"
|
|
|
+ @click="dialogVisible = true">EDI CODE
|
|
|
+ </el-button>
|
|
|
+ </template>
|
|
|
|
|
|
- </avue-crud>
|
|
|
+ </avue-crud>
|
|
|
|
|
|
- <el-dialog
|
|
|
- title="EDI CODE"
|
|
|
- :visible.sync="dialogVisible"
|
|
|
- width="50%"
|
|
|
- append-to-body
|
|
|
- :destroy-on-close="true"
|
|
|
- :modal-append-to-body="false"
|
|
|
- :before-close="handleClose">
|
|
|
- <div>
|
|
|
- <el-button type="primary"
|
|
|
- size="small"
|
|
|
- :disabled="extendedDisabled"
|
|
|
- @click="extendedDataAdd">新增
|
|
|
- </el-button>
|
|
|
- <el-table
|
|
|
- stripe
|
|
|
- :data="form.extendedDataArr"
|
|
|
- id="out-table"
|
|
|
- :header-cell-class-name="headerClassName"
|
|
|
- style="width: 100%">
|
|
|
- <el-table-column
|
|
|
- prop="name"
|
|
|
- label="名称">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <el-input v-if="row.edit" size="mini" v-model="row.name" placeholder="请输入名称"></el-input>
|
|
|
- <span v-else>{{row.name}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column
|
|
|
- prop="value"
|
|
|
- label="键值">
|
|
|
- <template slot-scope="{row}">
|
|
|
- <el-input v-if="row.edit" size="mini" v-model="row.value" placeholder="请输入键值"></el-input>
|
|
|
- <span v-else>{{row.value}}</span>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column label="操作">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-button
|
|
|
- type="text"
|
|
|
- size="mini"
|
|
|
- :disabled="extendedDisabled"
|
|
|
- @click="extendedDataEdit(scope.$index, scope.row)">{{scope.row.edit?'保存':'编辑'}}</el-button>
|
|
|
- <el-button
|
|
|
- size="mini"
|
|
|
- type="text"
|
|
|
- :disabled="extendedDisabled"
|
|
|
- @click="extendedDataDelete(scope.$index, scope.row)">删除</el-button>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
- </div>
|
|
|
- <span slot="footer" class="dialog-footer">
|
|
|
+ <el-dialog
|
|
|
+ title="EDI CODE"
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ width="50%"
|
|
|
+ append-to-body
|
|
|
+ :destroy-on-close="true"
|
|
|
+ :modal-append-to-body="false"
|
|
|
+ :before-close="handleClose">
|
|
|
+ <div>
|
|
|
+ <el-button type="primary"
|
|
|
+ size="small"
|
|
|
+ :disabled="extendedDisabled"
|
|
|
+ @click="extendedDataAdd">新增
|
|
|
+ </el-button>
|
|
|
+ <el-table
|
|
|
+ stripe
|
|
|
+ :data="form.extendedDataArr"
|
|
|
+ id="out-table"
|
|
|
+ :header-cell-class-name="headerClassName"
|
|
|
+ style="width: 100%">
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="名称">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-input v-if="row.edit" size="mini" v-model="row.name" placeholder="请输入名称"></el-input>
|
|
|
+ <span v-else>{{row.name}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="value"
|
|
|
+ label="键值">
|
|
|
+ <template slot-scope="{row}">
|
|
|
+ <el-input v-if="row.edit" size="mini" v-model="row.value" placeholder="请输入键值"></el-input>
|
|
|
+ <span v-else>{{row.value}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button
|
|
|
+ type="text"
|
|
|
+ size="mini"
|
|
|
+ :disabled="extendedDisabled"
|
|
|
+ @click="extendedDataEdit(scope.$index, scope.row)">{{scope.row.edit?'保存':'编辑'}}</el-button>
|
|
|
+ <el-button
|
|
|
+ size="mini"
|
|
|
+ type="text"
|
|
|
+ :disabled="extendedDisabled"
|
|
|
+ @click="extendedDataDelete(scope.$index, scope.row)">删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ </div>
|
|
|
+ <span slot="footer" class="dialog-footer">
|
|
|
<el-button @click="dialogVisible = false;extendedDisabled = false">取 消</el-button>
|
|
|
<el-button type="primary" @click="dialogVisible = false;extendedDisabled = false">确 定</el-button>
|
|
|
</span>
|
|
|
- </el-dialog>
|
|
|
+ </el-dialog>
|
|
|
|
|
|
- </basic-container>
|
|
|
+ </basic-container>
|
|
|
+ <ports-terms ref="portsterms" v-if="!isShow"></ports-terms>
|
|
|
+ </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import {bportsList, bportsDetail, bportsSubmit, bportsRemove} from "@/api/iosBasicData/bports";
|
|
|
import {mapGetters} from "vuex";
|
|
|
+ import portsTerms from "@/views/iosBasicData/bports/portsTerms.vue";
|
|
|
|
|
|
export default {
|
|
|
+ components: {portsTerms},
|
|
|
data() {
|
|
|
return {
|
|
|
// 扩展数据弹窗
|
|
|
@@ -124,6 +134,7 @@
|
|
|
form: {
|
|
|
extendedDataArr:[]
|
|
|
},
|
|
|
+ isShow:true, // 详情和列表切换
|
|
|
query: {},
|
|
|
loading: true,
|
|
|
page: {
|
|
|
@@ -360,7 +371,7 @@
|
|
|
...mapGetters(["permission"]),
|
|
|
permissionList() {
|
|
|
return {
|
|
|
- // addBtn: this.vaildData(this.permission.bports_add, false),
|
|
|
+ addBtn: this.vaildData(this.permission.bports_add, false),
|
|
|
// viewBtn: this.vaildData(this.permission.bports_view, false),
|
|
|
// delBtn: this.vaildData(this.permission.bports_delete, false),
|
|
|
// editBtn: this.vaildData(this.permission.bports_edit, false)
|
|
|
@@ -410,6 +421,17 @@
|
|
|
this.form.extendedDataArr.splice(index,1)
|
|
|
},
|
|
|
|
|
|
+ // 添加弹窗开启
|
|
|
+ addbtnfun(){
|
|
|
+ this.isShow = false
|
|
|
+ this.$nextTick(()=>{
|
|
|
+ // console.log(this.$refs.portsterms)
|
|
|
+ // console.log(this.$refs.portsterms.bportsDetailfun())
|
|
|
+ })
|
|
|
+
|
|
|
+ // rowAdd
|
|
|
+ },
|
|
|
+ // 添加确认
|
|
|
rowSave(row, done, loading) {
|
|
|
row.extendedDataArr.map(item=>{
|
|
|
delete item.edit
|
|
|
@@ -428,6 +450,7 @@
|
|
|
window.console.log(error);
|
|
|
});
|
|
|
},
|
|
|
+ // 编辑确认
|
|
|
rowUpdate(row, index, done, loading) {
|
|
|
row.extendedDataArr.map(item=>{
|
|
|
delete item.edit
|
|
|
@@ -485,6 +508,7 @@
|
|
|
this.$refs.crud.toggleSelection();
|
|
|
});
|
|
|
},
|
|
|
+ // 详情
|
|
|
beforeOpen(done, type) {
|
|
|
if (["edit", "view"].includes(type)) {
|
|
|
bportsDetail(this.form.id).then(res => {
|
caojunjie