Skip to content

D
dsk-operate-sys-cscec
Commit 0e2f12b4 authored by danfuman's avatar danfuman
Browse files
Options

修改

parent 3f50580f
Hide whitespace changes
Inline Side-by-side
Showing with 218 additions and 21 deletions
dsk-operate-ui/src/views/custom/customList/index.vue
View file @ 0e2f12b4
......@@ -57,7 +57,7 @@
<img src="@/assets/images/enterprise/enterprise-search-icon.svg" alt="">
<span v-show="!hover && !searchParam.companyName">搜索</span>
<el-input v-model="searchParam.companyName" placeholder="输入关键词查询"
@focus="searchFocus($event)" @blur="searchBlur($event)"
@focus="searchFocus($event)" @blur="searchBlur($event)" @keydown.native.enter="handleSearch"
@input="value => searchInput(value)" v-show="hover || searchParam.companyName">
<template slot="suffix">
<transition mode="out-in" appear name="fade">
......
dsk-operate-ui/src/views/custom/historicalCustomers/index.vue
View file @ 0e2f12b4
......@@ -8,10 +8,23 @@
<div class="p2">建议调整关键词或筛选条件，重新搜索</div>
</div>
<div class="table_search">
<div class="newSearch">
<el-input type="text" v-model="searchParam.companyName" clearable placeholder="输入企业名称查询" @change="clearname" >
<i slot="prefix" class="el-input__icon"><img src="@/assets/images/project/sousuo.png" width="16px" @click="handleCurrentChange(1)"></i>
</el-input>
<div>
<!-- 未点击前的输入框样式 -->
<div class="normal-search-container" :class="{'is-hover-search' : hover}" @mouseover="searchHover($event)"
@mouseleave="searchUnHover($event,searchParam.companyName)">
<img src="@/assets/images/enterprise/enterprise-search-icon.svg" alt="">
<span v-show="!hover && !searchParam.companyName">搜索</span>
<el-input v-model="searchParam.companyName" placeholder="输入关键词查询"
@focus="searchFocus($event)" @blur="searchBlur($event)" @keydown.native.enter="getCustomerList"
@input="value => searchInput(value)" v-show="hover || searchParam.companyName">
<template slot="suffix">
<transition mode="out-in" appear name="fade">
<img src="@/assets/images/enterprise/search-input-clear-icon.svg" alt="" @click.stop="searchParam.companyName = '';getCustomerList()"
v-show="showClearIcon">
</transition>
</template>
</el-input>
</div>
</div>
<div class="dc">
<div class="total">共{{tableData.total}}条</div>
......@@ -239,6 +252,8 @@ export default {
keys:1,
RLcompanyName:'',//重新认领企业名称
isSkeleton:true,
showClearIcon: false,
hover: false,
}
},
created() {
......@@ -336,6 +351,28 @@ export default {
this.searchParam.pageNum=val
this.getCustomerList()
},
searchFocus(event) {
const { target } = event;
if (target?.value?.length) {
this.showClearIcon=true
}
},
searchBlur(event) {
this.showClearIcon=false
},
searchInput(value) {
if (value?.length) {
this.showClearIcon=true
}
},
searchHover(event) {
this.hover=true
},
searchUnHover(event, value) {
if (!value) {
this.hover=false
}
},
}
}
</script>
......@@ -358,6 +395,81 @@ export default {
padding-top: 16px;
width: 100%;
height: 100%;
.table_search{
::v-deep .normal-search-container {
display: flex;
align-items: center;
line-height: 32px;
height: 32px;
&.is-hover-search {
width: 238px;
background: #f4f6f9;
border-radius: 4px 4px 4px 4px;
& > img {
cursor: unset;
}
}
&:hover {
& > span {
color: #0081ff;
}
}
& > img {
width: 16px;
height: 16px;
margin-left: 12px;
cursor: pointer;
}
& > 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);
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;
display: flex;
align-items: center;
.el-input__suffix-inner {
height: 14px;
width: 14px;
}
img {
cursor: pointer;
vertical-align: unset;
margin-bottom: 14px;
}
}
}
}
}
}
.box{
position: relative;
......
dsk-operate-ui/src/views/macro/enterprises/index.vue
View file @ 0e2f12b4
......@@ -32,19 +32,35 @@
<!--<i slot="prefix" class="el-icon-search"></i>-->
<!--<el-button slot="append" @click="handleSearch()">搜索</el-button>-->
<!--</el-input>-->
<!--&lt;!&ndash; 未点击前的输入框样式 &ndash;&gt;-->
<!--<div class="normal-search-container" @click="showSearchBox = true" v-if="!showSearchBox">-->
<!--<img src="@/assets/images/enterprise/enterprise-search-icon.svg" alt="">-->
<!--<span>搜索</span>-->
<!--</div>-->
<!--&lt;!&ndash; 输入框展开后样式 &ndash;&gt;-->
<!--<transition @enter="onEnter" appear mode="out-in">-->
<!--<div class="cooperate-name enterprise-search-container" id="focus1" v-if="showSearchBox">-->
<!--<el-input clearable @clear="handleSearch" @focus="clickFocus('focus1')" @blur="clickFocus('focus1')" v-model="queryParams.ename"-->
<!--placeholder="输入关键词查询"></el-input>-->
<!--<span @click="handleSearch">搜索</span>-->
<!--</div>-->
<!--</transition>-->
<!-- 未点击前的输入框样式 -->
<div class="normal-search-container" @click="showSearchBox = true" v-if="!showSearchBox">
<div class="normal-search-container" :class="{'is-hover-search' : hover}" @mouseover="searchHover($event)"
@mouseleave="searchUnHover($event,queryParams.ename)">
<img src="@/assets/images/enterprise/enterprise-search-icon.svg" alt="">
<span>搜索</span>
<span v-show="!hover && !queryParams.ename">搜索</span>
<el-input v-model="queryParams.ename" placeholder="输入关键词查询"
@focus="searchFocus($event)" @blur="searchBlur($event)" @keydown.native.enter="handleSearch"
@input="value => searchInput(value)" v-show="hover || queryParams.ename">
<template slot="suffix">
<transition mode="out-in" appear name="fade">
<img src="@/assets/images/enterprise/search-input-clear-icon.svg" alt="" @click.stop="queryParams.ename = '';handleSearch()"
v-show="showClearIcon">
</transition>
</template>
</el-input>
</div>
<!-- 输入框展开后样式 -->
<transition @enter="onEnter" appear mode="out-in">
<div class="cooperate-name enterprise-search-container" id="focus1" v-if="showSearchBox">
<el-input clearable @clear="handleSearch" @focus="clickFocus('focus1')" @blur="clickFocus('focus1')" v-model="queryParams.ename"
placeholder="输入关键词查询"></el-input>
<span @click="handleSearch">搜索</span>
</div>
</transition>
<span class="total">共{{tableDataTotal}}条</span>
</div>
<skeleton v-if="isSkeleton" style="padding: 16px"></skeleton>
......@@ -157,7 +173,8 @@ export default {
timePlaceholder:'中标时间',
inputID1:this.getUid(),
inputID2:this.getUid(),
showSearchBox: false
showClearIcon: false,
hover: false,
}
},
created() {
......@@ -315,6 +332,28 @@ export default {
this.querySubmit()
}
},
searchFocus(event) {
const { target } = event;
if (target?.value?.length) {
this.showClearIcon=true
}
},
searchBlur(event) {
this.showClearIcon=false
},
searchInput(value) {
if (value?.length) {
this.showClearIcon=true
}
},
searchHover(event) {
this.hover=true
},
searchUnHover(event, value) {
if (!value) {
this.hover=false
}
},
formatStatus: function(row, column, cellValue) {
return cellValue? cellValue : '-'
},
......@@ -593,12 +632,21 @@ export default {
margin-bottom: 3px;
}
}
.normal-search-container {
margin-left: 12px;
::v-deep .normal-search-container {
display: flex;
align-items: center;
cursor: pointer;
height: 34px;
line-height: 32px;
height: 32px;
&.is-hover-search {
width: 238px;
background: #f4f6f9;
border-radius: 4px 4px 4px 4px;
& > img {
cursor: unset;
}
}
&:hover {
& > span {
color: #0081ff;
......@@ -609,15 +657,52 @@ export default {
width: 16px;
height: 16px;
margin-left: 12px;
cursor: pointer;
}
& > span {
color: #232323;
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);
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;
display: flex;
align-items: center;
.el-input__suffix-inner {
height: 14px;
width: 14px;
}
img {
cursor: pointer;
vertical-align: unset;
margin-bottom: 14px;
}
}
}
}
.cooperate-name {
......
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