Skip to content

D
dsk-operate-sys-cscec
Commit f166a9fa authored by tianhongyang's avatar tianhongyang
Browse files
Options

规范全局主体容器宽高 规范滚动条出现容器位置

parent 446c5f52
Hide whitespace changes
Inline Side-by-side
Showing with 1648 additions and 1741 deletions
dsk-operate-ui/src/assets/styles/index.scss
View file @ f166a9fa
...@@ -121,12 +121,6 @@ aside { ...@@ -121,12 +121,6 @@ aside {
} }
} }
//main-container全局样式
.app-container {
//padding: 16px;
//margin-top: 56px;
}
.components-container { .components-container {
margin: 30px 50px; margin: 30px 50px;
position: relative; position: relative;
...@@ -226,18 +220,13 @@ li { ...@@ -226,18 +220,13 @@ li {
margin: 0; margin: 0;
} }
.app-main {
position: relative;
background-color: #f5f5f5;
>div{
width: calc(100% - 48px);
}
}
.app-container { .app-container {
margin: 16px 24px; width: 100%;
height: 100%;
background-color: #f5f5f5; background-color: #f5f5f5;
padding: 16px 24px;
box-sizing: border-box; box-sizing: border-box;
//width: 100%; overflow: auto;
.el-input__inner { .el-input__inner {
border-color: #d9d9d9; border-color: #d9d9d9;
color: #232323; color: #232323;
......
dsk-operate-ui/src/assets/styles/sidebar.scss
View file @ f166a9fa
...@@ -215,7 +215,7 @@ ...@@ -215,7 +215,7 @@
.hideSidebar { .hideSidebar {
.sidebar-container { .sidebar-container {
width: 48px !important; width: $hideSideBarWidth !important;
.sidebar-logo-container { .sidebar-logo-container {
padding: 0px; padding: 0px;
...@@ -235,8 +235,8 @@ ...@@ -235,8 +235,8 @@
} }
.main-container { .main-container {
margin-left: 48px; margin-left: $hideSideBarWidth;
width: calc(100% - 48px); width: calc(100% - #{$hideSideBarWidth});
} }
.submenu-title-noDropdown { .submenu-title-noDropdown {
......
dsk-operate-ui/src/assets/styles/variables.scss
View file @ f166a9fa
...@@ -52,6 +52,7 @@ $subMenuHover:#001528; ...@@ -52,6 +52,7 @@ $subMenuHover:#001528;
$base-sidebar-width: 220px; $base-sidebar-width: 220px;
$sideBarWidth: 220px; $sideBarWidth: 220px;
$hideSideBarWidth : 48px;
//系统默认颜色 //系统默认颜色
$systemColor:#0081FF; $systemColor:#0081FF;
......
dsk-operate-ui/src/layout/components/AppMain.vue
View file @ f166a9fa
...@@ -10,16 +10,16 @@ ...@@ -10,16 +10,16 @@
</template> </template>
<script> <script>
import iframeToggle from "./IframeToggle/index" import iframeToggle from "./IframeToggle/index";
export default { export default {
name: 'AppMain', name: 'AppMain',
components: { iframeToggle }, components: { iframeToggle },
computed: { computed: {
cachedViews() { cachedViews() {
return this.$store.state.tagsView.cachedViews return this.$store.state.tagsView.cachedViews;
}, },
key() { key() {
return this.$route.fullPath return this.$route.fullPath;
} }
} }
} }
...@@ -27,12 +27,11 @@ export default { ...@@ -27,12 +27,11 @@ export default {
<style lang="scss" scoped> <style lang="scss" scoped>
.app-main { .app-main {
/* 50= navbar 50 */
min-height: calc(100vh - 50px);
width: 100%;
position: relative; position: relative;
height: calc(100% - 56px);
width: 100%;
background: #f5f5f5;
overflow: hidden; overflow: hidden;
display: flex;
} }
.fixed-header + .app-main { .fixed-header + .app-main {
...@@ -41,20 +40,17 @@ export default { ...@@ -41,20 +40,17 @@ export default {
.hasTagsView { .hasTagsView {
.app-main { .app-main {
/* 84 = navbar + tags-view = 50 + 34 */ height: calc(100% - 56px);
min-height: calc(100vh - 56px); min-width: 1240px;
min-width:1240px;
background: #F5F5F5;
overflow: initial;
} }
.fixed-header + .app-main { .fixed-header + .app-main {
padding-top: 84px; padding-top: 84px;
} }
} }
.EnterpriseData{ .EnterpriseData {
.app-main { .app-main {
overflow: initial; overflow: hidden;
} }
} }
</style> </style>
......
dsk-operate-ui/src/layout/index.vue
View file @ f166a9fa
...@@ -96,6 +96,7 @@ export default { ...@@ -96,6 +96,7 @@ export default {
position: relative; position: relative;
height: 100%; height: 100%;
width: 100%; width: 100%;
overflow: hidden;
&.mobile.openSidebar { &.mobile.openSidebar {
position: fixed; position: fixed;
......
dsk-operate-ui/src/views/custom/historicalCustomers/index.vue
View file @ f166a9fa
<template> <template>
<div class="app-container" @click = 'handleALL'> <div class="app-container" @click='handleALL'>
<el-card class="box-card noborder"> <el-card class="box-card noborder">
<div class="tables"> <div class="tables">
<div class="empty" v-if="tableData.total==0&& !isSkeleton"> <div class="empty" v-if="tableData.total==0&& !isSkeleton">
...@@ -11,16 +11,16 @@ ...@@ -11,16 +11,16 @@
<div> <div>
<!-- 未点击前的输入框样式 --> <!-- 未点击前的输入框样式 -->
<div class="normal-search-container" :class="{'is-hover-search' : searchHoverStatus}" @mouseover="searchHover($event)" <div class="normal-search-container" :class="{'is-hover-search' : searchHoverStatus}" @mouseover="searchHover($event)"
@mouseleave="searchUnHover($event)"> @mouseleave="searchUnHover($event)">
<img src="@/assets/images/enterprise/enterprise-search-icon.svg" alt=""> <img src="@/assets/images/enterprise/enterprise-search-icon.svg" alt="">
<span v-if="!searchHoverStatus && !searchParam.companyName">搜索</span> <span v-if="!searchHoverStatus && !searchParam.companyName">搜索</span>
<el-input v-model="searchParam.companyName" placeholder="输入关键词查询" style="width:238px;" @focus="searchFocus($event)" <el-input v-model="searchParam.companyName" placeholder="输入关键词查询" style="width:238px;" @focus="searchFocus($event)"
@blur="searchBlur($event)" @input="value => searchInput(value)" v-else="searchHoverStatus || searchParam.companyName" @blur="searchBlur($event)" @input="value => searchInput(value)" v-else="searchHoverStatus || searchParam.companyName"
@keydown.native.enter="handleSearch"> @keydown.native.enter="handleSearch">
<template slot="suffix"> <template slot="suffix">
<transition mode="out-in" appear name="fade"> <transition mode="out-in" appear name="fade">
<img src="@/assets/images/enterprise/search-input-clear-icon.svg" alt="" @click.stop="searchParam.companyName = '';getCustomerList()" <img src="@/assets/images/enterprise/search-input-clear-icon.svg" alt=""
v-show="showClearIcon"> @click.stop="searchParam.companyName = '';getCustomerList()" v-show="showClearIcon">
</transition> </transition>
</template> </template>
</el-input> </el-input>
...@@ -31,176 +31,124 @@ ...@@ -31,176 +31,124 @@
</div> </div>
</div> </div>
<skeleton v-if="isSkeleton"></skeleton> <skeleton v-if="isSkeleton"></skeleton>
<el-table v-if="!isSkeleton&&tableData.total > 0" class="fixed-table" v-horizontal-scroll="tableData.total > 10 ? 'hover' : 'false'" max-height="640" <el-table v-if="!isSkeleton&&tableData.total > 0" class="fixed-table" v-horizontal-scroll="tableData.total > 10 ? 'hover' : 'false'"
:data="tableData.rows" max-height="640" :data="tableData.rows" stripe border style="width: 100%">
stripe border <el-table-column prop="index" label="序号" fixed="left" width="60">
style="width: 100%">
<el-table-column
prop="index"
label="序号"
fixed="left"
width="60">
<template slot-scope='scope'> <template slot-scope='scope'>
<span>{{ (searchParam.pageNum - 1) * searchParam.pageSize + scope.$index + 1 }}</span> <span>{{ (searchParam.pageNum - 1) * searchParam.pageSize + scope.$index + 1 }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="date" label="企业名称" fixed="left" width="316">
prop="date"
label="企业名称"
fixed="left"
width="316">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="ps1"> <div class="ps1">
<div class="wordprimary ps2" @click="toDetail(scope.row,'business')" v-html="scope.row.companyName"></div> <div class="wordprimary ps2" @click="toDetail(scope.row,'business')" v-html="scope.row.companyName"></div>
<div class="ps3"> <div class="ps3">
<el-tooltip class="item" effect="dark" content="重新认领" placement="top"> <el-tooltip class="item" effect="dark" content="重新认领" placement="top">
<div @click="toRL(scope.row)"><img class="i" src="@/assets/images/project/khrl1.png"><img class="o" src="@/assets/images/project/khrl2.png"></div> <div @click="toRL(scope.row)"><img class="i" src="@/assets/images/project/khrl1.png"><img class="o"
src="@/assets/images/project/khrl2.png"></div>
</el-tooltip> </el-tooltip>
</div> </div>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="cooperationProject" label="合作项目" width="90">
prop="cooperationProject"
label="合作项目"
width="90">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.cooperationProject || '--'}} {{scope.row.cooperationProject || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="followProject" label="跟进项目" width="90">
prop="followProject"
label="跟进项目"
width="90">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.followProject || '--'}} {{scope.row.followProject || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="reserveProject" label="储备项目" width="90">
prop="reserveProject"
label="储备项目"
width="90">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.reserveProject || '--'}} {{scope.row.reserveProject || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="legalPerson" label="法定代表人" width="110">
prop="legalPerson"
label="法定代表人"
width="110">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.legalPerson || '--'}} {{scope.row.legalPerson || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="registerAddress" label="注册地区" width="160">
prop="registerAddress"
label="注册地区"
width="160">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.registerAddress || '--'}} {{scope.row.registerAddress || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="registerCapitalStr" label="注册资本金（万元）" width="160">
prop="registerCapitalStr"
label="注册资本金（万元）"
width="160">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.registerCapital && scope.row.registerCapital>0">{{scope.row.registerCapital}}</span><span v-else>--</span> <span v-if="scope.row.registerCapital && scope.row.registerCapital>0">{{scope.row.registerCapital}}</span><span v-else>--</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="creditLevel" label="企业主体评级" width="100">
prop="creditLevel"
label="企业主体评级" width="100">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.creditLevel || '--'}} {{scope.row.creditLevel || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="isOn" label="上市公司" width="76">
prop="isOn"
label="上市公司" width="76">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.isOn == 1?"是":"否"}} {{scope.row.isOn == 1?"是":"否"}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="isMajor" label="局级大客户" width="88">
prop="isMajor"
label="局级大客户" width="88">
<template slot-scope="scope"> <template slot-scope="scope">
<span v-if="scope.row.isMajor != null"> <span v-if="scope.row.isMajor != null">
{{scope.row.isMajor == 1?"是":"否"}} {{scope.row.isMajor == 1?"是":"否"}}
</span> </span>
<span v-else>--</span> <span v-else>--</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="customerLevel" label="客户等级" width="76">
prop="customerLevel"
label="客户等级" width="76">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.customerLevel || '--'}} {{scope.row.customerLevel || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="companyNature" label="客户性质" width="76">
prop="companyNature"
label="客户性质" width="76">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.companyNature || '--'}} {{scope.row.companyNature || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="companyLevel" label="客户级别" width="76">
prop="companyLevel"
label="客户级别" width="76">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.companyLevel || '--'}} {{scope.row.companyLevel || '--'}}
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="address" label="企业母公司" width="268">
prop="address"
label="企业母公司" width="268">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="">{{scope.row.superCompany || '--'}}</div> <div class="">{{scope.row.superCompany || '--'}}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column :key="keys" <el-table-column :key="keys" prop="mainBusiness" label="主营业务" width="400">
prop="mainBusiness"
label="主营业务" width="400">
<template slot-scope="scope"> <template slot-scope="scope">
<div v-if="scope.row.mainBusiness == null || scope.row.mainBusiness == ''">--</div> <div v-if="scope.row.mainBusiness == null || scope.row.mainBusiness == ''">--</div>
<div v-if="scope.row.mainBusiness1"> <div v-if="scope.row.mainBusiness1">
<div class="box" v-if="scope.row.sq1==true">{{scope.row.mainBusiness1}}...<span @click="sq1(scope.row,false)">更多</span></div> <div class="box" v-if="scope.row.sq1==true">{{scope.row.mainBusiness1}}...<span @click="sq1(scope.row,false)">更多</span></div>
<div class="box" v-else>{{scope.row.mainBusiness}}<span @click="sq1(scope.row,true)">收起</span></div> <div class="box" v-else>{{scope.row.mainBusiness}}<span @click="sq1(scope.row,true)">收起</span></div>
</div> </div>
<div v-else>{{scope.row.mainBusiness}}</div> <div v-else>{{scope.row.mainBusiness}}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="companyAttribute" :key="keys+2" label="发包属性" width="400">
prop="companyAttribute" :key="keys+2"
label="发包属性" width="400">
<template slot-scope="scope"> <template slot-scope="scope">
<div v-if="scope.row.companyAttribute == null || scope.row.companyAttribute == ''">--</div> <div v-if="scope.row.companyAttribute == null || scope.row.companyAttribute == ''">--</div>
<div v-if="scope.row.companyAttribute1"> <div v-if="scope.row.companyAttribute1">
<div class="box" v-if="scope.row.sq2==true">{{scope.row.companyAttribute1}}...<span @click="sq2(scope.row,false)">更多</span></div> <div class="box" v-if="scope.row.sq2==true">{{scope.row.companyAttribute1}}...<span @click="sq2(scope.row,false)">更多</span></div>
<div class="box" v-else>{{scope.row.companyAttribute}}<span @click="sq2(scope.row,true)">收起</span></div> <div class="box" v-else>{{scope.row.companyAttribute}}<span @click="sq2(scope.row,true)">收起</span></div>
</div> </div>
<div v-else>{{scope.row.companyAttribute}}</div> <div v-else>{{scope.row.companyAttribute}}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column <el-table-column prop="followUser" label="跟进人" width="110">
prop="followUser"
label="跟进人" width="110">
<template slot-scope="scope"> <template slot-scope="scope">
{{scope.row.followUser || '--'}} {{scope.row.followUser || '--'}}
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
<div class="bottems" v-if="tableData.total>searchParam.pageSize"> <div class="bottems" v-if="tableData.total>searchParam.pageSize">
<el-pagination <el-pagination background :page-size="searchParam.pageSize" :current-page="searchParam.pageNum" @current-change="handleCurrentChange"
background layout="prev, pager, next" :total="tableData.total">
:page-size="searchParam.pageSize"
:current-page="searchParam.pageNum"
@current-change="handleCurrentChange"
layout="prev, pager, next"
:total="tableData.total">
</el-pagination> </el-pagination>
</div> </div>
<div class="delform" v-if="RLcompanyName"> <div class="delform" v-if="RLcompanyName">
...@@ -216,30 +164,30 @@ ...@@ -216,30 +164,30 @@
</template> </template>
<script> <script>
import { getToken } from "@/utils/auth"; import { getToken } from "@/utils/auth";
import "@/assets/styles/project.scss" import "@/assets/styles/project.scss";
import {getCustomerList,importData,addCustomer} from '@/api/custom/custom' import { getCustomerList, importData, addCustomer } from '@/api/custom/custom';
import {getEnterprise,getDictType,} from '@/api/main' import { getEnterprise, getDictType, } from '@/api/main';
import {encodeStr} from "@/assets/js/common" import { encodeStr } from "@/assets/js/common";
import { historyClaim } from "@/api/common" //认领 import { historyClaim } from "@/api/common"; //认领
import skeleton from '../../project/projectList/component/skeleton' import skeleton from '../../project/projectList/component/skeleton';
export default { export default {
name: 'CustomList', name: 'CustomList',
components:{skeleton}, components: { skeleton },
data() { data() {
return{ return {
encodeStr, encodeStr,
searchParam:{ searchParam: {
companyName:'', companyName: '',
pageNum:1, pageNum: 1,
pageSize:20, pageSize: 20,
status:1, status: 1,
}, },
tableData: [],//列表 tableData: [],//列表
customerLevel:[],//客户等级 customerLevel: [],//客户等级
rules:{ rules: {
companyName:[{ required: true, message: '请输入非空格字符！', trigger: 'blur' },] companyName: [{ required: true, message: '请输入非空格字符！', trigger: 'blur' },]
}, },
//批量导入 //批量导入
action: process.env.VUE_APP_BASE_API + "/customer/importData", action: process.env.VUE_APP_BASE_API + "/customer/importData",
...@@ -248,102 +196,102 @@ export default { ...@@ -248,102 +196,102 @@ export default {
Authorization: "Bearer " + getToken(), Authorization: "Bearer " + getToken(),
}, },
// isNew:true, // isNew:true,
showlist:false, showlist: false,
keys:1, keys: 1,
RLcompanyName:'',//重新认领企业名称 RLcompanyName: '',//重新认领企业名称
isSkeleton:true, isSkeleton: true,
showClearIcon: false, showClearIcon: false,
searchHoverStatus: false, searchHoverStatus: false,
hover: false, hover: false,
} };
}, },
created() { created() {
this.$watch( this.$watch(
() => this.$route.params, () => this.$route.params,
() => { () => {
this.getCustomerList() this.getCustomerList();
this.getDictType() this.getDictType();
this.searchParam.companyName = '' this.searchParam.companyName = '';
},{ immediate: true }) }, { immediate: true });
}, },
methods:{ methods: {
sq1(item,sq){ sq1(item, sq) {
this.$nextTick(()=>{ this.$nextTick(() => {
item.sq1 = sq item.sq1 = sq;
this.keys++ ; this.keys++;
}) });
}, },
sq2(item,sq){ sq2(item, sq) {
this.$nextTick(()=>{ this.$nextTick(() => {
item.sq2 = sq item.sq2 = sq;
this.keys++ ; this.keys++;
}) });
}, },
handleALL(event){ handleALL(event) {
var one = document.getElementById("box"); var one = document.getElementById("box");
if(one){ if (one) {
if(!one.contains(event.target)){ if (!one.contains(event.target)) {
this.showlist = false this.showlist = false;
} }
} }
}, },
toct(){ toct() {
this.dialogVisible = false this.dialogVisible = false;
this.$router.push({path:'/macro/urban'}) this.$router.push({ path: '/macro/urban' });
}, },
getDictType(){ getDictType() {
//获取客户等级 //获取客户等级
getDictType('customer_level_type').then(result=>{ getDictType('customer_level_type').then(result => {
this.customerLevel = result.code == 200 ? result.data:[] this.customerLevel = result.code == 200 ? result.data : [];
}) });
}, },
//获取客户列表 //获取客户列表
getCustomerList(){ getCustomerList() {
getCustomerList(this.searchParam).then(result=>{ getCustomerList(this.searchParam).then(result => {
this.isSkeleton = false this.isSkeleton = false;
this.tableData = result this.tableData = result;
this.tableData.rows.forEach(item=>{ this.tableData.rows.forEach(item => {
item.registerCapital = item.registerCapital == null?null: item.registerCapital.replace(/^\D*(\d*(?:\.\d{0,6})?).*$/g, '$1') item.registerCapital = item.registerCapital == null ? null : item.registerCapital.replace(/^\D*(\d*(?:\.\d{0,6})?).*$/g, '$1');
if(item.mainBusiness != "" && item.mainBusiness != null && item.mainBusiness.length>84){ if (item.mainBusiness != "" && item.mainBusiness != null && item.mainBusiness.length > 84) {
item.mainBusiness1 = item.mainBusiness.substring(0,81) item.mainBusiness1 = item.mainBusiness.substring(0, 81);
item.sq1 = true item.sq1 = true;
}else{ } else {
item.sq1 = false item.sq1 = false;
} }
if(item.companyAttribute != "" && item.companyAttribute != null && item.companyAttribute.length>84){ if (item.companyAttribute != "" && item.companyAttribute != null && item.companyAttribute.length > 84) {
item.companyAttribute1 = item.companyAttribute.substring(0,81) item.companyAttribute1 = item.companyAttribute.substring(0, 81);
item.sq2 = true item.sq2 = true;
}else{ } else {
item.sq2 = false item.sq2 = false;
} }
}) });
}) });
}, },
//跳转到客户详情 //跳转到客户详情
toDetail(row,type){ toDetail(row, type) {
let customerId = row.customerId let customerId = row.customerId;
let companyId = row.companyId let companyId = row.companyId;
let path = type let path = type;
// if(type == "" && companyId == null){ // if(type == "" && companyId == null){
// path = 'business' // path = 'business'
// } // }
this.$router.push({path:'/enterprise/'+encodeStr(companyId),query:{customerId:customerId,path:path}}) this.$router.push({ path: '/enterprise/' + encodeStr(companyId), query: { customerId: customerId, path: path } });
}, },
//认领客户 //认领客户
async toRL(row){ async toRL(row) {
this.RLcompanyName = row.companyName.replace(/<[^>]+>/g, '') this.RLcompanyName = row.companyName.replace(/<[^>]+>/g, '');
}, },
async RL(){ async RL() {
let res = await historyClaim(this.RLcompanyName) let res = await historyClaim(this.RLcompanyName);
if(res.code==200){ if (res.code == 200) {
this.$message.success('认领成功！') this.$message.success('认领成功！');
this.handleCurrentChange(1) this.handleCurrentChange(1);
this.RLcompanyName='' this.RLcompanyName = '';
} }
}, },
clearname(value){ clearname(value) {
if(value == ""){ if (value == "") {
this.handleCurrentChange(1) this.handleCurrentChange(1);
} }
}, },
handleSearch() { handleSearch() {
...@@ -354,14 +302,14 @@ export default { ...@@ -354,14 +302,14 @@ export default {
}, },
//翻页 //翻页
handleCurrentChange(val) { handleCurrentChange(val) {
this.isSkeleton = true this.isSkeleton = true;
this.searchParam.pageNum=val this.searchParam.pageNum = val;
this.getCustomerList() this.getCustomerList();
}, },
searchFocus(event) { searchFocus(event) {
const { target } = event; const { target } = event;
if (target?.value?.length) { if (target?.value?.length) {
this.showClearIcon=true this.showClearIcon = true;
} }
}, },
searchBlur(event) { searchBlur(event) {
...@@ -394,203 +342,202 @@ export default { ...@@ -394,203 +342,202 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.delform{ .delform {
width: 228px; width: 228px;
left: 50%; left: 50%;
top: 50%; top: 50%;
margin-left: -114px; margin-left: -114px;
margin-top: -57px; margin-top: -57px;
.words{ .words {
font-size: 14px; font-size: 14px;
}
}
.app-container{
height: calc(100vh - 134px)
} }
.box-card{ }
padding-top: 16px; .app-container {
width: 100%; height: calc(100vh - 134px);
height: 100%; }
.table_search{ .box-card {
::v-deep .normal-search-container { padding-top: 16px;
display: flex; width: 100%;
align-items: center; height: 100%;
line-height: 32px; .table_search {
height: 32px; ::v-deep .normal-search-container {
&.is-hover-search { display: flex;
width: 238px; align-items: center;
background: #f4f6f9; line-height: 32px;
border-radius: 4px 4px 4px 4px; height: 32px;
&.is-hover-search {
width: 238px;
background: #f4f6f9;
border-radius: 4px 4px 4px 4px;
& > img { & > img {
cursor: unset; cursor: unset;
}
} }
}
&:hover { &:hover {
& > span { & > span {
color: #0081ff; color: #0081ff;
}
} }
}
& > img { & > img {
width: 16px; width: 16px;
height: 16px; height: 16px;
margin-left: 12px; margin-left: 12px;
cursor: pointer; cursor: pointer;
} }
& > span { & > span {
color: rgba(35, 35, 35, 0.8);
font-weight: 400;
margin-left: 8px;
line-height: 22px;
font-size: 14px;
cursor: pointer;
}
.el-input {
& > .el-input__inner {
border: none;
height: 32px;
line-height: 32px;
caret-color: #0081ff;
color: rgba(35, 35, 35, 0.8); color: rgba(35, 35, 35, 0.8);
font-weight: 400;
margin-left: 8px;
line-height: 22px;
font-size: 14px; font-size: 14px;
cursor: pointer; background: #f4f6f9;
} padding-right: 26px;
padding-left: 8px;
.el-input { &::placeholder {
& > .el-input__inner { color: rgba(35, 35, 35, 0.4) !important;
border: none; font-size: 14px !important;
height: 32px;
line-height: 32px; line-height: 32px;
caret-color: #0081ff;
color: rgba(35, 35, 35, 0.8);
font-size: 14px;
background: #f4f6f9;
padding-right: 26px;
padding-left: 8px;
&::placeholder {
color: rgba(35, 35, 35, 0.4) !important;
font-size: 14px !important;
line-height: 32px;
}
} }
.el-input__suffix { }
right: 12px; .el-input__suffix {
display: flex; right: 12px;
align-items: center; display: flex;
align-items: center;
.el-input__suffix-inner { .el-input__suffix-inner {
height: 14px; height: 14px;
width: 14px; width: 14px;
} }
img { img {
cursor: pointer; cursor: pointer;
vertical-align: unset; vertical-align: unset;
margin-bottom: 14px; margin-bottom: 14px;
}
} }
} }
} }
} }
} }
.box{ }
position: relative; .box {
>span{ position: relative;
position: absolute; > span {
right: 10px; position: absolute;
bottom: 0; right: 10px;
color: #0081FF; bottom: 0;
cursor: pointer; color: #0081ff;
&:hover{ cursor: pointer;
color: #006AD1; &:hover {
} color: #006ad1;
}
}
.dc{
font-size: 12px;
color: #3D3D3D;
font-weight: 400;
position: relative;
line-height: 32px;
&::after{
content: ' ';
width: 2px;
height: 2px;
background: rgba(35,35,35,0.4);
border-radius: 50%;
position: absolute;
top: 16px;
left: 14px;
}
>div{
display: inline-block;
margin-left: 20px;
} }
} }
.img.img1{ }
margin-right: 2px; .dc {
background: url('../../../../src/assets/images/project/add_2.png')no-repeat center center; font-size: 12px;
background-size: 100%; color: #3d3d3d;
font-weight: 400;
position: relative;
line-height: 32px;
&::after {
content: " ";
width: 2px;
height: 2px;
background: rgba(35, 35, 35, 0.4);
border-radius: 50%;
position: absolute;
top: 16px;
left: 14px;
} }
.w88{ > div {
width: 88px; display: inline-block;
margin-left: 20px;
} }
.tables{ }
position: relative; .img.img1 {
min-height: calc(100vh - 134px); margin-right: 2px;
/*overflow: auto;*/ background: url("../../../../src/assets/images/project/add_2.png") no-repeat
.empty{ center center;
position: absolute; background-size: 100%;
top: 50%; }
left: 50%; .w88 {
transform: translate(-50%,-50%); width: 88px;
.btn{ }
margin-right: 8px; .tables {
margin-top: 16px; position: relative;
} min-height: calc(100vh - 134px);
/*overflow: auto;*/
.empty {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
.btn {
margin-right: 8px;
margin-top: 16px;
} }
} }
.ps1{ }
.ps1 {
display: flex;
justify-content: space-between;
.ps2 {
width: 350px;
}
.ps3 {
width: 60px;
display: flex; display: flex;
justify-content: space-between; justify-content: right;
.ps2{ > div {
width: 350px; margin-left: 12px;
} > img {
.ps3{ float: right;
width: 60px; margin: 3px 0 0 4px;
display: flex; width: 14px;
justify-content: right; }
>div{ .i {
margin-left: 12px; display: inline-block;
>img{ }
float: right; .o {
margin: 3px 0 0 4px; display: none;
width: 14px; }
} &:hover {
.i{ cursor: pointer;
display: inline-block; .i {
}
.o{
display: none; display: none;
} }
&:hover{ .o {
cursor: pointer; display: inline-block;
.i{
display: none;
}
.o{
display: inline-block;
}
} }
} }
} }
} }
.popbot{ }
.wordprimary{ .popbot {
display: inline; .wordprimary {
padding-right: 26px; display: inline;
} padding-right: 26px;
}
.app-container{
height: auto;
} }
.searchInput{ }
.el-input{
width: 260px; .searchInput {
} .el-input {
width: 260px;
} }
}
</style> </style>
dsk-operate-ui/src/views/index.vue
View file @ f166a9fa
This source diff could not be displayed because it is too large. You can view the blob instead.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment