123

igirl-channel-jdweb/app/front/vues/pages/jdtrademark/jdtrademark.css

@@ -107,7 +107,7 @@ li {
 }
 
 .jdtrademark-search>div:nth-last-child(1) {
-        box-shadow: 0 2px 4px 0 rgba(0,0,0,.1);
+        box-shadow: 0 2px 4px 0 rgba(0, 0, 0, .1);
         margin-top: 28px;
         width: 170px;
         height: 54px;
@@ -138,9 +138,11 @@ li {
         color: rgba(153, 153, 153, 1);
         text-align: center;
 }
-.brand-text>span:not(:nth-child(1)){
+
+.brand-text>span:not(:nth-child(1)) {
         margin-left: 45px;
 }
+
 /* 轮播 */
 .brandreg-swiper {
         position: relative;
@@ -415,4 +417,19 @@ li {
         font-weight: 400;
         color: rgba(120, 128, 133, 1);
         line-height: 20px;
+}
+
+.showncllist-enter-active,
+.showncllist-leave-active {
+        transition: all .5s;
+}
+
+.showncllist-enter,
+.showncllist-leave-to {
+        opacity: 0;
+}
+
+.showncllist-enter-to,
+.showncllist-leave {
+        opacity: 1;
 }
\ No newline at end of file

igirl-channel-jdweb/app/front/vues/pages/jdtrademark/jdtrademark.html

@@ -9,19 +9,22 @@
 					商标检索
 				</span>
 			</div>
-			<div @mouseleave="typeListShow = !typeListShow">
+			<div @mouseleave="typeListShow = false">
 				<input type="text" v-model="searchValue" placeholder="请输入您想检索的商标名称，申请号，申请人等信息">
-				<div @mouseenter="typeListShow = !typeListShow">全部类别 <i class="el-icon-arrow-down"></i></div>
-				<div  class="jdtrademark-typelist" v-show="typeListShow">
-					<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">全选
-					</el-checkbox>
-					<div style="margin: 15px 0;"></div>
-					<el-checkbox-group v-model="checkedType" @change="handleCheckedCitiesChange">
-						<el-checkbox v-for="item in typeList" :label="item.code + item.name " :key="item.code">
-							{{item.code}}{{item.name}}
+				<div @mouseenter="typeListShow = true">全部类别 <i class="el-icon-arrow-down"></i></div>
+				<transition name="showncllist">
+					<div class="jdtrademark-typelist" v-if="typeListShow">
+						<el-checkbox :indeterminate="isIndeterminate" v-model="checkAll" @change="handleCheckAllChange">
+							全选
 						</el-checkbox>
-					</el-checkbox-group>
-				</div>
+						<div style="margin: 15px 0;"></div>
+						<el-checkbox-group v-model="checkedType" @change="handleCheckedCitiesChange">
+							<el-checkbox v-for="item in typeList" :label="item.code + item.name " :key="item.code">
+								{{item.code}}{{item.name}}
+							</el-checkbox>
+						</el-checkbox-group>
+					</div>
+				</transition>
 			</div>
 			<div @click="goSearch">
 				检索
@@ -70,7 +73,8 @@
 										<div>
 											<div><sup>￥</sup><span>{{item.proPrice}}</span>/件</div>
 											<div class="brandreg-swiper-content-button"
-												:class="{\'brandreg-swiper-content-button-enter\':index==current}" @click="jumpJdProductDetails(item,$event)">立即购买
+												:class="{\'brandreg-swiper-content-button-enter\':index==current}"
+												@click="jumpJdProductDetails(item,$event)">立即购买
 											</div>
 										</div>
 									</div>

igirl-channel-jdweb/app/front/vues/pages/selftmreg/index.css

@@ -708,8 +708,8 @@
 
 .message-enter,
 .message-leave-to
-
-/* .fade-leave-active below version 2.1.8 */
+/* 
+.fade-leave-active below version 2.1.8 */
     {
     opacity: 0;
 }
\ No newline at end of file