mirror of
https://gitee.com/beijing_hongye_huicheng/lilishop-ui.git
synced 2026-08-06 19:07:25 +08:00
style(components): 将按钮组件替换为链接样式
- 统一将页面中的 Button 组件替换为 a 标签，保持样式一致 - 添加统一的链接样式类 ops-link 和分隔符样式类 ops-sep - 更新操作列中按钮的样式，使用颜色、光标和文本装饰属性替代原有 props 配置 - 在多个文件中调整了操作项之间的分隔符显示逻辑 - 优化表格操作列渲染函数，去除冗余的 Button 属性配置 - 保持功能不变的前提下提升界面视觉一致性
This commit is contained in:
pikachu1995@126.com
@@ -194,49 +194,49 @@ export default {
|
||||
fixed: "right",
|
||||
render: (h, params) => {
|
||||
if (params.row.applyStatus == "APPLY") {
|
||||
return h(
|
||||
"Button",
|
||||
{
|
||||
props: {
|
||||
type: "primary",
|
||||
size: "small",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.showList = {};
|
||||
this.roleModalVisible = true;
|
||||
this.showList = params.row;
|
||||
this.audit =""
|
||||
return h("div", { class: "ops" }, [
|
||||
h(
|
||||
"a",
|
||||
{
|
||||
style: {
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.showList = {};
|
||||
this.roleModalVisible = true;
|
||||
this.showList = params.row;
|
||||
this.audit = "";
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
"审核"
|
||||
);
|
||||
"审核"
|
||||
),
|
||||
]);
|
||||
} else {
|
||||
return h(
|
||||
"Button",
|
||||
{
|
||||
props: {
|
||||
type: "default",
|
||||
size: "small",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.showList = {};
|
||||
this.queryModalVisible = true;
|
||||
this.showList = params.row;
|
||||
this.modalTitle = "查看";
|
||||
return h("div", { class: "ops" }, [
|
||||
h(
|
||||
"a",
|
||||
{
|
||||
style: {
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.showList = {};
|
||||
this.queryModalVisible = true;
|
||||
this.showList = params.row;
|
||||
this.modalTitle = "查看";
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
"查看"
|
||||
);
|
||||
"查看"
|
||||
),
|
||||
]);
|
||||
}
|
||||
},
|
||||
},
|
||||
@@ -347,4 +347,16 @@ export default {
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.ops a {
|
||||
color: #2d8cf0;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
.ops span {
|
||||
display: inline-block;
|
||||
margin: 0 8px;
|
||||
color: #dcdee2;
|
||||
}
|
||||
</style>
|
||||
|
||||
|
||||
@@ -248,15 +248,13 @@ export default {
|
||||
},
|
||||
[
|
||||
h(
|
||||
"Button",
|
||||
"a",
|
||||
{
|
||||
props: {
|
||||
size: "small",
|
||||
type: params.row.___selected ? "primary" : "default",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
display: this.selectedMember ? "block" : "none",
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none",
|
||||
display: this.selectedMember ? "inline-block" : "none",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
@@ -266,17 +264,25 @@ export default {
|
||||
},
|
||||
params.row.___selected ? "已选择" : "选择"
|
||||
),
|
||||
|
||||
h(
|
||||
"Button",
|
||||
"span",
|
||||
{
|
||||
props: {
|
||||
type: "info",
|
||||
size: "small",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
display: this.selectedMember ? "none" : "block",
|
||||
margin: "0 8px",
|
||||
color: "#dcdee2",
|
||||
display: this.selectedMember ? "inline-block" : "none",
|
||||
},
|
||||
},
|
||||
"|"
|
||||
),
|
||||
h(
|
||||
"a",
|
||||
{
|
||||
style: {
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none",
|
||||
display: this.selectedMember ? "none" : "inline-block",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
@@ -287,16 +293,24 @@ export default {
|
||||
"查看"
|
||||
),
|
||||
h(
|
||||
"Button",
|
||||
"span",
|
||||
{
|
||||
props: {
|
||||
type: "info",
|
||||
size: "small",
|
||||
ghost: true,
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
display: this.selectedMember ? "none" : "block",
|
||||
margin: "0 8px",
|
||||
color: "#dcdee2",
|
||||
display: this.selectedMember ? "none" : "inline-block",
|
||||
},
|
||||
},
|
||||
"|"
|
||||
),
|
||||
h(
|
||||
"a",
|
||||
{
|
||||
style: {
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none",
|
||||
display: this.selectedMember ? "none" : "inline-block",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
@@ -307,15 +321,24 @@ export default {
|
||||
"编辑"
|
||||
),
|
||||
h(
|
||||
"Button",
|
||||
"span",
|
||||
{
|
||||
props: {
|
||||
size: "small",
|
||||
type: "error",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
display: this.selectedMember ? "none" : "block",
|
||||
margin: "0 8px",
|
||||
color: "#dcdee2",
|
||||
display: this.selectedMember ? "none" : "inline-block",
|
||||
},
|
||||
},
|
||||
"|"
|
||||
),
|
||||
h(
|
||||
"a",
|
||||
{
|
||||
style: {
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none",
|
||||
display: this.selectedMember ? "none" : "inline-block",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
|
||||
@@ -584,13 +584,12 @@
|
||||
}
|
||||
}, [
|
||||
h(
|
||||
"Button",
|
||||
"a",
|
||||
{
|
||||
props: {
|
||||
type: "info",
|
||||
size: "small",
|
||||
},
|
||||
style: {
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none",
|
||||
marginRight: "5px",
|
||||
},
|
||||
on: {
|
||||
|
||||
@@ -230,92 +230,56 @@ export default {
|
||||
width: 200,
|
||||
fixed: "right",
|
||||
render: (h, params) => {
|
||||
const linkStyle = {
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none",
|
||||
};
|
||||
const sep = h(
|
||||
"span",
|
||||
{ style: { margin: "0 8px", color: "#dcdee2" } },
|
||||
"|"
|
||||
);
|
||||
const children = [];
|
||||
if (this.selectedMember) {
|
||||
children.push(
|
||||
h(
|
||||
"a",
|
||||
{ style: linkStyle, on: { click: () => this.callback(params.row) } },
|
||||
"选择"
|
||||
)
|
||||
);
|
||||
children.push(sep);
|
||||
}
|
||||
children.push(
|
||||
h(
|
||||
"a",
|
||||
{ style: linkStyle, on: { click: () => this.detail(params.row) } },
|
||||
"查看"
|
||||
)
|
||||
);
|
||||
if (!this.selectedMember) {
|
||||
children.push(sep);
|
||||
children.push(
|
||||
h(
|
||||
"a",
|
||||
{ style: linkStyle, on: { click: () => this.enable(params.row) } },
|
||||
"启用"
|
||||
)
|
||||
);
|
||||
children.push(sep);
|
||||
children.push(
|
||||
h(
|
||||
"a",
|
||||
{ style: linkStyle, on: { click: () => this.editPerm(params.row) } },
|
||||
"编辑"
|
||||
)
|
||||
);
|
||||
}
|
||||
return h(
|
||||
"div",
|
||||
{
|
||||
style: {
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
},
|
||||
},
|
||||
[
|
||||
h(
|
||||
"Button",
|
||||
{
|
||||
props: {
|
||||
size: "small",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
display: this.selectedMember ? "block" : "none",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.callback(params.row);
|
||||
},
|
||||
},
|
||||
},
|
||||
"选择"
|
||||
),
|
||||
h(
|
||||
"Button",
|
||||
{
|
||||
props: {
|
||||
type: "info",
|
||||
size: "small",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.detail(params.row);
|
||||
},
|
||||
},
|
||||
},
|
||||
"查看"
|
||||
),
|
||||
|
||||
h(
|
||||
"Button",
|
||||
{
|
||||
props: {
|
||||
size: "small",
|
||||
type: "success",
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
display: this.selectedMember ? "none" : "block",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.enable(params.row);
|
||||
},
|
||||
},
|
||||
},
|
||||
"启用"
|
||||
),
|
||||
|
||||
h(
|
||||
"Button",
|
||||
{
|
||||
props: {
|
||||
type: "info",
|
||||
size: "small",
|
||||
ghost: true,
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px",
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
this.editPerm(params.row);
|
||||
},
|
||||
},
|
||||
},
|
||||
"编辑"
|
||||
),
|
||||
]
|
||||
{ class: "ops", style: { display: "flex", justifyContent: "center" } },
|
||||
children
|
||||
);
|
||||
},
|
||||
},
|
||||
@@ -465,4 +429,14 @@ export default {
|
||||
height: 60px;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.ops a {
|
||||
color: #2d8cf0;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
}
|
||||
.ops span {
|
||||
display: inline-block;
|
||||
margin: 0 8px;
|
||||
color: #dcdee2;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -178,14 +178,12 @@ export default {
|
||||
render: (h, params) => {
|
||||
return h("div", [
|
||||
h(
|
||||
"Button",
|
||||
"a",
|
||||
{
|
||||
props: {
|
||||
type: "primary",
|
||||
size: "small"
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px"
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none"
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
@@ -196,14 +194,17 @@ export default {
|
||||
"编辑"
|
||||
),
|
||||
h(
|
||||
"Button",
|
||||
"span",
|
||||
{ style: { margin: "0 8px", color: "#dcdee2" } },
|
||||
"|"
|
||||
),
|
||||
h(
|
||||
"a",
|
||||
{
|
||||
props: {
|
||||
type: "error",
|
||||
size: "small"
|
||||
},
|
||||
style: {
|
||||
marginRight: "5px"
|
||||
color: "#2d8cf0",
|
||||
cursor: "pointer",
|
||||
textDecoration: "none"
|
||||
},
|
||||
on: {
|
||||
click: () => {
|
||||
|
||||
Reference in New Issue
Block a user