Commit f358377c authored by Inner peace's avatar Inner peace

鼠标样式修改

parent 2886a922
<template> <template>
<div class="contrast_card"> <div class="contrast_card" ref="contrastCard">
<div class="top_border"></div> <div class="top_border"></div>
<div class="top_side_dot"/> <div class="top_side_dot"/>
<div class="bottom_side_dot"/> <div class="bottom_side_dot"/>
...@@ -13,7 +13,16 @@ ...@@ -13,7 +13,16 @@
<script> <script>
export default { export default {
name: "ContrastCard" name: "ContrastCard",
props: {
mouseHand: {
type: Boolean,
default: false
}
},
mounted() {
this.$refs.contrastCard.style.cursor = this.$props.mouseHand ? "pointer" : "default"
}
}; };
</script> </script>
......
<template> <template>
<div class="winner_list"> <div class="winner_list" ref="winnerList">
<table> <table>
<tbody> <tbody>
<tr v-for="(row, idx) in $props.rows" :key="idx" :style="{height: 100 / rows.length + '%'}"> <tr v-for="(row, idx) in $props.rows" :key="idx" :style="{height: 100 / rows.length + '%'}">
...@@ -44,11 +44,18 @@ export default { ...@@ -44,11 +44,18 @@ export default {
default: function(){ default: function(){
return {}; return {};
} }
},
mouseHand: {
type: Boolean,
default: false
} }
}, },
data() { data() {
return {}; return {};
}, },
mounted() {
this.$refs.winnerList.style.cursor = this.$props.mouseHand ? "pointer" : "default"
},
methods: {} methods: {}
}; };
</script> </script>
......
...@@ -35,6 +35,10 @@ export default { ...@@ -35,6 +35,10 @@ export default {
type: String, type: String,
default: "small" default: "small"
}, },
mouseHand:{
type: Boolean,
default: false
}
}, },
data() { data() {
return {}; return {};
...@@ -45,6 +49,7 @@ export default { ...@@ -45,6 +49,7 @@ export default {
if (this.$props.title) { if (this.$props.title) {
this.$refs.boardContent.style.height = this.$props.title_size === "large" ? "calc(100% - 54px)" : "calc(100% - 36px)" this.$refs.boardContent.style.height = this.$props.title_size === "large" ? "calc(100% - 54px)" : "calc(100% - 36px)"
} }
this.$refs.boardContent.style.cursor = this.$props.mouseHand ? "pointer" : "default"
} }
}; };
</script> </script>
...@@ -52,7 +57,6 @@ export default { ...@@ -52,7 +57,6 @@ export default {
<style scoped> <style scoped>
.display_board { .display_board {
cursor: pointer;
position: relative; position: relative;
box-sizing: border-box; box-sizing: border-box;
border-radius: 1.5rem; border-radius: 1.5rem;
......
<template> <template>
<div class="showcase"> <div class="showcase" ref="showcase">
<div class="showcase_cover"/> <div class="showcase_cover"/>
<div class="show_content"> <div class="show_content">
<slot></slot> <slot></slot>
...@@ -15,7 +15,14 @@ ...@@ -15,7 +15,14 @@
export default { export default {
name: "Showcase", name: "Showcase",
props: { props: {
title: String title: String,
mouseHand: {
type: Boolean,
default: false
}
},
mounted() {
this.$refs.showcase.style.cursor = this.$props.mouseHand ? "pointer" : "default"
} }
}; };
</script> </script>
......
...@@ -12,7 +12,7 @@ ...@@ -12,7 +12,7 @@
<input type="button" :class="{'selectedBtn': currentBtn.date === 'year'}" value="年统计" @click="clickBtn('date','year')"> <input type="button" :class="{'selectedBtn': currentBtn.date === 'year'}" value="年统计" @click="clickBtn('date','year')">
</div> </div>
<div class="card-board" v-if="currentBtn.subdivide === '01'"> <div class="card-board" v-if="currentBtn.subdivide === '01'">
<contrast-card v-for="data in currentHeadData" style="height: 100%;width: 18%;" :class="{'selectCard': currentCard === data.key}" @click.native="selectCard(data)"> <contrast-card :mouseHand="true" v-for="data in currentHeadData" style="height: 100%;width: 18%;" :class="{'selectCard': currentCard === data.key}" @click.native="selectCard(data)">
<title-content-mark style="color: #369afa;float: left;width: 40%;font-size: 18px" :title-style="{'font-weight': 'bold'}" :mark-style="{'bottom': '12%'}" :title="data.title" :content="data.amount" mark="万吨" isBold/> <title-content-mark style="color: #369afa;float: left;width: 40%;font-size: 18px" :title-style="{'font-weight': 'bold'}" :mark-style="{'bottom': '12%'}" :title="data.title" :content="data.amount" mark="万吨" isBold/>
<div style="width: 60%; height: 100%; float:left; padding: 2% 2% 0 8%; line-height: 40px; display: flex; align-items: center;font-size: 16px;"> <div style="width: 60%; height: 100%; float:left; padding: 2% 2% 0 8%; line-height: 40px; display: flex; align-items: center;font-size: 16px;">
<table-column style="float: left;width: 25%;" :data="data.hb" name="title"/> <table-column style="float: left;width: 25%;" :data="data.hb" name="title"/>
...@@ -22,7 +22,7 @@ ...@@ -22,7 +22,7 @@
</contrast-card> </contrast-card>
</div> </div>
<div class="card-board" v-if="currentBtn.subdivide !== '01'"> <div class="card-board" v-if="currentBtn.subdivide !== '01'">
<contrast-card v-for="data in currentHeadData" style="height: 100%;width: 18%;" :class="{'selectCard': currentCard === data.key}" @click.native="selectCard(data)" :style="listCardStyle"> <contrast-card :mouseHand="true" v-for="data in currentHeadData" style="height: 100%;width: 18%;" :class="{'selectCard': currentCard === data.key}" @click.native="selectCard(data)" :style="listCardStyle">
<!-- 标题--> <!-- 标题-->
<div style="width: 100%; height: 20%; float:left; padding: 2%; line-height: 28px; display: flex; align-items: center; font-size: 14px;"> <div style="width: 100%; height: 20%; float:left; padding: 2%; line-height: 28px; display: flex; align-items: center; font-size: 14px;">
<table-column style="float: left;width: 80%;" :data="[]" name="title" :title="data.title" :title-formatter="value=> value+'(万吨/万元)'" show-head :title-style="{'font-size': '18px','padding-left':'3%','white-space': 'nowrap','font-weight': 'bold',}"/> <table-column style="float: left;width: 80%;" :data="[]" name="title" :title="data.title" :title-formatter="value=> value+'(万吨/万元)'" show-head :title-style="{'font-size': '18px','padding-left':'3%','white-space': 'nowrap','font-weight': 'bold',}"/>
......
<template> <template>
<div class="turnover-detail"> <div class="turnover-detail">
<div class="card-board"> <div class="card-board">
<contrast-card v-for="(data,key) in currentData.head" style="height: 100%;width: 23%;" <contrast-card :mouseHand="true" v-for="(data,key) in currentData.head" style="height: 100%;width: 23%;"
:class="{'selectCard': currentCard === key}" :class="{'selectCard': currentCard === key}"
@click.native="selectLegend(key)"> @click.native="selectLegend(key)">
<title-content-mark style="color: #369afa;float: left;width: 30%;font-size: 18px" <title-content-mark style="color: #369afa;float: left;width: 30%;font-size: 18px"
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<display-board class="trade_left" title="营业情况"> <display-board class="trade_left" title="营业情况">
<div <div
style="height: 100%; display: flex; flex-direction: column; justify-content: space-around; padding: 0 1rem 0 1rem;"> style="height: 100%; display: flex; flex-direction: column; justify-content: space-around; padding: 0 1rem 0 1rem;">
<contrast-card v-for="data in yyqk" style="height: 28%;" <contrast-card :mouseHand="true" v-for="data in yyqk" style="height: 28%;"
@click.native="routerTo('/turnover-detail',paths[data.title])"> @click.native="routerTo('/turnover-detail',paths[data.title])">
<title-content-mark style="width: 40%;color: #369afa;float: left;" :title="data.title" <title-content-mark style="width: 40%;color: #369afa;float: left;" :title="data.title"
:content="data.amount" :mark="data.unit"/> :content="data.amount" :mark="data.unit"/>
...@@ -47,11 +47,11 @@ ...@@ -47,11 +47,11 @@
</div> </div>
<div class="middle"> <div class="middle">
<display-board class="trade_left" title="已开票未收款"> <display-board class="trade_left" title="已开票未收款">
<winners-list style="height: 96%;overflow: auto;" @click.native="goArBar" id="ar_company_list" :rows="arCompanyList"/> <winners-list style="height: 96%;overflow: auto;" :mouseHand="true" @click.native="goArBar" id="ar_company_list" :rows="arCompanyList"/>
</display-board> </display-board>
<div class="trade_middle" style="border: none;box-shadow: none;"> <div class="trade_middle" style="border: none;box-shadow: none;">
<div style="display: flex; justify-content: space-between; height: 50%;"> <div style="display: flex; justify-content: space-between; height: 50%;">
<display-board style="width: 32%;" title="每日目标情况" @click.native="routerTo('/target-achievement','day')"> <display-board style="width: 32%;" title="每日目标情况" :mouseHand="true" @click.native="routerTo('/target-achievement','day')">
<div <div
style="width: 100%; height: 100%; float:left; padding: 2%; line-height: 33px; display: flex; align-items: center; font-size: 10px;"> style="width: 100%; height: 100%; float:left; padding: 2%; line-height: 33px; display: flex; align-items: center; font-size: 10px;">
<table-column style="float: left;width: 35%;" :data="targetAchievement.day" name="title" show-head/> <table-column style="float: left;width: 35%;" :data="targetAchievement.day" name="title" show-head/>
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
show-head/> show-head/>
</div> </div>
</display-board> </display-board>
<display-board style="width: 32%;" title="月度目标情况" @click.native="routerTo('/target-achievement','month')"> <display-board style="width: 32%;" title="月度目标情况" :mouseHand="true" @click.native="routerTo('/target-achievement','month')">
<div <div
style="width: 100%; height: 100%; float:left; padding: 2%; line-height: 33px; display: flex; align-items: center; font-size: 10px;"> style="width: 100%; height: 100%; float:left; padding: 2%; line-height: 33px; display: flex; align-items: center; font-size: 10px;">
<table-column style="float: left;width: 35%;" :data="targetAchievement.month" name="title" show-head/> <table-column style="float: left;width: 35%;" :data="targetAchievement.month" name="title" show-head/>
...@@ -73,7 +73,7 @@ ...@@ -73,7 +73,7 @@
show-head/> show-head/>
</div> </div>
</display-board> </display-board>
<display-board style="width: 32%;" title="年度目标情况" @click.native="routerTo('/target-achievement','year')"> <display-board style="width: 32%;" title="年度目标情况" :mouseHand="true" @click.native="routerTo('/target-achievement','year')">
<div <div
style="width: 100%; height: 100%; float:left; padding: 2%; line-height: 33px; display: flex; align-items: center; font-size: 10px;"> style="width: 100%; height: 100%; float:left; padding: 2%; line-height: 33px; display: flex; align-items: center; font-size: 10px;">
<table-column style="float: left;width: 35%;" :data="targetAchievement.year" name="title" show-head/> <table-column style="float: left;width: 35%;" :data="targetAchievement.year" name="title" show-head/>
...@@ -112,7 +112,7 @@ ...@@ -112,7 +112,7 @@
content-style="font-size: 16px;" mark-style="font-size: 10px;" content-style="font-size: 16px;" mark-style="font-size: 10px;"
:content="yl.amount" mark="万元"/> :content="yl.amount" mark="万元"/>
</showcase> </showcase>
<showcase style="width: 18%;" title="流失客户" @click.native="routerTo('/lost-add-customer',2)"> <showcase style="width: 18%;" title="流失客户" :mouseHand="true" @click.native="routerTo('/lost-add-customer',2)">
<title-content-mark <title-content-mark
style="float:left;width: 100%;height: 50%;color: #5eeef4;padding: 0 15%;font-size: 16px;" style="float:left;width: 100%;height: 50%;color: #5eeef4;padding: 0 15%;font-size: 16px;"
content-style="font-size: 16px;" mark-style="font-size: 10px;" :content="lskh.weight" content-style="font-size: 16px;" mark-style="font-size: 10px;" :content="lskh.weight"
...@@ -121,7 +121,7 @@ ...@@ -121,7 +121,7 @@
content-style="font-size: 16px;" mark-style="font-size: 10px;" content-style="font-size: 16px;" mark-style="font-size: 10px;"
:content="lskh.amount" mark="万元"/> :content="lskh.amount" mark="万元"/>
</showcase> </showcase>
<showcase style="width: 18%;" title="新增客户" @click.native="routerTo('/lost-add-customer',1)"> <showcase style="width: 18%;" title="新增客户" :mouseHand="true" @click.native="routerTo('/lost-add-customer',1)">
<title-content-mark <title-content-mark
style="float:left;width: 100%;height: 50%;color: #5eeef4;padding: 0 15%;font-size: 16px;" style="float:left;width: 100%;height: 50%;color: #5eeef4;padding: 0 15%;font-size: 16px;"
content-style="font-size: 16px;" mark-style="font-size: 10px;" :content="xzkh.weight" content-style="font-size: 16px;" mark-style="font-size: 10px;" :content="xzkh.weight"
......
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