New file |
| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> |
| | | <el-form-item label="安装位置" prop="buildingId"> |
| | | <building v-model="queryParams.buildingId" :schoolId="schoolId"></building> |
| | | </el-form-item> |
| | | <el-form-item label="所属单位" prop="organizationId"> |
| | | <organization v-model="queryParams.organizationId" :schoolId="schoolId"></organization> |
| | | </el-form-item> |
| | | <el-form-item label="施工批次" prop="constructionBatchId"> |
| | | <construction-batch v-model="queryParams.constructionBatchId" :schoolId="schoolId"></construction-batch> |
| | | </el-form-item> |
| | | <el-form-item label="型号" prop="model"> |
| | | <el-input |
| | | v-model="queryParams.model" |
| | | placeholder="请输入型号" |
| | | clearable |
| | | size="small" |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="生产厂商" prop="manufacturerId"> |
| | | <manufacturer v-model="queryParams.manufacturerId"></manufacturer> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button> |
| | | <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | <el-row :gutter="10" class="mb8"> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="primary" |
| | | plain |
| | | icon="el-icon-plus" |
| | | size="mini" |
| | | @click="handleAdd" |
| | | v-hasPermi="['oa:ai:add']" |
| | | >新增 |
| | | </el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="success" |
| | | plain |
| | | icon="el-icon-edit" |
| | | size="mini" |
| | | :disabled="single" |
| | | @click="handleUpdate" |
| | | v-hasPermi="['oa:ai:edit']" |
| | | >修改 |
| | | </el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="danger" |
| | | plain |
| | | icon="el-icon-delete" |
| | | size="mini" |
| | | :disabled="multiple" |
| | | @click="handleDelete" |
| | | v-hasPermi="['oa:ai:remove']" |
| | | >删除 |
| | | </el-button> |
| | | </el-col> |
| | | </el-row> |
| | | |
| | | <el-table v-loading="loading" :data="aiList" @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="55" align="center"/> |
| | | <el-table-column label="" align="center" prop="id" v-if="true"/> |
| | | <el-table-column label="部署名称" align="center" prop="deploymentName"/> |
| | | <el-table-column label="支持通道" align="center" prop="passageway"> |
| | | <template slot-scope="scope"> |
| | | <dict-tag :options="dict.type.DICT112" :value="scope.row.passageway"/> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="LAN1" align="center" prop="lanOne"/> |
| | | <el-table-column label="IP" align="center" prop="ipOne"/> |
| | | <el-table-column label="LAN2" align="center" prop="lanTwo"/> |
| | | <el-table-column label="IP" align="center" prop="ipTwo"/> |
| | | <el-table-column label="登录账户" align="center" prop="loginAccount"/> |
| | | <el-table-column label="安装位置" align="center" prop="buildingId_dictText"/> |
| | | <el-table-column label="所属单位" align="center" prop="organizationId_dictText"/> |
| | | <el-table-column label="施工批次" align="center" prop="constructionBatchId_dictText"/> |
| | | <el-table-column label="序列号" align="center" prop="serialNumber"/> |
| | | <el-table-column label="型号" align="center" prop="model"/> |
| | | <el-table-column label="生产厂商" align="center" prop="manufacturerId"/> |
| | | <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-view" |
| | | @click="handleInfo(scope.row)" |
| | | >查看 |
| | | </el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['oa:ai:edit']" |
| | | >修改 |
| | | </el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | class="del-btn" |
| | | icon="el-icon-delete" |
| | | @click="handleDelete(scope.row)" |
| | | v-hasPermi="['oa:ai:remove']" |
| | | >删除 |
| | | </el-button> |
| | | </template> |
| | | </el-table-column> |
| | | </el-table> |
| | | |
| | | <pagination |
| | | v-show="total>0" |
| | | :total="total" |
| | | :page.sync="queryParams.pageNum" |
| | | :limit.sync="queryParams.pageSize" |
| | | @pagination="getList" |
| | | /> |
| | | |
| | | <!-- 添加或修改AI设备对话框 --> |
| | | <el-dialog :title="title" :visible.sync="open" width="700px" :append-to-body="true" :close-on-click-modal="false"> |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="80px" :disabled="disabled"> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="部署名称" prop="deploymentName"> |
| | | <el-input v-model="form.deploymentName" maxlength="64" show-word-limit placeholder="请输入部署名称"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="通道" prop="passageway"> |
| | | <el-select v-model="form.passageway" placeholder="请选择通道"> |
| | | <el-option |
| | | v-for="dict in dict.type.DICT112" |
| | | :key="dict.value" |
| | | :label="dict.label" |
| | | :value="dict.value" |
| | | ></el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="LAN1" prop="lanOne"> |
| | | <el-input v-model="form.lanOne" placeholder="请输入LAN1"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="IP" prop="ipOne"> |
| | | <el-input v-model="form.ipOne" placeholder="请输入IP"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="LAN2" prop="lanTwo"> |
| | | <el-input v-model="form.lanTwo" placeholder="请输入LAN2"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="IP" prop="ipTwo"> |
| | | <el-input v-model="form.ipTwo" placeholder="请输入IP"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | <el-form-item label="登录账户" prop="loginAccount"> |
| | | <el-input v-model="form.loginAccount" maxlength="64" show-word-limit placeholder="请输入登录账户"/> |
| | | </el-form-item> |
| | | <el-form-item label="安装位置" prop="buildingId"> |
| | | <building v-if="open" v-model="form.buildingId" :schoolId="schoolId"></building> |
| | | </el-form-item> |
| | | <el-form-item label="所属单位" prop="organizationId"> |
| | | <organization v-if="open" v-model="form.organizationId" :schoolId="schoolId"></organization> |
| | | </el-form-item> |
| | | <el-form-item label="施工批次" prop="constructionBatchId"> |
| | | <constructionBatch v-if="open" v-model="form.constructionBatchId" :schoolId="schoolId"></constructionBatch> |
| | | </el-form-item> |
| | | <el-form-item label="序列号" prop="serialNumber"> |
| | | <el-input v-model="form.serialNumber" maxlength="64" show-word-limit placeholder="请输入序列号"/> |
| | | </el-form-item> |
| | | <el-row> |
| | | <el-col :span="12"> |
| | | <el-form-item label="型号" prop="model"> |
| | | <el-input v-model="form.model" maxlength="64" show-word-limit placeholder="请输入型号"/> |
| | | </el-form-item> |
| | | </el-col> |
| | | <el-col :span="12"> |
| | | <el-form-item label="生产厂商" prop="manufacturerId"> |
| | | <manufacturer v-model="form.manufacturerId"></manufacturer> |
| | | </el-form-item> |
| | | </el-col> |
| | | </el-row> |
| | | </el-form> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button :loading="buttonLoading" type="primary" @click="submitForm" :disabled="disabled">确 定</el-button> |
| | | <el-button @click="cancel">取 消</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import {listAi, getAi, delAi, addAi, updateAi} from "@/api/oa/ai"; |
| | | import building from "../../components/building"; |
| | | import organization from "../../components/organization"; |
| | | import constructionBatch from "../../components/constructionBatch"; |
| | | import manufacturer from "../../components/manufacturer"; |
| | | import nvr from "../../components/nvr"; |
| | | |
| | | export default { |
| | | name: "Ai", |
| | | dicts: ['DICT112'], |
| | | props: { |
| | | schoolId: { |
| | | type: Number, |
| | | default: undefined |
| | | } |
| | | }, |
| | | components: { |
| | | building, |
| | | organization, |
| | | constructionBatch, |
| | | manufacturer, |
| | | nvr |
| | | }, |
| | | data() { |
| | | return { |
| | | // 按钮loading |
| | | buttonLoading: false, |
| | | // 遮罩层 |
| | | loading: true, |
| | | // 选中数组 |
| | | ids: [], |
| | | // 非单个禁用 |
| | | single: true, |
| | | // 非多个禁用 |
| | | multiple: true, |
| | | // 显示搜索条件 |
| | | showSearch: true, |
| | | // 总条数 |
| | | total: 0, |
| | | // AI设备表格数据 |
| | | aiList: [], |
| | | // 弹出层标题 |
| | | title: "", |
| | | // 是否显示弹出层 |
| | | open: false, |
| | | // 查询参数 |
| | | queryParams: { |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | buildingId: undefined, |
| | | organizationId: undefined, |
| | | constructionBatchId: undefined, |
| | | model: undefined, |
| | | manufacturerId: undefined, |
| | | }, |
| | | // 表单参数 |
| | | form: {}, |
| | | // 表单校验 |
| | | rules: { |
| | | id: [ |
| | | {required: true, message: "不能为空", trigger: "blur"} |
| | | ], |
| | | deploymentName: [ |
| | | {required: true, message: "部署名称不能为空", trigger: "blur"} |
| | | ], |
| | | passageway: [ |
| | | {required: true, message: "通道不能为空", trigger: "change"} |
| | | ], |
| | | lanOne: [ |
| | | {required: true, message: "LAN1不能为空", trigger: "blur"}, |
| | | { |
| | | pattern: /^[A-F0-9]{2}(-[A-F0-9]{2}){5}$|^[A-F0-9]{2}(:[A-F0-9]{2}){5}$|^[A-F0-9]{12}$|^[A-F0-9]{4}(\.[A-F0-9]{4}){2}$/, |
| | | message: "请输入正确的LAN1", |
| | | trigger: "blur" |
| | | } |
| | | ], |
| | | ipOne: [ |
| | | {required: true, message: "IP不能为空", trigger: "blur"}, |
| | | { |
| | | pattern: /^(\d|[1-9]\d|1\d{2}|2[0-5][0-5])\.(\d|[1-9]\d|1\d{2}|2[0-5][0-5])\.(\d|[1-9]\d|1\d{2}|2[0-5][0-5])\.(\d|[1-9]\d|1\d{2}|2[0-5][0-5])$/, |
| | | message: "请输入正确的ip地址", |
| | | trigger: "blur" |
| | | } |
| | | ], |
| | | lanTwo: [ |
| | | { |
| | | pattern: /^[A-F0-9]{2}(-[A-F0-9]{2}){5}$|^[A-F0-9]{2}(:[A-F0-9]{2}){5}$|^[A-F0-9]{12}$|^[A-F0-9]{4}(\.[A-F0-9]{4}){2}$/, |
| | | message: "请输入正确的LAN2", |
| | | trigger: "blur" |
| | | } |
| | | ], |
| | | ipTwo: [ |
| | | { |
| | | pattern: /^(\d|[1-9]\d|1\d{2}|2[0-5][0-5])\.(\d|[1-9]\d|1\d{2}|2[0-5][0-5])\.(\d|[1-9]\d|1\d{2}|2[0-5][0-5])\.(\d|[1-9]\d|1\d{2}|2[0-5][0-5])$/, |
| | | message: "请输入正确的ip地址", |
| | | trigger: "blur" |
| | | } |
| | | ], |
| | | buildingId: [ |
| | | {required: true, message: "安装位置不能为空", trigger: "blur"} |
| | | ], |
| | | organizationId: [ |
| | | {required: true, message: "所属单位不能为空", trigger: "blur"} |
| | | ], |
| | | constructionBatchId: [ |
| | | {required: true, message: "施工批次不能为空", trigger: "blur"} |
| | | ], |
| | | }, |
| | | disabled: false |
| | | }; |
| | | }, |
| | | created() { |
| | | this.getList(); |
| | | }, |
| | | methods: { |
| | | /** 查询AI设备列表 */ |
| | | getList() { |
| | | this.loading = true; |
| | | listAi(Object.assign({}, this.queryParams, {schoolId: this.schoolId})).then(response => { |
| | | this.aiList = response.rows; |
| | | this.total = response.total; |
| | | this.loading = false; |
| | | }); |
| | | }, |
| | | // 取消按钮 |
| | | cancel() { |
| | | this.open = false; |
| | | this.reset(); |
| | | }, |
| | | // 表单重置 |
| | | reset() { |
| | | this.form = { |
| | | id: undefined, |
| | | deploymentName: undefined, |
| | | passageway: undefined, |
| | | lanOne: undefined, |
| | | ipOne: undefined, |
| | | lanTwo: undefined, |
| | | ipTwo: undefined, |
| | | loginAccount: undefined, |
| | | buildingId: undefined, |
| | | organizationId: undefined, |
| | | constructionBatchId: undefined, |
| | | serialNumber: undefined, |
| | | model: undefined, |
| | | manufacturerId: undefined, |
| | | createTime: undefined, |
| | | createBy: undefined, |
| | | updateBy: undefined, |
| | | updateTime: undefined, |
| | | delFlag: undefined |
| | | }; |
| | | this.resetForm("form"); |
| | | }, |
| | | /** 搜索按钮操作 */ |
| | | handleQuery() { |
| | | this.queryParams.pageNum = 1; |
| | | this.getList(); |
| | | }, |
| | | /** 重置按钮操作 */ |
| | | resetQuery() { |
| | | this.resetForm("queryForm"); |
| | | this.handleQuery(); |
| | | }, |
| | | // 多选框选中数据 |
| | | handleSelectionChange(selection) { |
| | | this.ids = selection.map(item => item.id) |
| | | this.single = selection.length !== 1 |
| | | this.multiple = !selection.length |
| | | }, |
| | | /** 新增按钮操作 */ |
| | | handleAdd() { |
| | | this.reset(); |
| | | this.disabled = false; |
| | | this.open = true; |
| | | this.title = "添加AI设备"; |
| | | }, |
| | | /** 修改按钮操作 */ |
| | | handleUpdate(row) { |
| | | this.loading = true; |
| | | this.disabled = false; |
| | | this.reset(); |
| | | const id = row.id || this.ids |
| | | getAi(id).then(response => { |
| | | this.loading = false; |
| | | this.form = response.data; |
| | | this.open = true; |
| | | this.title = "修改AI设备"; |
| | | }); |
| | | }, |
| | | handleInfo(row) { |
| | | this.loading = true; |
| | | this.disabled = true; |
| | | this.reset(); |
| | | getAi(row.id).then(response => { |
| | | this.loading = false; |
| | | this.form = response.data; |
| | | this.open = true; |
| | | this.title = "AI设备详情"; |
| | | }); |
| | | }, |
| | | /** 提交按钮 */ |
| | | submitForm() { |
| | | this.$refs["form"].validate(valid => { |
| | | if (valid) { |
| | | this.buttonLoading = true; |
| | | this.form.schoolId = this.schoolId; |
| | | if (this.form.id != null) { |
| | | updateAi(this.form).then(response => { |
| | | this.$modal.msgSuccess("修改成功"); |
| | | this.open = false; |
| | | this.getList(); |
| | | }).finally(() => { |
| | | this.buttonLoading = false; |
| | | }); |
| | | } else { |
| | | addAi(this.form).then(response => { |
| | | this.$modal.msgSuccess("新增成功"); |
| | | this.open = false; |
| | | this.getList(); |
| | | }).finally(() => { |
| | | this.buttonLoading = false; |
| | | }); |
| | | } |
| | | } |
| | | }); |
| | | }, |
| | | /** 删除按钮操作 */ |
| | | handleDelete(row) { |
| | | const ids = row.id || this.ids; |
| | | this.$modal.confirm('是否确认删除AI设备编号为"' + ids + '"的数据项?').then(() => { |
| | | this.loading = true; |
| | | return delAi(ids); |
| | | }).then(() => { |
| | | this.loading = false; |
| | | this.getList(); |
| | | this.$modal.msgSuccess("删除成功"); |
| | | }).finally(() => { |
| | | this.loading = false; |
| | | }); |
| | | }, |
| | | /** 导出按钮操作 */ |
| | | handleExport() { |
| | | this.download('oa/ai/export', { |
| | | ...this.queryParams |
| | | }, `ai_${new Date().getTime()}.xlsx`) |
| | | } |
| | | } |
| | | }; |
| | | </script> |