14 changed files with 964 additions and 156 deletions
-
24src/api/archivesManage/fileImport.js
-
12src/api/storeManage/deviceManage/device.js
-
228src/views/archivesManage/fileImport/dataImport/index.vue
-
60src/views/archivesManage/fileImport/importLog/index.vue
-
1src/views/archivesManage/fileImport/index.vue
-
139src/views/archivesManage/fileImport/module/EditableCell.vue
-
122src/views/archivesManage/fileImport/module/detail.vue
-
202src/views/archivesManage/fileImport/module/listPre-edit.vue
-
282src/views/archivesManage/fileImport/module/listPre.vue
-
8src/views/components/AccessDoor.vue
-
8src/views/components/WarehouseWarning.vue
-
11src/views/environmentalScreen/index.vue
-
4src/views/home.vue
-
19src/views/storeManage/deviceManage/module/deviceDetail.vue
@ -0,0 +1,139 @@ |
|||||
|
<template> |
||||
|
<div class="editable-cell-wrapper"> |
||||
|
<!-- 显示模式 --> |
||||
|
<span |
||||
|
v-if="!isEditing" |
||||
|
class="cell-text" |
||||
|
@dblclick="startEditing" |
||||
|
> |
||||
|
{{ value }} |
||||
|
</span> |
||||
|
|
||||
|
<!-- 编辑模式 --> |
||||
|
<el-input |
||||
|
v-else |
||||
|
ref="editInput" |
||||
|
:value="value" |
||||
|
size="mini" |
||||
|
class="cell-input" |
||||
|
@input="handleInput" |
||||
|
@blur="finishEditing" |
||||
|
@keyup.enter.native="finishEditing" |
||||
|
/> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
name: 'EditableCell', |
||||
|
props: { |
||||
|
// 单元格的原始值 |
||||
|
value: { |
||||
|
type: [String, Number, Boolean, null], |
||||
|
default: null |
||||
|
}, |
||||
|
// 用于唯一标识行和列，避免同时编辑多个单元格 |
||||
|
cellKey: { |
||||
|
type: String, |
||||
|
required: true |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
// 组件内部的编辑状态 |
||||
|
isEditing: false, |
||||
|
// 存储当前正在编辑的单元格的 cellKey |
||||
|
editingCellKey: '' |
||||
|
} |
||||
|
}, |
||||
|
beforeDestroy() { |
||||
|
// 组件销毁时，移除全局事件监听 |
||||
|
this.$root.$off('editable-cell:cancel-edit', this.handleCancelEdit) |
||||
|
}, |
||||
|
methods: { |
||||
|
/** |
||||
|
* 开始编辑 |
||||
|
*/ |
||||
|
startEditing() { |
||||
|
// 确保一次只编辑一个单元格 |
||||
|
if (this.editingCellKey && this.editingCellKey !== this.cellKey) { |
||||
|
this.$root.$emit('editable-cell:cancel-edit', this.editingCellKey) |
||||
|
} |
||||
|
this.isEditing = true |
||||
|
this.editingCellKey = this.cellKey |
||||
|
|
||||
|
// 监听全局事件，用于取消其他单元格的编辑 |
||||
|
this.$root.$on('editable-cell:cancel-edit', this.handleCancelEdit) |
||||
|
|
||||
|
// 确保输入框渲染后再聚焦 |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.editInput.focus() |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 处理输入 |
||||
|
* @param {string} newValue - 输入框的新值 |
||||
|
*/ |
||||
|
handleInput(newValue) { |
||||
|
// 使用 .trim() 去除首尾空格 |
||||
|
// 这可以确保 null、undefined、'' 都被视为空值 |
||||
|
const trimmedValue = newValue.trim() || null |
||||
|
// 通过 'input' 事件将新值传递给父组件 |
||||
|
this.$emit('input', trimmedValue) |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 结束编辑（失去焦点或按回车） |
||||
|
*/ |
||||
|
finishEditing() { |
||||
|
this.isEditing = false |
||||
|
this.editingCellKey = '' |
||||
|
// 移除事件监听，防止内存泄漏 |
||||
|
this.$root.$off('editable-cell:cancel-edit', this.handleCancelEdit) |
||||
|
// 通知父组件编辑已完成 |
||||
|
this.$emit('change') |
||||
|
}, |
||||
|
|
||||
|
/** |
||||
|
* 处理来自其他单元格的取消编辑请求 |
||||
|
* @param {string} key - 请求取消编辑的单元格的 cellKey |
||||
|
*/ |
||||
|
handleCancelEdit(key) { |
||||
|
if (key === this.cellKey) { |
||||
|
this.isEditing = false |
||||
|
this.editingCellKey = '' |
||||
|
this.$root.$off('editable-cell:cancel-edit', this.handleCancelEdit) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style scoped> |
||||
|
.editable-cell-wrapper { |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
} |
||||
|
.cell-text { |
||||
|
display: block; |
||||
|
width: 100%; |
||||
|
height: 100%; |
||||
|
padding: 0 5px; /* 增加内边距，方便点击 */ |
||||
|
cursor: pointer; |
||||
|
word-break: break-all; |
||||
|
} |
||||
|
.cell-text:hover { |
||||
|
background-color: rgba(51, 156, 255, 0.1); |
||||
|
} |
||||
|
.cell-input { |
||||
|
padding: 0; |
||||
|
margin: 0; |
||||
|
} |
||||
|
/* 让 el-input 完全填充单元格 */ |
||||
|
::v-deep .cell-input .el-input__inner { |
||||
|
padding: 0 5px; |
||||
|
height: 28px; /* 与表格行高对齐 */ |
||||
|
line-height: 28px; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,202 @@ |
|||||
|
<template> |
||||
|
<div class="import-detail-container"> |
||||
|
<ul class="import-tab"> |
||||
|
<li class="active">文件</li> |
||||
|
</ul> |
||||
|
<el-table |
||||
|
ref="table" |
||||
|
:data="tableData" |
||||
|
style="width: 100%" |
||||
|
height="calc(100vh - 500px)" |
||||
|
row-key="id" |
||||
|
@row-click="clickRowHandler" |
||||
|
@selection-change="selectionChangeHandler" |
||||
|
> |
||||
|
<el-table-column prop="status" label="状态" align="center" width="80px"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-tag v-if="scope.row.status===1" type="success">导入</el-tag> |
||||
|
<el-tag v-if="scope.row.status===2" type="warning">覆盖</el-tag> |
||||
|
<el-tag v-if="scope.row.status===3">跳过</el-tag> |
||||
|
<el-tag v-if="scope.row.status===4" type="danger">失败</el-tag> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column label="序号" width="60" align="center" type="index" /> |
||||
|
|
||||
|
<el-table-column prop="maintitle" label="姓名" align="center" show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
<editable-cell |
||||
|
:value="scope.row.maintitle" |
||||
|
:cell-key="`${scope.row.id}-maintitle`" |
||||
|
@input="(val) => { scope.row.maintitle = val }" |
||||
|
/> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="idType" label="身份类别" align="center" show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
<editable-cell |
||||
|
:value="scope.row.idType" |
||||
|
:cell-key="`${scope.row.id}-idType`" |
||||
|
@input="(val) => { scope.row.idType = val }" |
||||
|
/> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="idNumber" label="公民身份证号" align="center" show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
<editable-cell |
||||
|
:value="scope.row.idNumber" |
||||
|
:cell-key="`${scope.row.id}-idNumber`" |
||||
|
@input="(val) => { scope.row.idNumber = val }" |
||||
|
/> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="nativePlace" label="籍贯" align="center" show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
<editable-cell |
||||
|
:value="scope.row.nativePlace" |
||||
|
:cell-key="`${scope.row.id}-nativePlace`" |
||||
|
@input="(val) => { scope.row.nativePlace = val }" |
||||
|
/> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="archiveNo" label="证件号" align="center" show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
<editable-cell |
||||
|
:value="scope.row.archiveNo" |
||||
|
:cell-key="`${scope.row.id}-archiveNo`" |
||||
|
@input="(val) => { scope.row.archiveNo = val }" |
||||
|
/> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
</el-table> |
||||
|
<!--分页组件--> |
||||
|
<el-pagination |
||||
|
:current-page="page.page" |
||||
|
:total="page.total" |
||||
|
:page-size="page.size" |
||||
|
:pager-count="5" |
||||
|
layout="total, prev, pager, next, sizes" |
||||
|
@size-change="handleSizeChange" |
||||
|
@current-change="handleCurrentPage" |
||||
|
/> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import crudFileImport from '@/api/archivesManage/fileImport' |
||||
|
import EditableCell from './EditableCell.vue' |
||||
|
|
||||
|
export default { |
||||
|
name: 'ListPre', |
||||
|
components: { EditableCell }, |
||||
|
props: { |
||||
|
djnum: { type: Number, default: 0 }, |
||||
|
hpId: { type: String, default: '' }, |
||||
|
initialTableData: { type: Array, default: () => [] }, |
||||
|
initialTotal: { type: Number, default: 0 } |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
tableData: [], |
||||
|
page: { |
||||
|
page: 1, |
||||
|
size: 10, |
||||
|
total: 0 |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
initialTableData(newVal) { |
||||
|
if (newVal) { |
||||
|
this.tableData = newVal |
||||
|
} |
||||
|
}, |
||||
|
initialTotal(newVal) { |
||||
|
if (newVal !== undefined) { |
||||
|
this.page.total = newVal |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
this.tableData = this.initialTableData |
||||
|
this.page.total = this.initialTotal |
||||
|
}, |
||||
|
methods: { |
||||
|
getList() { |
||||
|
crudFileImport.FetchHpArchivesDetailsByHpId({ |
||||
|
page: this.page.page - 1, |
||||
|
size: this.page.size, |
||||
|
hpId: this.hpId, |
||||
|
isError: false |
||||
|
}).then(res => { |
||||
|
this.tableData = res.content |
||||
|
this.page.total = res.totalElements |
||||
|
}) |
||||
|
this.doLayout() |
||||
|
}, |
||||
|
clickRowHandler(row) { |
||||
|
this.$refs.table.toggleRowSelection(row) |
||||
|
}, |
||||
|
selectionChangeHandler(val) { |
||||
|
this.selections = val |
||||
|
}, |
||||
|
handleSizeChange(size) { |
||||
|
this.page.size = size |
||||
|
this.page.page = 1 |
||||
|
this.getList() |
||||
|
}, |
||||
|
handleCurrentPage(val) { |
||||
|
this.page.page = val |
||||
|
this.getList() |
||||
|
}, |
||||
|
doLayout() { |
||||
|
this.$nextTick(() => { |
||||
|
this.$refs.table.doLayout() |
||||
|
}) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang='scss' scoped> |
||||
|
/* 你的样式代码保持不变 */ |
||||
|
.import-detail-container { |
||||
|
position: relative; |
||||
|
} |
||||
|
.import-tab { |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
margin-bottom: 10px; |
||||
|
li { |
||||
|
padding: 10px 20px 14px 20px; |
||||
|
font-size: 16px; |
||||
|
color: #339CFF; |
||||
|
cursor: pointer; |
||||
|
&.active { |
||||
|
position: relative; |
||||
|
color: #fff; |
||||
|
&::after { |
||||
|
content: ""; |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
bottom: -1px; |
||||
|
width: 100%; |
||||
|
height: 3px; |
||||
|
border-radius: 3px; |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.el-tag.el-tag--success { |
||||
|
color: #1aae93; |
||||
|
border-color: #1aae93; |
||||
|
background-color: transparent !important; |
||||
|
} |
||||
|
/* 让单元格内容垂直居中 */ |
||||
|
::v-deep .el-table .cell { |
||||
|
display: flex; |
||||
|
align-items: center; |
||||
|
justify-content: center; /* 针对 align="center" 的列 */ |
||||
|
height: 100%; |
||||
|
} |
||||
|
</style> |
||||
@ -0,0 +1,282 @@ |
|||||
|
<template> |
||||
|
<div class="import-detail-container"> |
||||
|
<div v-if="isLogOrPreview === 'log'" class="import-data-number"> |
||||
|
<p>成功读取数据：<span style="color:#339cff">{{ readData === null ? 0 : readData }}</span> 条</p> |
||||
|
<p>成功导入数据：<span style="color: #1AAE93;">{{ importData === null ? 0 : importData }}</span> 条</p> |
||||
|
<p>跳过数据：<span style="color: rgb(246,81,99);">{{ skipData === null ? 0 : skipData }}</span> 条</p> |
||||
|
<p>覆盖数据：<span style="color: rgb(246,81,99);">{{ coverData === null ? 0 : coverData }}</span> 条</p> |
||||
|
<p>导入失败数据：<span style="color: rgb(246,81,99);">{{ errorData === null ? 0 : errorData }}</span> 条</p> |
||||
|
|
||||
|
</div> |
||||
|
<div class="import-tab"> |
||||
|
<p class="active">文件</p> |
||||
|
<el-checkbox v-if="isLogOrPreview !== 'log'" v-model="isData" style="margin-left: 20px; color: #fff;" @change="changeDataChecked">仅显示问题数据</el-checkbox> |
||||
|
</div> |
||||
|
<el-table |
||||
|
ref="table" |
||||
|
:data="tableData" |
||||
|
style="width: 100%" |
||||
|
height="calc(100vh - 500px)" |
||||
|
@row-click="clickRowHandler" |
||||
|
@selection-change="selectionChangeHandler" |
||||
|
> |
||||
|
<el-table-column v-if="isLogOrPreview !== 'log'" prop="status" label="状态" align="center" width="120px"> |
||||
|
<template slot-scope="scope"> |
||||
|
<!-- 状态为1的行显示为"导入" --> |
||||
|
<el-tag v-if="scope.row.status === 1" type="success">导入</el-tag> |
||||
|
<!-- 状态为3且有空值的行显示为"跳过" --> |
||||
|
<el-tag v-else-if="scope.row.status === 3 && hasEmptyValues(scope.row)">跳过</el-tag> |
||||
|
<!-- 其他情况（包括用户修改后的状态）显示下拉框 --> |
||||
|
<el-select |
||||
|
v-else |
||||
|
v-model="scope.row.status" |
||||
|
class="set-select" |
||||
|
placeholder="请选择" |
||||
|
size="mini" |
||||
|
style="width: 100px; background-color: transparent;" |
||||
|
@change="handleStatusChange(scope.row)" |
||||
|
> |
||||
|
<el-option label="覆盖" :value="2" /> |
||||
|
<el-option label="跳过" :value="3" /> |
||||
|
</el-select> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column v-else prop="status" label="状态" align="center" width="80px"> |
||||
|
<template slot-scope="scope"> |
||||
|
<el-tag v-if="scope.row.status===1" type="success">导入</el-tag> |
||||
|
<el-tag v-if="scope.row.status===2" type="warning">覆盖</el-tag> |
||||
|
<el-tag v-if="scope.row.status===3">跳过</el-tag> |
||||
|
<el-tag v-if="scope.row.status===4" type="danger">失败</el-tag> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
|
||||
|
<el-table-column label="序号" width="55" align="center" show-overflow-tooltip> |
||||
|
<template slot-scope="scope"> |
||||
|
<span>{{ (page.page - 1) * page.size + scope.$index + 1 }}</span> |
||||
|
</template> |
||||
|
</el-table-column> |
||||
|
<el-table-column prop="maintitle" label="姓名" align="center" width="100" show-overflow-tooltip /> |
||||
|
<el-table-column prop="idType" label="身份类别" align="center" width="100" show-overflow-tooltip /> |
||||
|
<el-table-column prop="idNumber" label="公民身份证号" align="center" show-overflow-tooltip /> |
||||
|
<el-table-column prop="nativePlace" label="籍贯" align="center" show-overflow-tooltip /> |
||||
|
<el-table-column prop="archiveNo" label="证件号" align="center" show-overflow-tooltip /> |
||||
|
</el-table> |
||||
|
<!--分页组件--> |
||||
|
<el-pagination |
||||
|
:current-page="page.page" |
||||
|
:total="page.total" |
||||
|
:page-size="page.size" |
||||
|
:pager-count="5" |
||||
|
layout="total, prev, pager, next, sizes" |
||||
|
@size-change="handleSizeChange" |
||||
|
@current-change="handleCurrentPage" |
||||
|
/> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import crudFileImport from '@/api/archivesManage/fileImport' |
||||
|
export default { |
||||
|
name: 'ListPre', // 组件名建议与文件名一致 |
||||
|
components: {}, |
||||
|
props: { |
||||
|
isLogOrPreview: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
}, |
||||
|
hpId: { |
||||
|
type: String, |
||||
|
default: '' |
||||
|
}, |
||||
|
initialTableData: { |
||||
|
type: Array, |
||||
|
default: () => [] |
||||
|
}, |
||||
|
initialTotal: { |
||||
|
type: Number, |
||||
|
default: 0 |
||||
|
} |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
tableData: [], |
||||
|
page: { |
||||
|
page: 1, |
||||
|
size: 10, |
||||
|
total: 0 |
||||
|
}, |
||||
|
selections: [], |
||||
|
isData: true, |
||||
|
// 核心：用于缓存所有被修改过的行数据 |
||||
|
// 结构: { 'rowId1': { ...modifiedRowData1 }, 'rowId2': { ...modifiedRowData2 } } |
||||
|
modifiedRowsCache: {}, |
||||
|
readData: null, |
||||
|
importData: null, |
||||
|
skipData: null, |
||||
|
coverData: null, |
||||
|
errorData: null |
||||
|
} |
||||
|
}, |
||||
|
watch: { |
||||
|
initialTableData(newVal) { |
||||
|
if (newVal && newVal.length > 0) { |
||||
|
this.tableData = this.applyModificationsToData(newVal) |
||||
|
} |
||||
|
}, |
||||
|
initialTotal(newVal) { |
||||
|
if (newVal !== undefined && newVal !== null) { |
||||
|
this.page.total = newVal |
||||
|
} |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
if (this.initialTableData && this.initialTableData.length > 0) { |
||||
|
this.tableData = this.applyModificationsToData(this.initialTableData) |
||||
|
this.page.total = this.initialTotal |
||||
|
} else { |
||||
|
this.getList() |
||||
|
} |
||||
|
}, |
||||
|
methods: { |
||||
|
// 核心方法：将缓存中的修改应用到新的数据列表上 |
||||
|
applyModificationsToData(data) { |
||||
|
return data.map(row => { |
||||
|
// 假设每行都有一个唯一的id字段作为key |
||||
|
const cachedRow = this.modifiedRowsCache[row.id] |
||||
|
// 如果缓存中存在该行的修改，则返回合并后的数据（缓存中的数据优先级更高） |
||||
|
return cachedRow ? { ...row, ...cachedRow } : row |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
changeDataChecked(val) { |
||||
|
this.page.page = 1 |
||||
|
this.getList() |
||||
|
}, |
||||
|
|
||||
|
getList() { |
||||
|
const pageParam = this.page.page - 1 |
||||
|
crudFileImport.FetchHpArchivesDetailsByHpId({ |
||||
|
page: pageParam, |
||||
|
size: this.page.size, |
||||
|
hpId: this.hpId, |
||||
|
isError: this.isLogOrPreview === 'log' ? false : this.isData |
||||
|
}).then(res => { |
||||
|
this.tableData = this.applyModificationsToData(res.data.content || []) |
||||
|
this.page.total = res.data.totalElements || 0 |
||||
|
this.doLayout() |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
clickRowHandler(row) { |
||||
|
this.$refs.table.toggleRowSelection(row) |
||||
|
}, |
||||
|
|
||||
|
selectionChangeHandler(val) { |
||||
|
this.selections = val |
||||
|
}, |
||||
|
|
||||
|
handleSizeChange(size) { |
||||
|
this.page.size = size |
||||
|
this.page.page = 1 |
||||
|
this.getList() |
||||
|
}, |
||||
|
|
||||
|
handleCurrentPage(val) { |
||||
|
this.page.page = val |
||||
|
this.getList() |
||||
|
}, |
||||
|
|
||||
|
doLayout() { |
||||
|
this.$nextTick(() => { |
||||
|
if (this.$refs.table) { |
||||
|
this.$refs.table.doLayout() |
||||
|
} |
||||
|
}) |
||||
|
}, |
||||
|
hasEmptyValues(row) { |
||||
|
const fieldsToCheck = ['maintitle', 'idType', 'idNumber', 'nativePlace', 'archiveNo'] |
||||
|
return fieldsToCheck.some(field => { |
||||
|
const value = row[field] |
||||
|
return value === null || value === undefined || (typeof value === 'string' && value.trim() === '') |
||||
|
}) |
||||
|
}, |
||||
|
// 核心方法：处理状态变更 |
||||
|
handleStatusChange(row) { |
||||
|
if (!row.id) { |
||||
|
console.error('行数据缺少唯一的id字段，无法缓存修改！', row) |
||||
|
return |
||||
|
} |
||||
|
this.modifiedRowsCache[row.id] = { ...row } |
||||
|
this.$message.success(`证件号为 ${row.archiveNo} 姓名为 ${row.maintitle} 的状态已更新为: ${row.status === 2 ? '覆盖' : '跳过'}`) |
||||
|
}, |
||||
|
/** |
||||
|
* 返回一个包含所有修改行数据的数组 |
||||
|
*/ |
||||
|
getModifiedRows() { |
||||
|
return Object.values(this.modifiedRowsCache) |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style lang='scss' scoped> |
||||
|
.import-detail-container{ |
||||
|
position: relative; |
||||
|
.import-data-number{ |
||||
|
position: absolute; |
||||
|
right: 10px; |
||||
|
top: 20px; |
||||
|
font-size: 12px; |
||||
|
color: #fff; |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
& p{ |
||||
|
margin-right: 10px; |
||||
|
} |
||||
|
& span{ |
||||
|
font-weight: bold; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.import-tab{ |
||||
|
display: flex; |
||||
|
justify-content: flex-start; |
||||
|
align-items: center; |
||||
|
margin-bottom: 10px; |
||||
|
p{ |
||||
|
padding: 10px 20px 14px 20px; |
||||
|
font-size: 16px; |
||||
|
color: #339CFF; |
||||
|
cursor: pointer; |
||||
|
&.active{ |
||||
|
position: relative; |
||||
|
color: #fff; |
||||
|
&::after{ |
||||
|
content: ""; |
||||
|
position: absolute; |
||||
|
left: 0; |
||||
|
bottom: -1px; |
||||
|
width: 100%; |
||||
|
height: 3px; |
||||
|
border-radius: 3px; |
||||
|
background-color: #fff; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
.el-tag.el-tag--success { |
||||
|
color: #1aae93; |
||||
|
border-color: #1aae93; |
||||
|
background-color: transparent !important; |
||||
|
} |
||||
|
.set-select{ |
||||
|
::v-deep .el-input .el-input__inner{ |
||||
|
border: 1px solid #339cff; |
||||
|
background-color: #021941; |
||||
|
height: 30px; |
||||
|
line-height: 30px; |
||||
|
color: #fff; |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue