fix：大屏样式修改
This commit is contained in:
parent
26e6fd8584
commit
d2a445b36c
@ -2,7 +2,7 @@
|
||||
* @Author: SunTao 328867980@qq.com
|
||||
* @Date: 2024-10-17 11:34:00
|
||||
* @LastEditors: SunTao 328867980@qq.com
|
||||
* @LastEditTime: 2024-11-14 17:26:53
|
||||
* @LastEditTime: 2024-11-15 10:52:41
|
||||
* @FilePath: \znxjxt-ui\src\views\big-screen\index.vue
|
||||
* @Description: 大屏首页
|
||||
-->
|
||||
@ -110,11 +110,12 @@
|
||||
<!-- 图背景下选择框 -->
|
||||
<div class="map-image-select">
|
||||
病害类型筛选：
|
||||
<el-select
|
||||
<!-- <el-select
|
||||
:popper-append-to-body="false"
|
||||
v-model="mapCareSelect"
|
||||
placeholder="请选择"
|
||||
@change="getMapCare"
|
||||
clearable
|
||||
>
|
||||
<el-option
|
||||
v-for="item in dieaseTypeList"
|
||||
@ -122,7 +123,15 @@
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-select> -->
|
||||
<el-cascader
|
||||
v-model="mapCareSelect"
|
||||
popper-class="screen-index-cascader"
|
||||
:options="dieaseOptions"
|
||||
:props="{ checkStrictly: true, emitPath: false }"
|
||||
@change="getMapCare"
|
||||
clearable
|
||||
></el-cascader>
|
||||
</div>
|
||||
<div class="map-care">
|
||||
<div
|
||||
@ -360,6 +369,227 @@ export default {
|
||||
mapCareSelect: "",
|
||||
// 图片背景下病害类型下拉选择数据
|
||||
dieaseTypeList: [],
|
||||
dieaseOptions: [
|
||||
{
|
||||
value: "zhinan",
|
||||
label: "指南",
|
||||
children: [
|
||||
{
|
||||
value: "shejiyuanze",
|
||||
label: "设计原则",
|
||||
|
||||
},
|
||||
{
|
||||
value: "daohang",
|
||||
label: "导航",
|
||||
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: "zujian",
|
||||
label: "组件",
|
||||
children: [
|
||||
{
|
||||
value: "basic",
|
||||
label: "Basic",
|
||||
|
||||
},
|
||||
{
|
||||
value: "form",
|
||||
label: "Form",
|
||||
children: [
|
||||
{
|
||||
value: "radio",
|
||||
label: "Radio 单选框",
|
||||
},
|
||||
{
|
||||
value: "checkbox",
|
||||
label: "Checkbox 多选框",
|
||||
},
|
||||
{
|
||||
value: "input",
|
||||
label: "Input 输入框",
|
||||
},
|
||||
{
|
||||
value: "input-number",
|
||||
label: "InputNumber 计数器",
|
||||
},
|
||||
{
|
||||
value: "select",
|
||||
label: "Select 选择器",
|
||||
},
|
||||
{
|
||||
value: "cascader",
|
||||
label: "Cascader 级联选择器",
|
||||
},
|
||||
{
|
||||
value: "switch",
|
||||
label: "Switch 开关",
|
||||
},
|
||||
{
|
||||
value: "slider",
|
||||
label: "Slider 滑块",
|
||||
},
|
||||
{
|
||||
value: "time-picker",
|
||||
label: "TimePicker 时间选择器",
|
||||
},
|
||||
{
|
||||
value: "date-picker",
|
||||
label: "DatePicker 日期选择器",
|
||||
},
|
||||
{
|
||||
value: "datetime-picker",
|
||||
label: "DateTimePicker 日期时间选择器",
|
||||
},
|
||||
{
|
||||
value: "upload",
|
||||
label: "Upload 上传",
|
||||
},
|
||||
{
|
||||
value: "rate",
|
||||
label: "Rate 评分",
|
||||
},
|
||||
{
|
||||
value: "form",
|
||||
label: "Form 表单",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: "data",
|
||||
label: "Data",
|
||||
children: [
|
||||
{
|
||||
value: "table",
|
||||
label: "Table 表格",
|
||||
},
|
||||
{
|
||||
value: "tag",
|
||||
label: "Tag 标签",
|
||||
},
|
||||
{
|
||||
value: "progress",
|
||||
label: "Progress 进度条",
|
||||
},
|
||||
{
|
||||
value: "tree",
|
||||
label: "Tree 树形控件",
|
||||
},
|
||||
{
|
||||
value: "pagination",
|
||||
label: "Pagination 分页",
|
||||
},
|
||||
{
|
||||
value: "badge",
|
||||
label: "Badge 标记",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: "notice",
|
||||
label: "Notice",
|
||||
children: [
|
||||
{
|
||||
value: "alert",
|
||||
label: "Alert 警告",
|
||||
},
|
||||
{
|
||||
value: "loading",
|
||||
label: "Loading 加载",
|
||||
},
|
||||
{
|
||||
value: "message",
|
||||
label: "Message 消息提示",
|
||||
},
|
||||
{
|
||||
value: "message-box",
|
||||
label: "MessageBox 弹框",
|
||||
},
|
||||
{
|
||||
value: "notification",
|
||||
label: "Notification 通知",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: "navigation",
|
||||
label: "Navigation",
|
||||
children: [
|
||||
{
|
||||
value: "menu",
|
||||
label: "NavMenu 导航菜单",
|
||||
},
|
||||
{
|
||||
value: "tabs",
|
||||
label: "Tabs 标签页",
|
||||
},
|
||||
{
|
||||
value: "breadcrumb",
|
||||
label: "Breadcrumb 面包屑",
|
||||
},
|
||||
{
|
||||
value: "dropdown",
|
||||
label: "Dropdown 下拉菜单",
|
||||
},
|
||||
{
|
||||
value: "steps",
|
||||
label: "Steps 步骤条",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: "others",
|
||||
label: "Others",
|
||||
children: [
|
||||
{
|
||||
value: "dialog",
|
||||
label: "Dialog 对话框",
|
||||
},
|
||||
{
|
||||
value: "tooltip",
|
||||
label: "Tooltip 文字提示",
|
||||
},
|
||||
{
|
||||
value: "popover",
|
||||
label: "Popover 弹出框",
|
||||
},
|
||||
{
|
||||
value: "card",
|
||||
label: "Card 卡片",
|
||||
},
|
||||
{
|
||||
value: "carousel",
|
||||
label: "Carousel 走马灯",
|
||||
},
|
||||
{
|
||||
value: "collapse",
|
||||
label: "Collapse 折叠面板",
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
value: "ziyuan",
|
||||
label: "资源",
|
||||
children: [
|
||||
{
|
||||
value: "axure",
|
||||
label: "Axure Components",
|
||||
},
|
||||
{
|
||||
value: "sketch",
|
||||
label: "Sketch Templates",
|
||||
},
|
||||
{
|
||||
value: "jiaohu",
|
||||
label: "组件交互文档",
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
// 路段下拉绑定
|
||||
roadList: [],
|
||||
// 地图打点-路段绑定
|
||||
@ -484,7 +714,8 @@ export default {
|
||||
},
|
||||
|
||||
/* 获取图片背景下坐标数据 */
|
||||
getMapCare() {
|
||||
getMapCare(value) {
|
||||
console.log(value, "获取图片背景下坐标数据");
|
||||
comppanyImg({ type: this.mapCareSelect }).then(({ code, data }) => {
|
||||
if (code === 200) {
|
||||
this.mapCareList = data;
|
||||
@ -882,7 +1113,7 @@ export default {
|
||||
// 地图右上角多选按钮隐藏
|
||||
this.showIconList = false;
|
||||
// 图层恢复
|
||||
this.mapZoom="";
|
||||
this.mapZoom = "";
|
||||
} else if (item.component === "RoadScreen") {
|
||||
this.leftModuleList = [
|
||||
{
|
||||
@ -1490,4 +1721,46 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// 修改级联样式
|
||||
::v-deep .el-cascader {
|
||||
width: 8rem;
|
||||
|
||||
.el-input--medium .el-input__inner {
|
||||
height: 1.5rem;
|
||||
background-color: transparent;
|
||||
color: #89c5e8;
|
||||
border-color: #6991cd;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss">
|
||||
.screen-index-cascader {
|
||||
background-color: #102649;
|
||||
border-color: #08204f;
|
||||
|
||||
.el-cascader-node__label {
|
||||
color: #aaabb8;
|
||||
}
|
||||
|
||||
.el-cascader-node:hover {
|
||||
background-color: #2b4c7e;
|
||||
}
|
||||
|
||||
.el-cascader-node:active {
|
||||
background-color: #2b4c7e;
|
||||
}
|
||||
|
||||
.el-cascader-node:focus {
|
||||
background-color: #2b4c7e;
|
||||
}
|
||||
}
|
||||
|
||||
input[aria-hidden="true"] {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
.el-radio:focus:not(.is-focus):not(:active):not(.is-disabled) .el-radio__inner {
|
||||
box-shadow: none;
|
||||
}
|
||||
</style>
|
||||
Loading…
x
Reference in New Issue
Block a user