当鼠标移到行上显示气泡行上加旗袍

5_7_地图同步
liujun 2024-03-12 18:29:20 +08:00
parent 7b29b15bb5
commit 58d88c2c4f
6 changed files with 378 additions and 30 deletions

View File

@ -45,16 +45,18 @@
tooltip-effect="dark"
border
fit
highlight-current-row>
highlight-current-row
@cell-mouse-enter="enterSelectionRows"
@cell-mouse-leave="leaveSelectionRows"
>
<el-table-column
:reserve-selection="true"
type="selection"
width="55"
align="center"/>
<el-table-column type="index" label="序号" width="50" align="center" />
<el-table-column align="center" prop="REMARKS" label="安全操作规程名称" />
<el-table-column align="center" prop="TYPES" label="类型" >
<el-table-column type="index" label="序号" width="50" align="center"/>
<el-table-column align="center" prop="REMARKS" label="安全操作规程名称"/>
<el-table-column align="center" prop="TYPES" label="类型">
<template slot-scope="{row}">
<el-tag
v-for="tag in row.TYPES"
@ -66,7 +68,7 @@
</el-tag>
</template>
</el-table-column>
<el-table-column prop="LABEL" align="center" label="标签" >
<el-table-column prop="LABEL" align="center" label="标签">
<template slot-scope="{row}">
<el-tag
v-for="tag in row.labels"
@ -80,7 +82,8 @@
</el-table-column>
<el-table-column align="center" prop="SPECIFICATION_TYPES" label="国民经济行业类型" width="300px">
<template slot-scope="{row}">
<div v-if="(row.SPECIFICATION_TYPES && row.SPECIFICATION_TYPES.length > 0) && ((!row.CATEGORY_LIST) || (!row.CATEGORY_LIST[0]) || (row.CATEGORY_LIST[0].CATEGORY_ID !== '8051d985a2bc406a83ea9360b64182b2')) ">
<div
v-if="(row.SPECIFICATION_TYPES && row.SPECIFICATION_TYPES.length > 0) && ((!row.CATEGORY_LIST) || (!row.CATEGORY_LIST[0]) || (row.CATEGORY_LIST[0].CATEGORY_ID !== '8051d985a2bc406a83ea9360b64182b2')) ">
<el-tag
v-for="tag in row.SPECIFICATION_TYPES"
:key="tag.BUS_LIBRARY_LABELS_ID"
@ -98,10 +101,15 @@
<el-table-column align="center" prop="UPLOAD_TIME" label="上传时间" width="90px"/>
<el-table-column align="center" prop="STATUS" label="状态" width="80px">
<template slot-scope="{row}">
{{ row.STATUS === '0'?'停用':'正常' }}
{{ row.STATUS === '0' ? '停用' : '正常' }}
</template>
</el-table-column>
<el-table-column :show-overflow-tooltip="true" align="center" prop="UPLOAD_USER_NAME" width="100px" label="数据来源">
<el-table-column
:show-overflow-tooltip="true"
align="center"
prop="UPLOAD_USER_NAME"
width="100px"
label="数据来源">
<template slot-scope="{row}">
{{ !row.CORP_NAME ? '自建' : row.CORP_NAME }}
</template>
@ -110,26 +118,82 @@
<template slot-scope="{row}">
<el-row style="margin-bottom: 10px">
<el-col :span="24">
<el-button v-show="!row.LOCKTOOL && edit" type="primary" icon="el-icon-edit" size="mini" @click="handleEdit(row)"></el-button>
<el-button v-show="!row.LOCKTOOL && del" type="danger" icon="el-icon-delete" size="mini" @click="handleDelete(row)"></el-button>
<el-button v-if="!row.LOCKTOOL && edit" type="success" icon="el-icon-lock" size="mini" @click="handleLock(row,'1')"></el-button>
<el-button v-if="row.LOCKTOOL && edit" type="info" icon="el-icon-unlock" size="mini" @click="handleLock(row,'0')"></el-button>
<el-button
v-show="!row.LOCKTOOL && edit"
type="primary"
icon="el-icon-edit"
size="mini"
@click="handleEdit(row)">编辑
</el-button>
<el-button
v-show="!row.LOCKTOOL && del"
type="danger"
icon="el-icon-delete"
size="mini"
@click="handleDelete(row)">删除
</el-button>
<el-button
v-if="!row.LOCKTOOL && edit"
type="success"
icon="el-icon-lock"
size="mini"
@click="handleLock(row,'1')">锁定
</el-button>
<el-button
v-if="row.LOCKTOOL && edit"
type="info"
icon="el-icon-unlock"
size="mini"
@click="handleLock(row,'0')">解锁
</el-button>
</el-col>
</el-row>
<el-row style="margin-bottom: 10px">
<el-col :span="24">
<el-button type="info" icon="el-icon-view" size="mini" @click="getInformation(row)"></el-button>
<el-button v-if="!row.ISTOPTIME && edit" type="success" icon="el-icon-edit-outline" size="mini" @click="handleTop(row,'1')"></el-button>
<el-button v-if="row.ISTOPTIME && edit" type="warning" icon="el-icon-edit-outline" size="mini" @click="handleTop(row,'2')"></el-button>
<el-button
v-if="!row.ISTOPTIME && edit"
type="success"
icon="el-icon-edit-outline"
size="mini"
@click="handleTop(row,'1')">置顶
</el-button>
<el-button
v-if="row.ISTOPTIME && edit"
type="warning"
icon="el-icon-edit-outline"
size="mini"
@click="handleTop(row,'2')">取消置顶
</el-button>
<el-button type="warning" icon="el-icon-printer" size="mini" @click="handleExport(row)"></el-button>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-button v-show="!row.LOCKTOOL && edit" type="primary" icon="el-icon-view" size="mini" @click="openUpdateFile(row)"></el-button>
<el-button v-show="edit" type="primary" icon="el-icon-printer" size="mini" @click="openUpdateLog(row)"></el-button>
<el-button v-if="row.STATUS === '0' && edit" type="success" icon="el-icon-edit-outline" size="mini" @click="setStatus(row,'1')"></el-button>
<el-button v-if="row.STATUS === '1' && edit" type="warning" icon="el-icon-edit-outline" size="mini" @click="setStatus(row,'0')"></el-button>
<el-button
v-show="!row.LOCKTOOL && edit"
type="primary"
icon="el-icon-view"
size="mini"
@click="openUpdateFile(row)">替换
</el-button>
<el-button v-show="edit" type="primary" icon="el-icon-printer" size="mini" @click="openUpdateLog(row)">
替换记录
</el-button>
<el-button
v-if="row.STATUS === '0' && edit"
type="success"
icon="el-icon-edit-outline"
size="mini"
@click="setStatus(row,'1')">启用
</el-button>
<el-button
v-if="row.STATUS === '1' && edit"
type="warning"
icon="el-icon-edit-outline"
size="mini"
@click="setStatus(row,'0')">停用
</el-button>
</el-col>
</el-row>
</template>
@ -140,7 +204,7 @@
<el-button v-show="add" type="primary" icon="el-icon-plus" @click="handleAdd"></el-button>
<el-button v-show="false" type="danger" icon="el-icon-delete" plain @click="batchDel"></el-button>
</div>
<pagination :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList" />
<pagination :total="total" :page.sync="listQuery.page" :limit.sync="listQuery.limit" @pagination="getList"/>
</div>
<edit-text-library ref="editTextLibrary" :title="title" @logical-end="saveClose"/>
<text-library-info ref="textLibraryInfo"/>
@ -164,6 +228,7 @@ import updateFile from './updateFile.vue'
import updateLog from './updateLog.vue'
import UpdateLog from './updateLog.vue'
import condition from './condition.vue'
export default {
components: { UpdateLog, Pagination, editTextLibrary, textLibraryInfo, updateFile, updateLog, condition },
directives: { waves },
@ -476,6 +541,52 @@ export default {
})
this.listLoading = false
})
},
enterSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.createTips(event, row, '数据已置顶')
}
},
leaveSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.removeTips(row)
}
},
createTips(el, row, value) {
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDom = document.createElement('div')
tooltipDom.style.cssText = `
display: inline-block;
max-width: 400px;
max-height: 400px;
position: absolute;
top: ${el.clientY + 5}px;
left: ${el.clientX}px;
padding:5px 10px;
overflow: auto;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #595959;
background: #fff;
border-radius: 5px;
z-index: 19999;
box-shadow: 0 4px 12px 1px #ccc;
`
tooltipDom.innerHTML = value
tooltipDom.setAttribute('id', `tooltip-${BUS_TEXT_LIBRARY_ID}`)
// body
document.body.appendChild(tooltipDom)
},
removeTips(row) {
console.log(row, 'row')
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDomLeave = document.querySelectorAll(`#tooltip-${BUS_TEXT_LIBRARY_ID}`)
if (tooltipDomLeave.length) {
tooltipDomLeave.forEach(dom => {
document.body.removeChild(dom)
})
}
}
}
}

View File

@ -45,7 +45,9 @@
tooltip-effect="dark"
border
fit
highlight-current-row>
highlight-current-row
@cell-mouse-enter="enterSelectionRows"
@cell-mouse-leave="leaveSelectionRows"
>
<el-table-column
:reserve-selection="true"
@ -485,6 +487,52 @@ export default {
}).catch((e) => {
this.$message.success('添加失败')
})
},
enterSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.createTips(event, row, '数据已置顶')
}
},
leaveSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.removeTips(row)
}
},
createTips(el, row, value) {
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDom = document.createElement('div')
tooltipDom.style.cssText = `
display: inline-block;
max-width: 400px;
max-height: 400px;
position: absolute;
top: ${el.clientY + 5}px;
left: ${el.clientX}px;
padding:5px 10px;
overflow: auto;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #595959;
background: #fff;
border-radius: 5px;
z-index: 19999;
box-shadow: 0 4px 12px 1px #ccc;
`
tooltipDom.innerHTML = value
tooltipDom.setAttribute('id', `tooltip-${BUS_TEXT_LIBRARY_ID}`)
// body
document.body.appendChild(tooltipDom)
},
removeTips(row) {
console.log(row, 'row')
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDomLeave = document.querySelectorAll(`#tooltip-${BUS_TEXT_LIBRARY_ID}`)
if (tooltipDomLeave.length) {
tooltipDomLeave.forEach(dom => {
document.body.removeChild(dom)
})
}
}
}
}

View File

@ -45,8 +45,9 @@
tooltip-effect="dark"
border
fit
highlight-current-row>
>
highlight-current-row
@cell-mouse-enter="enterSelectionRows"
@cell-mouse-leave="leaveSelectionRows">
<el-table-column
:reserve-selection="true"
type="selection"
@ -476,7 +477,54 @@ export default {
})
this.listLoading = false
})
},
enterSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.createTips(event, row, '数据已置顶')
}
},
leaveSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.removeTips(row)
}
},
createTips(el, row, value) {
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDom = document.createElement('div')
tooltipDom.style.cssText = `
display: inline-block;
max-width: 400px;
max-height: 400px;
position: absolute;
top: ${el.clientY + 5}px;
left: ${el.clientX}px;
padding:5px 10px;
overflow: auto;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #595959;
background: #fff;
border-radius: 5px;
z-index: 19999;
box-shadow: 0 4px 12px 1px #ccc;
`
tooltipDom.innerHTML = value
tooltipDom.setAttribute('id', `tooltip-${BUS_TEXT_LIBRARY_ID}`)
// body
document.body.appendChild(tooltipDom)
},
removeTips(row) {
console.log(row, 'row')
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDomLeave = document.querySelectorAll(`#tooltip-${BUS_TEXT_LIBRARY_ID}`)
if (tooltipDomLeave.length) {
tooltipDomLeave.forEach(dom => {
document.body.removeChild(dom)
})
}
}
}
}
</script>

View File

@ -45,8 +45,9 @@
tooltip-effect="dark"
border
fit
highlight-current-row>
>
highlight-current-row
@cell-mouse-enter="enterSelectionRows"
@cell-mouse-leave="leaveSelectionRows">
<el-table-column
:reserve-selection="true"
type="selection"
@ -485,6 +486,52 @@ export default {
}).catch((e) => {
this.$message.success('添加失败')
})
},
enterSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.createTips(event, row, '数据已置顶')
}
},
leaveSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.removeTips(row)
}
},
createTips(el, row, value) {
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDom = document.createElement('div')
tooltipDom.style.cssText = `
display: inline-block;
max-width: 400px;
max-height: 400px;
position: absolute;
top: ${el.clientY + 5}px;
left: ${el.clientX}px;
padding:5px 10px;
overflow: auto;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #595959;
background: #fff;
border-radius: 5px;
z-index: 19999;
box-shadow: 0 4px 12px 1px #ccc;
`
tooltipDom.innerHTML = value
tooltipDom.setAttribute('id', `tooltip-${BUS_TEXT_LIBRARY_ID}`)
// body
document.body.appendChild(tooltipDom)
},
removeTips(row) {
console.log(row, 'row')
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDomLeave = document.querySelectorAll(`#tooltip-${BUS_TEXT_LIBRARY_ID}`)
if (tooltipDomLeave.length) {
tooltipDomLeave.forEach(dom => {
document.body.removeChild(dom)
})
}
}
}
}

View File

@ -45,8 +45,9 @@
tooltip-effect="dark"
border
fit
highlight-current-row>
>
highlight-current-row
@cell-mouse-enter="enterSelectionRows"
@cell-mouse-leave="leaveSelectionRows">
<el-table-column
v-if="false"
:reserve-selection="true"
@ -513,6 +514,52 @@ export default {
})
this.listLoading = false
})
},
enterSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.createTips(event, row, '数据已置顶')
}
},
leaveSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.removeTips(row)
}
},
createTips(el, row, value) {
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDom = document.createElement('div')
tooltipDom.style.cssText = `
display: inline-block;
max-width: 400px;
max-height: 400px;
position: absolute;
top: ${el.clientY + 5}px;
left: ${el.clientX}px;
padding:5px 10px;
overflow: auto;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #595959;
background: #fff;
border-radius: 5px;
z-index: 19999;
box-shadow: 0 4px 12px 1px #ccc;
`
tooltipDom.innerHTML = value
tooltipDom.setAttribute('id', `tooltip-${BUS_TEXT_LIBRARY_ID}`)
// body
document.body.appendChild(tooltipDom)
},
removeTips(row) {
console.log(row, 'row')
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDomLeave = document.querySelectorAll(`#tooltip-${BUS_TEXT_LIBRARY_ID}`)
if (tooltipDomLeave.length) {
tooltipDomLeave.forEach(dom => {
document.body.removeChild(dom)
})
}
}
}
}

View File

@ -45,8 +45,9 @@
tooltip-effect="dark"
border
fit
highlight-current-row>
>
highlight-current-row
@cell-mouse-enter="enterSelectionRows"
@cell-mouse-leave="leaveSelectionRows">
<el-table-column
:reserve-selection="true"
type="selection"
@ -486,6 +487,52 @@ export default {
}).catch((e) => {
this.$message.success('添加失败')
})
},
enterSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.createTips(event, row, '数据已置顶')
}
},
leaveSelectionRows(row, column, cell, event) {
if (row.ISTOPTIME) {
this.removeTips(row)
}
},
createTips(el, row, value) {
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDom = document.createElement('div')
tooltipDom.style.cssText = `
display: inline-block;
max-width: 400px;
max-height: 400px;
position: absolute;
top: ${el.clientY + 5}px;
left: ${el.clientX}px;
padding:5px 10px;
overflow: auto;
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #595959;
background: #fff;
border-radius: 5px;
z-index: 19999;
box-shadow: 0 4px 12px 1px #ccc;
`
tooltipDom.innerHTML = value
tooltipDom.setAttribute('id', `tooltip-${BUS_TEXT_LIBRARY_ID}`)
// body
document.body.appendChild(tooltipDom)
},
removeTips(row) {
console.log(row, 'row')
const { BUS_TEXT_LIBRARY_ID } = row
const tooltipDomLeave = document.querySelectorAll(`#tooltip-${BUS_TEXT_LIBRARY_ID}`)
if (tooltipDomLeave.length) {
tooltipDomLeave.forEach(dom => {
document.body.removeChild(dom)
})
}
}
}
}