购物车底部卡片动画

<footer class="footer" ref='panel'>
			<span class="pu">总计（不含运费）</span><span @click="down" ref='upordown' class="arrow">></span><br>
			<br>
			<span class="acc">共选中了<span class="red">{{ $store.getters.selectNum.number }}</span>件,共<span class="red">￥{{ $store.getters.selectNum.money }}</span>元</span>
			<button class="account">去结算</button>
		</footer>

down(){
				if(this.$refs.upordown.innerText == '<'){
					this.$refs.panel.style.bottom = '54px';
					this.$refs.panel.style.transition = 'all 1s ease';
					setTimeout(()=>{this.$refs.upordown.innerHTML = '>';},1000)
				}else{
					this.$refs.panel.style.bottom = '0px';
					this.$refs.panel.style.transition = 'all 1s ease';
					setTimeout(()=>{this.$refs.upordown.innerHTML = '<';},1000)
				}
			},

.arrow{
		display: block;
		width: 30px;
		height: 40px;
		background-color: #ccc;
		text-align: center;
		line-height: 40px;
		font-size: 25px;
		transform: rotate(90deg) translateY(-20px) scale(.5,1) translateX(4px);
		margin: -15px auto;
	}