| | |
| | | <template> |
| | | <div class="app-container"> |
| | | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px"> |
| | | <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch"> |
| | | <el-form-item label="点位名称" prop="pointName"> |
| | | <el-input |
| | | v-model="queryParams.pointName" |
| | | placeholder="请输入点位名称" |
| | | clearable |
| | | @keyup.enter.native="handleQuery" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="点位开始时间" prop="startTime"> |
| | | <el-date-picker clearable |
| | | v-model="queryParams.startTime" |
| | | type="date" |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="请选择点位开始时间"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | <el-form-item label="点位结束时间" prop="endTime"> |
| | | <el-date-picker clearable |
| | | v-model="queryParams.endTime" |
| | | type="date" |
| | | value-format="yyyy-MM-dd" |
| | | placeholder="请选择点位结束时间"> |
| | | </el-date-picker> |
| | | <el-input v-model="queryParams.pointName" placeholder="输入点位名称" clearable @keyup.enter.native="handleQuery" /> |
| | | </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-button type="primary" icon="el-icon-search" size="small" @click="handleQuery">搜索</el-button> |
| | | <el-button icon="el-icon-refresh" size="small" @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"--> |
| | | <!-- >新增</el-button>--> |
| | | <!-- </el-col>--> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="primary" |
| | | plain |
| | | icon="el-icon-plus" |
| | | size="mini" |
| | | @click="handleAdd" |
| | | >新增</el-button> |
| | | <el-button type="success" plain icon="el-icon-edit" size="mini" :disabled="single" @click="handleUpdate" |
| | | v-hasPermi="['point:edit']">修改</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="success" |
| | | plain |
| | | icon="el-icon-edit" |
| | | size="mini" |
| | | :disabled="single" |
| | | @click="handleUpdate" |
| | | >修改</el-button> |
| | | <el-button type="danger" plain icon="el-icon-delete" size="mini" :disabled="multiple" @click="handleDelete" |
| | | v-hasPermi="['point:remove']">删除</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="danger" |
| | | plain |
| | | icon="el-icon-delete" |
| | | size="mini" |
| | | :disabled="multiple" |
| | | @click="handleDelete" |
| | | >删除</el-button> |
| | | <el-button type="primary" plain icon="el-icon-top" v-loading="download" size="mini" @click="handleExport" |
| | | v-hasPermi="['point:export']">导出点位</el-button> |
| | | </el-col> |
| | | <el-col :span="1.5"> |
| | | <el-button |
| | | type="warning" |
| | | plain |
| | | icon="el-icon-download" |
| | | size="mini" |
| | | @click="handleExport" |
| | | v-hasPermi="['x:point:export']" |
| | | >导出</el-button> |
| | | <el-popover> |
| | | <div class="bottom_"> |
| | | <p>导入点位只做更新操作</p> |
| | | </div> |
| | | <div class="bottom_"> |
| | | <el-switch |
| | | v-model="needUpdateUnit" |
| | | active-text="修改运维单位/时间" |
| | | inactive-text="不修改运维单位/时间"> |
| | | </el-switch> |
| | | </div> |
| | | <div class="bottom_" v-show="needUpdateUnit"> |
| | | <el-select @change="getUnitContractTime" v-model="importUnitId" size="small" placeholder="更换运维单位"> |
| | | <el-option v-for="unit in unitList" :key="unit.id" :label="unit.value" :value="unit.id"></el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="bottom_" v-show="needUpdateUnit"> |
| | | <el-select @change="showTimeRange" v-model="contractId" size="small" placeholder="运维合同" :disabled="! importUnitId"> |
| | | <el-option v-for="(time, index) in timeList" :key="index" :label="time.name" :value="time.id"></el-option> |
| | | </el-select> |
| | | <span style="margin-left: 10px;color: #8a8989" v-show="importUnitId">该单位有{{timeList.length}}个合同</span> |
| | | </div> |
| | | <div class="bottom_" v-show="needUpdateUnit"> |
| | | <el-date-picker |
| | | :disabled="! contractId" |
| | | size="small" |
| | | v-model="ywTimes" |
| | | type="daterange" |
| | | range-separator="至" |
| | | start-placeholder="更换运维时间" |
| | | end-placeholder="更换运维时间"> |
| | | </el-date-picker> |
| | | </div> |
| | | <div class="bottom_"> |
| | | <el-upload |
| | | ref="upload" |
| | | class="upload-demo" |
| | | drag |
| | | :action="importUrl" |
| | | :file-list="fileList" |
| | | :before-upload="beforeUpload" |
| | | > |
| | | <i class="el-icon-upload"></i> |
| | | <div class="el-upload__text">将文件拖到此处,或<em>点击上传</em></div> |
| | | <div class="el-upload__tip" slot="tip">只能上传xls/xlsx文件</div> |
| | | </el-upload> |
| | | </div> |
| | | <div> |
| | | <el-button class="bottom_" type="primary" size="small" v-loading="upload" @click="handleImport" |
| | | v-hasPermi="['point:import']">导入</el-button> |
| | | </div> |
| | | <el-button type="primary" size="mini" plain icon="el-icon-bottom" slot="reference" v-hasPermi="['point:import']">导入点位</el-button> |
| | | </el-popover> |
| | | </el-col> |
| | | <!-- <el-col :span="1.5">--> |
| | | <!-- <el-button type="danger" plain icon="el-icon-receiving" size="mini" @click="handleEditBatch"--> |
| | | <!-- v-hasPermi="['point:edit']">批量修改</el-button>--> |
| | | <!-- </el-col>--> |
| | | <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> |
| | | </el-row> |
| | | |
| | | <el-table v-loading="loading" :data="pointList" @selection-change="handleSelectionChange"> |
| | | <el-table-column type="selection" width="55" align="center" /> |
| | | <el-table-column label="点位名称" align="center" prop="pointName" /> |
| | | <el-table-column label="点位开始时间" align="center" prop="startTime" width="180"> |
| | | <el-table-column label="点位名称" prop="pointName" width="200" show-overflow-tooltip/> |
| | | <el-table-column label="标签" align="center" width="200" show-overflow-tooltip> |
| | | <template slot-scope="scope"> |
| | | <span>{{ parseTime(scope.row.startTime, '{y}-{m}-{d}') }}</span> |
| | | <!-- 使用计算属性来显示拼接后的文本 --> |
| | | <div>{{ getTagText(scope.row) }}</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="点位结束时间" align="center" prop="endTime" width="180"> |
| | | <template slot-scope="scope"> |
| | | <span>{{ parseTime(scope.row.endTime, '{y}-{m}-{d}') }}</span> |
| | | </template> |
| | | <el-table-column label="运维开始时间" align="center" prop="startTime" width="140"> |
| | | </el-table-column> |
| | | <el-table-column label="运维结束时间" align="center" prop="endTime" width="140"> |
| | | </el-table-column> |
| | | <el-table-column label="运维单位" align="center" prop="unitName" /> |
| | | <el-table-column label="监管部门" align="center" prop="deptName" /> |
| | | <el-table-column label="运维类别" align="center" prop="category"> |
| | | <template slot-scope="scope"> |
| | | <div v-if="scope.row.category === 1">视频监控</div> |
| | | <div v-else-if="scope.row.category === 2">车辆识别</div> |
| | | <div v-else-if="scope.row.category === 3">人脸识别</div> |
| | | </template> |
| | | </el-table-column> |
| | | <el-table-column label="运维状态" align="center" prop="status" /> |
| | | <el-table-column label="备注" align="center" prop="remark" /> |
| | | <el-table-column label="操作" align="center" class-name="small-padding fixed-width"> |
| | | <el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width"> |
| | | <template slot-scope="scope"> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-edit" |
| | | @click="handleUpdate(scope.row)" |
| | | >修改</el-button> |
| | | <el-button |
| | | size="mini" |
| | | type="text" |
| | | icon="el-icon-delete" |
| | | @click="handleDelete(scope.row)" |
| | | >删除</el-button> |
| | | <el-button size="mini" type="text" icon="el-icon-edit" @click="handleUpdate(scope.row)" |
| | | v-hasPermi="['point:edit']">修改</el-button> |
| | | <el-button size="mini" type="text" icon="el-icon-delete" @click="handleDelete(scope.row)" |
| | | v-hasPermi="['point: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" |
| | | /> |
| | | <pagination v-show="total > 0" :total="total" :page.sync="queryParams.pageNum" :limit.sync="queryParams.pageSize" |
| | | @pagination="getList" /> |
| | | |
| | | <!-- 添加运维点位对话框 --> |
| | | <el-dialog :title="title" :visible.sync="open" width="900px" append-to-body> |
| | | <el-form ref="form" :model="tempForm" :rules="rules" label-width="120px"> |
| | | <el-form-item label="点位名称" prop="pointName"> |
| | | <el-input v-model="tempForm.pointName" placeholder="请输入点位名称" /> |
| | | </el-form-item> |
| | | <el-form-item label="运维单位" prop="unitId"> |
| | | <el-select v-model="tempForm.unitId" placeholder="运维单位"> |
| | | <el-option |
| | | v-for="item in unitList" |
| | | :key="item.id" |
| | | :label="item.value" |
| | | :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="点位时区" prop="timezone"> |
| | | <el-date-picker |
| | | @change="dateChange" |
| | | v-model="tempForm.timezone" |
| | | type="daterange" |
| | | align="right" |
| | | unlink-panels |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | > |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <div style="display: flex;flex-direction: row-reverse"> |
| | | <el-button @click="nextAdd" type="primary" plain>继续添加</el-button> |
| | | </div> |
| | | </el-form-item> |
| | | <div class="point-row" v-for="(point,index) in tempFormList"> |
| | | <div class="row-item"> |
| | | <el-input :disabled="editingIndex!==index" v-model="point.pointName" placeholder="点位名称"></el-input> |
| | | </div> |
| | | <div class="row-item"> |
| | | <el-select :disabled="editingIndex!==index" v-model="point.unitId" placeholder="运维单位"> |
| | | <el-option |
| | | v-for="item in unitList" |
| | | :key="item.id" |
| | | :label="item.value" |
| | | :value="item.id"> |
| | | <div style="display: flex;flex-direction: row"> |
| | | <div style="flex: 5; border-right: 1px solid #d3d3d3; padding-right: 10px"> |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="130px"> |
| | | <el-form-item label="点位名称" prop="pointName"> |
| | | <el-input v-model="form.pointName" placeholder="请输入点位名称" /> |
| | | </el-form-item> |
| | | <el-form-item label="监管部门" prop="deptId"> |
| | | <el-cascader v-model="form.deptId" :options="deptOptions" :show-all-levels="false" clearable |
| | | :props="{ checkStrictly: true }"> |
| | | </el-cascader> |
| | | </el-form-item> |
| | | <el-form-item label="运维单位" prop="unitId"> |
| | | <el-select v-model="form.unitId" placeholder="运维单位"> |
| | | <el-option v-for="item in unitList" :key="item.id" :label="item.value" :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </div> |
| | | <div class="row-item"> |
| | | </el-form-item> |
| | | <el-form-item label="运维时间" prop="timezone"> |
| | | <el-date-picker |
| | | :disabled="editingIndex!==index" |
| | | v-model="point.timezone" |
| | | size="small" |
| | | v-model="timezone" |
| | | type="daterange" |
| | | align="right" |
| | | unlink-panels |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | > |
| | | start-placeholder="运维开始时间" |
| | | end-placeholder="运维结束时间"> |
| | | </el-date-picker> |
| | | </div> |
| | | <div class="row-item"> |
| | | <el-button v-show="editingIndex!==index" @click="editPointItem(index)" type="danger" size="small" plain>修改</el-button> |
| | | <el-button v-show="editingIndex===index" @click="editFinishItem(index)" type="success" size="small" plain>完成</el-button> |
| | | </div> |
| | | </div> |
| | | </el-form> |
| | | </el-form-item> |
| | | <el-form-item label="点位备注" prop="remark"> |
| | | <el-input type="textarea" v-model="form.remark"/> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | <div style="flex: 5"> |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="130px"> |
| | | <el-form-item label="重点:" prop="importantTag"> |
| | | <el-switch |
| | | v-model="form.importantTag" |
| | | active-color="#13ce66" |
| | | inactive-color="gray" |
| | | active-text="重点点位" |
| | | inactive-text="普通点位"> |
| | | </el-switch> |
| | | </el-form-item> |
| | | <el-form-item label="省厅:" prop="provinceTag"> |
| | | <el-switch |
| | | v-model="form.provinceTag" |
| | | active-color="#13ce66" |
| | | inactive-color="gray" |
| | | active-text="省厅点位" |
| | | inactive-text="普通点位"> |
| | | </el-switch> |
| | | </el-form-item> |
| | | <el-form-item label="部级:" prop="deptTag"> |
| | | <el-switch |
| | | v-model="form.deptTag" |
| | | active-color="#13ce66" |
| | | inactive-color="gray" |
| | | active-text="部级点位" |
| | | inactive-text="普通点位"> |
| | | </el-switch> |
| | | </el-form-item> |
| | | <el-form-item label="重点指挥图像:" prop="importantCommandImageTag"> |
| | | <el-switch |
| | | v-model="form.importantCommandImageTag" |
| | | active-color="#13ce66" |
| | | inactive-color="gray" |
| | | active-text="重点指挥图像点位" |
| | | inactive-text="普通点位"> |
| | | </el-switch> |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | | </div> |
| | | </div> |
| | | |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button type="primary" @click="submitForm">确 定</el-button> |
| | | <el-button @click="cancel">取 消</el-button> |
| | | <el-button type="primary" @click="submitForm">确 定</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | <!-- 修改运维点位对话框 --> |
| | | <el-dialog :title="title" :visible.sync="editOpen" width="500px" append-to-body> |
| | | <el-form ref="form" :model="form" :rules="rules" label-width="120px"> |
| | | <el-form-item label="点位名称" prop="pointName"> |
| | | <el-input v-model="form.pointName" placeholder="请输入点位名称" /> |
| | | <!-- 批量修改运维单位 --> |
| | | <el-dialog title="批量修改运维单位" :visible.sync="batchOpen" width="600px" append-to-body> |
| | | <el-form ref="form" :model="batchEditForm" :rules="batchRules" label-width="120px"> |
| | | <el-form-item label="点位选择" prop="ids"> |
| | | <el-cascader @change="cos" v-model="batchEditForm.ids" :options="regionList" placeholder="请选择区域" |
| | | :props="props" collapse-tags></el-cascader> |
| | | </el-form-item> |
| | | <el-form-item label="运维单位" prop="unitId"> |
| | | <el-select v-model="form.unitId" placeholder="运维单位"> |
| | | <el-option |
| | | v-for="item in unitList" |
| | | :key="item.id" |
| | | :label="item.value" |
| | | :value="item.id"> |
| | | <el-select v-model="batchEditForm.unitId" placeholder="选择运维单位"> |
| | | <el-option v-for="item in unitList" :key="item.id" :label="item.value" :value="item.id"> |
| | | </el-option> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="点位时区" prop="timezone"> |
| | | <el-date-picker |
| | | @change="dateChange" |
| | | v-model="form.timezone" |
| | | type="daterange" |
| | | align="right" |
| | | unlink-panels |
| | | range-separator="至" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | > |
| | | <el-form-item label="运维时间段" prop="timezone"> |
| | | <el-date-picker v-model="batchEditForm.timezone" type="daterange" align="right" |
| | | unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> |
| | | </el-date-picker> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div slot="footer" class="dialog-footer"> |
| | | <el-button type="primary" @click="submitForm">确 定</el-button> |
| | | <el-button @click="updateCancel">取 消</el-button> |
| | | <el-button @click="cancelBatchEdit">取 消</el-button> |
| | | <el-button type="primary" @click="submitBatchEdit">确 定</el-button> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { listPoint, getPoint, delPoint, addPoint, addPointBatch, updatePoint } from "@/api/platform/point"; |
| | | import { listPoint, getPoint, delPoint, addPoint, batchEdit, updatePoint, exportData, importData, timeRange } from "@/api/platform/point"; |
| | | import { unitSelect } from "@/api/platform/unit"; |
| | | import { getCascader } from '@/api/platform/region' |
| | | import { cascader } from '@/api/system/dept' |
| | | |
| | | export default { |
| | | name: "Point", |
| | | dicts: ['point_tag', 'area_code'], |
| | | data() { |
| | | return { |
| | | // 正在修改第几个 |
| | | editingIndex: null, |
| | | needUpdateUnit: false, |
| | | importantTag: false, |
| | | provinceTag: false, |
| | | importantCommandImageTag: false, |
| | | timeList: [], |
| | | timezone: [], |
| | | ywTimes: [], |
| | | fileList: [], |
| | | importFile: null, |
| | | importUrl: '', |
| | | importUnitId: null, |
| | | contractId: null, |
| | | download: false, |
| | | upload: false, |
| | | deptOptions: [], |
| | | // 批量修改表单 |
| | | batchEditForm: { |
| | | ids: [], |
| | | unitId: null, |
| | | timezone: null, |
| | | }, |
| | | // 批量修改弹窗 |
| | | batchOpen: false, |
| | | props: { multiple: true }, |
| | | regionList: [], |
| | | // 遮罩层 |
| | | loading: true, |
| | | // 选中数组 |
| | |
| | | editOpen: false, |
| | | // 运维单位 |
| | | unitList: [], |
| | | // 运维时区 |
| | | timezone:[], |
| | | // 查询参数 |
| | | queryParams: { |
| | | pageNum: 1, |
| | | pageSize: 10, |
| | | pointName: null, |
| | | startTime: null, |
| | | endTime: null, |
| | | unitId: null, |
| | | status: null, |
| | | }, |
| | | // 表单参数 |
| | | form: {}, |
| | | // 批量表单内容 |
| | | formList:[], |
| | | // 临时表单数据 |
| | | tempForm: {}, |
| | | // 临时表单数据列表 |
| | | tempFormList: [], |
| | | form: { |
| | | }, |
| | | // 表单校验 |
| | | rules: { |
| | | pointName: [ |
| | | { required: true, message: "点位名称不能为空", trigger: "blur" } |
| | | ], |
| | | timezone: [ |
| | | { required: true, message: "点位时区不能为空", trigger: "blur" } |
| | | deptId: [ |
| | | { required: true, message: "监管部门不能为空", trigger: "change" } |
| | | ], |
| | | unitId: [ |
| | | { required: true, message: "运维单位不能为空", trigger: "change" } |
| | | category: [ |
| | | { required: true, message: "设备类型", trigger: "change" } |
| | | ], |
| | | }, |
| | | // 批量表单校验 |
| | | batchRules: { |
| | | ids: [ |
| | | { required: true, message: "请选择点位", trigger: "change" } |
| | | ] |
| | | } |
| | | }; |
| | | }, |
| | | created() { |
| | | this.getList(); |
| | | this.getUnitSelect(); |
| | | // this.getCascader(); |
| | | this.getDeptCascader(); |
| | | }, |
| | | methods: { |
| | | // 点位项修改完成 |
| | | editFinishItem(index) { |
| | | this.editingIndex = null; |
| | | let form = this.tempFormList[index]; |
| | | form.startTime = form.timezone[0]; |
| | | form.endTime = form.timezone[1]; |
| | | this.formList[index] = form; |
| | | getTagText(row) { |
| | | let text = ''; |
| | | |
| | | // 检查每个标签,如果为true,则添加到text中 |
| | | if (row.importantTag) text += '重点点位、'; |
| | | if (row.provinceTag) text += '省厅点位、'; |
| | | if (row.importantCommandImageTag) text += '重点指挥图像、'; |
| | | if (row.deptTag) text += '部级、'; |
| | | text === '' ? '普通点位' : text |
| | | // 返回拼接后的文本和固定文字 |
| | | return text.replace(/、$/, '') |
| | | }, |
| | | // 点位项修改 |
| | | editPointItem(index) { |
| | | if (this.editingIndex !== index && this.editingIndex !== null) { |
| | | this.$modal.msgWarning("请先完成上一个修改"); |
| | | } else { |
| | | this.editingIndex = index; |
| | | this.tempFormList[index] = this.formList[index]; |
| | | getUnitContractTime(unitId) { |
| | | this.ywTimes = [] |
| | | this.contractId = null; |
| | | timeRange(unitId).then(res => { |
| | | this.timeList = res.data; |
| | | }) |
| | | }, |
| | | showTimeRange(contractId) { |
| | | let a = this.timeList.filter(item => item.id === contractId) |
| | | if (a.length < 1) { |
| | | this.ywTimes = [] |
| | | return |
| | | } |
| | | let target = a[0] |
| | | this.ywTimes = [target.startTime, target.endTime] |
| | | }, |
| | | beforeUpload(file) { |
| | | this.importFile = file |
| | | this.fileList = [file] |
| | | return false |
| | | }, |
| | | // 点位导入 |
| | | handleImport() { |
| | | this.upload =true; |
| | | let formData = new FormData() |
| | | formData.append("file", this.importFile) |
| | | formData.append("startTime", this.ywTimes[0] ? this.ywTimes[0] : '') |
| | | formData.append("endTime", this.ywTimes[1] ? this.ywTimes[1] : '') |
| | | formData.append("unitId", this.importUnitId ? this.importUnitId : -1) |
| | | formData.append("needUpdateUnit", this.needUpdateUnit) |
| | | importData(formData).then(res => { |
| | | this.$message.success("导入成功") |
| | | this.upload = false |
| | | this.getList() |
| | | }) |
| | | }, |
| | | // 点位导出 |
| | | handleExport() { |
| | | this.download = true |
| | | exportData(this.queryParams).then(res => { |
| | | // 将二进制数据转换为 Blob 对象 |
| | | let blob = new Blob([res], { type: 'application/octet-stream' }); |
| | | |
| | | // 创建下载链接 |
| | | let downloadLink = document.createElement('a'); |
| | | downloadLink.href = URL.createObjectURL(blob); |
| | | downloadLink.setAttribute('download', "点位更换运维单位.xlsx"); // 设置下载文件的文件名 |
| | | downloadLink.style.display = 'none'; |
| | | // 添加到页面并触发下载 |
| | | document.body.appendChild(downloadLink); |
| | | downloadLink.click(); |
| | | document.body.removeChild(downloadLink); |
| | | this.download = false |
| | | }) |
| | | }, |
| | | cos(value) { |
| | | console.log(value) |
| | | }, |
| | | // 提交批量修改 |
| | | submitBatchEdit() { |
| | | this.batchEditForm.ids = this.batchEditForm.ids.map(array => array[array.length - 1]); |
| | | if (this.batchEditForm.timezone) { |
| | | this.batchEditForm.startTime = this.batchEditForm.timezone[0]; |
| | | this.batchEditForm.endTime = this.batchEditForm.timezone[1]; |
| | | } |
| | | }, |
| | | // 时间选择发生变化 |
| | | dateChange() { |
| | | this.tempForm.startTime = this.tempForm.timezone[0]; |
| | | this.tempForm.endTime = this.tempForm.timezone[1]; |
| | | // 取消批量修改 |
| | | cancelBatchEdit() { |
| | | this.batchOpen = false; |
| | | }, |
| | | // 继续添加点位 |
| | | nextAdd() { |
| | | this.formList.push(this.tempForm); |
| | | this.tempFormList.push(this.tempForm); |
| | | this.tempForm = {}; |
| | | // 批量修改 |
| | | handleEditBatch() { |
| | | this.batchOpen = true; |
| | | }, |
| | | |
| | | // 获取区县级联 |
| | | getCascader() { |
| | | getCascader().then(res => { |
| | | this.regionList = res.data; |
| | | }) |
| | | }, |
| | | // 获取部门级联 |
| | | getDeptCascader() { |
| | | cascader().then(res => { |
| | | this.deptOptions = res.data; |
| | | }) |
| | | }, |
| | | getUnitSelect() { |
| | | // 运维单位下拉列表 |
| | |
| | | this.open = false; |
| | | this.reset(); |
| | | }, |
| | | updateCancel() { |
| | | this.editOpen = false; |
| | | this.reset(); |
| | | }, |
| | | // 表单重置 |
| | | reset() { |
| | | this.form = { |
| | | id: null, |
| | | pointName: null, |
| | | startTime: null, |
| | | endTime: null, |
| | | unitId: null, |
| | | deptId: [], |
| | | status: null, |
| | | remark: null, |
| | | createTime: null, |
| | | updateTime: null, |
| | | deleted: null |
| | | deleted: null, |
| | | importantTag: false, |
| | | provinceTag: false, |
| | | deptTag: false, |
| | | }; |
| | | this.resetForm("form"); |
| | | }, |
| | |
| | | // 多选框选中数据 |
| | | handleSelectionChange(selection) { |
| | | this.ids = selection.map(item => item.id) |
| | | this.single = selection.length!==1 |
| | | this.single = selection.length !== 1 |
| | | this.multiple = !selection.length |
| | | }, |
| | | /** 新增按钮操作 */ |
| | |
| | | const id = row.id || this.ids |
| | | getPoint(id).then(response => { |
| | | this.form = response.data; |
| | | this.form.timezone = [this.form.startTime, this.form.endTime] |
| | | this.editOpen = true; |
| | | this.form.deptId = response.data.deptIds |
| | | this.form.category = this.form.category + '' |
| | | this.timezone = [response.data.startTime, response.data.endTime] |
| | | this.open = true; |
| | | console.log(this.form) |
| | | this.title = "修改运维点位"; |
| | | }); |
| | | }, |
| | | /** 提交按钮 */ |
| | | submitForm() { |
| | | if (this.formList.length > 0) { |
| | | // 批量增加 |
| | | if (this.formList.every(item => !item.hasOwnProperty("id"))) { |
| | | addPointBatch(this.formList).then(response => { |
| | | this.$modal.msgSuccess("新增成功"); |
| | | this.open = false; |
| | | // 重置 |
| | | this.tempForm = {}; |
| | | this.tempFormList = []; |
| | | this.formList = []; |
| | | this.getList(); |
| | | }); |
| | | } |
| | | }else { |
| | | if (this.form.id != null) { |
| | | updatePoint(this.form).then(response => { |
| | | this.$modal.msgSuccess("修改成功"); |
| | | this.editOpen = false; |
| | | this.getList(); |
| | | }); |
| | | this.$refs['form'].validate(valid => { |
| | | if (valid) { |
| | | if (this.form.deptId && this.form.deptId.length > 0) { |
| | | this.form.deptId = this.form.deptId[this.form.deptId.length - 1] |
| | | } |
| | | let temp = { |
| | | ...this.form, |
| | | category: parseInt(this.form.category) |
| | | }; |
| | | if (temp.id != null) { |
| | | updatePoint(temp).then(response => { |
| | | this.$modal.msgSuccess("修改成功"); |
| | | this.open = false; |
| | | this.getList(); |
| | | }); |
| | | } else { |
| | | addPoint(temp).then(response => { |
| | | this.$modal.msgSuccess("新增成功"); |
| | | this.open = false; |
| | | this.reset() |
| | | this.getList(); |
| | | }); |
| | | } |
| | | } else { |
| | | addPoint(this.form).then(response => { |
| | | this.$modal.msgSuccess("新增成功"); |
| | | this.open = false; |
| | | this.getList(); |
| | | }); |
| | | console.log("error") |
| | | } |
| | | } |
| | | }) |
| | | }, |
| | | /** 删除按钮操作 */ |
| | | handleDelete(row) { |
| | | const ids = row.id || this.ids; |
| | | this.$modal.confirm('是否确认删除运维点位编号为"' + ids + '"的数据项?').then(function() { |
| | | this.$modal.confirm('是否确认删除运维点位编号为"' + ids + '"的数据项?').then(function () { |
| | | return delPoint(ids); |
| | | }).then(() => { |
| | | this.getList(); |
| | | this.$modal.msgSuccess("删除成功"); |
| | | }).catch(() => {}); |
| | | }).catch(() => { |
| | | }); |
| | | }, |
| | | /** 导出按钮操作 */ |
| | | handleExport() { |
| | | this.download('x/point/export', { |
| | | ...this.queryParams |
| | | }, `point_${new Date().getTime()}.xlsx`) |
| | | } |
| | | } |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | .point-row { |
| | | .bottom_ { |
| | | width: 100%; |
| | | margin-bottom: 8px; |
| | | } |
| | | .col-item { |
| | | margin: 5px 0; |
| | | display: flex; |
| | | flex-direction: row; |
| | | align-content: center; |
| | | justify-content: center; |
| | | align-items: center; |
| | | } |
| | | .row-item { |
| | | margin-right: 5px; |
| | | } |
| | | .row-item:nth-last-child { |
| | | margin-right: 0; |
| | | } |
| | | </style> |