<template> <div> <div class="crumbs"> <el-breadcrumb separator="/"> <el-breadcrumb-item> <i class="el-icon-lx-cascades"></i> 体系配置 </el-breadcrumb-item> </el-breadcrumb> </div> <div class="container" v-if="hasObject('options')"> <div class="handle-box"> <el-form @submit.native.prevent> <el-input v-model="query.keyword" placeholder="id" class="handle-input mr10" @keyup.enter.native="search" > </el-input> <el-select v-model="query.tab" placeholder="类别" class="handle-select mr10" > <el-option key="" label="全副" value="">全副</el-option> <el-option v-for="(item, key) in options.checkSystemTab" :key="key" :label="item" :value="key" > {{ item }} </el-option> </el-select> <el-select v-model="query.tpl" placeholder="模板" class="handle-select-tpl mr10" > <el-option v-for="(item, key) in options.webConfigKV['tpl']" :key="key" :label="item" :value="key" > {{ item }} </el-option> </el-select> <el-button type="primary" icon="el-icon-search" @click="search" >搜寻</el-button > <el-button type="primary" @click="addCheck">增加</el-button> <el-button type="primary" @click="eximportVisible = true" >导入导出</el-button > <el-button type="primary" @click="referVisible = true">查看参考</el-button> </el-form> </div> <el-table :data="tableData" :cell-style="{ background: '#fff' }" border tooltip-effect="dark" style="width: 100%" > <el-table-column prop="id" label="ID" width="100" align="center" ></el-table-column> <el-table-column prop="control" label="管制项" min-width="200" ></el-table-column> <el-table-column prop="desc" label="形容" width="250"></el-table-column> <el-table-column prop="purpose" label="查看目标" width="250" ></el-table-column> <el-table-column label="类别" width="100"> <template slot-scope="scope"> {{ options.checkSystemTab[scope.row.tab] || "" }} </template> </el-table-column> <el-table-column label="操作" width="180" align="center"> <template slot-scope="scope"> <el-button type="text" icon="el-icon-edit" @click="editCheck(scope.row.id, 'edit')" ></el-button> <el-button type="text" icon="el-icon-view" :title="'预览法律依据[' + scope.row.id + ']'" @click="editCheck(scope.row.id, 'previewLaw')" > </el-button> <el-button type="text" icon="el-icon-view" :title="'预览规范根据[' + scope.row.id + ']'" @click="editCheck(scope.row.id, 'previewStandard')" ></el-button> <el-button type="text" icon="el-icon-close" title="删除" @click="removeCheck(scope.row.id)" ></el-button> </template> </el-table-column> </el-table> <div class="pagination"> <el-pagination background layout="total, prev, pager, next" :current-page="parseInt(query.page) || 0" :page-size="parseInt(query.limit) || 0" :total="parseInt(query.total) || 0" @current-change="toPage" > </el-pagination> </div> </div> <el-dialog :title="dialogTitle" :visible.sync="popVisible" v-if="popVisible" width="80%"> <el-form :ref="pageName" :rules="rules" :model="check" label-width="100px" > <el-form-item label="ID" prop="id"> <el-input v-model="check.id"></el-input> </el-form-item> <el-form-item label="管制项" prop="control"> <el-input v-model="check.control"></el-input> </el-form-item> <el-form-item label="形容" prop="desc"> <el-input v-model="check.desc"></el-input> </el-form-item> <el-form-item label="查看目标" prop="purpose"> <el-input v-model="check.purpose"></el-input> </el-form-item> <el-form-item label="危险条件" prop="dangerConditions"> <TableDangerCondition :options="options" :instance="check"> </TableDangerCondition> </el-form-item> <el-form-item label="存在条件" prop="conditions"> <el-input :value="JSON.stringify(check.conditions)" @input="handleChange($event, 'conditions')" ></el-input> </el-form-item> <el-form-item label="相干问题" prop="source"> <el-input :value="JSON.stringify(check.source)" @input="handleChange($event, 'source')" ></el-input> </el-form-item> <el-form-item label="类别" prop="tab"> <el-select v-model="check.tab" width="100"> <el-option v-for="(item, key) in options.checkSystemTab" :key="key" :value="key" :label="item" >{{ item }}</el-option ></el-select > </el-form-item> <el-form-item label="规范根据" prop="standard"> <Editor :content="check.standard" ref="standardEditor"></Editor> </el-form-item> <el-form-item label="法律依据" prop="law"> <Editor :content="check.law" ref="lawEditor"></Editor> </el-form-item> <el-form-item label="模板" prop="tpl"> <el-select v-model="check.tpl" class="handle-select-tpl"> <el-option v-for="(item, key) in options.webConfigKV['tpl']" :key="key" :value="key" :label="item" >{{ item }}</el-option ></el-select > </el-form-item> </el-form> <span slot="footer" class="dialog-footer"> <el-button @click="popVisible = false">取 消</el-button> <el-button type="primary" @click="saveCheck">确 定</el-button> </span> </el-dialog> <el-dialog title="预览法律依据" :visible.sync="previewVisibleLaw" width="50%" > <div v-html="check.law" class="preview-html"></div> <span slot="footer" class="dialog-footer"> <el-button type="primary" @click="previewVisibleLaw = false" >确 定</el-button > </span> </el-dialog> <el-dialog title="预览规范根据" :visible.sync="previewVisibleStardard" width="50%" > <div v-html="check.standard" class="preview-html"></div> <span slot="footer" class="dialog-footer"> <el-button type="primary" @click="previewVisibleStardard = false" >确 定</el-button > </span> </el-dialog> <ExImport :options="options" :eximportVisible="eximportVisible" @closeExImport="closeExImport" :source="pageName" ></ExImport> <!-- 参考模态框 --> <Refer :referVisible="referVisible" @closeRefer="closeRefer"></Refer> </div></template><script>import { Common } from "@admin/mixin/common";import { Has } from "@admin/mixin/has";import { Rules } from "@admin/mixin/rules";import { Library } from "@admin/mixin/library";import Editor from "../common/editor";import TableDangerCondition from "./tableDangerCondition.vue";import ExImport from "./eximport.vue";import Refer from "./refer.vue";export default { mixins: [Common, Rules, Has, Library], name: "CheckSystem", components: { Editor, TableDangerCondition, ExImport, Refer, }, data() { return { pageName: "checkSystem", check: {}, rulesInfo: { id: "请输出id", control: "请输出管制项", desc: "请输出形容", purpose: "请输出查看目标", tpl: "请抉择模板", }, }; }, methods: { handleChange(e, field) { this.check[field] = JSON.parse(e); }, }, mounted() { this.getCheckDict(); },};</script>