优化表头排序图标上文字提示

This commit is contained in:
GoEdgeLab
2022-08-27 18:45:07 +08:00
parent 7a3bfce67e
commit 9ed92e06fd

View File

@@ -4,6 +4,7 @@ Vue.component("sort-arrow", {
data: function () { data: function () {
let url = window.location.toString() let url = window.location.toString()
let order = "" let order = ""
let iconTitle = ""
let newArgs = [] let newArgs = []
if (window.location.search != null && window.location.search.length > 0) { if (window.location.search != null && window.location.search.length > 0) {
let queryString = window.location.search.substring(1) let queryString = window.location.search.substring(1)
@@ -26,10 +27,13 @@ Vue.component("sort-arrow", {
} }
if (order == "asc") { if (order == "asc") {
newArgs.push(this.name + "=desc") newArgs.push(this.name + "=desc")
iconTitle = "当前正序排列"
} else if (order == "desc") { } else if (order == "desc") {
newArgs.push(this.name + "=asc") newArgs.push(this.name + "=asc")
iconTitle = "当前倒序排列"
} else { } else {
newArgs.push(this.name + "=desc") newArgs.push(this.name + "=desc")
iconTitle = "当前正序排列"
} }
let qIndex = url.indexOf("?") let qIndex = url.indexOf("?")
@@ -41,8 +45,9 @@ Vue.component("sort-arrow", {
return { return {
order: order, order: order,
url: url url: url,
iconTitle: iconTitle
} }
}, },
template: `<a :href="url" title="排序">&nbsp; <i class="ui icon long arrow small" :class="{down: order == 'asc', up: order == 'desc', 'down grey': order == '' || order == null}"></i></a>` template: `<a :href="url" :title="iconTitle">&nbsp; <i class="ui icon long arrow small" :class="{down: order == 'asc', up: order == 'desc', 'down grey': order == '' || order == null}"></i></a>`
}) })