删除 小程序/WorkbenchPage.jsx
This commit is contained in:
@@ -1,232 +0,0 @@
|
|||||||
const WorkbenchPage = function () {
|
|
||||||
var _React$useState = React.useState(0);
|
|
||||||
var activeTab = _React$useState[0];
|
|
||||||
var setActiveTab = _React$useState[1];
|
|
||||||
|
|
||||||
var todos = [
|
|
||||||
{ id: 1, title: "审批设备巡检报告", status: "待处理", time: "今天" },
|
|
||||||
{ id: 2, title: "处理加氢站异常告警", status: "进行中", time: "今天" },
|
|
||||||
{ id: 3, title: "完成月度资产盘点", status: "待处理", time: "本周" }
|
|
||||||
];
|
|
||||||
|
|
||||||
var stats = [
|
|
||||||
{ label: "待办任务", value: "8", color: "#07c160" },
|
|
||||||
{ label: "本周完成", value: "23", color: "#576b95" },
|
|
||||||
{ label: "告警待处理", value: "2", color: "#fa5151" }
|
|
||||||
];
|
|
||||||
|
|
||||||
var navItems = [
|
|
||||||
{ key: 0, icon: "\uD83D\uDCCA", text: "工作台" },
|
|
||||||
{ key: 1, icon: "\uD83D\uDCC4", text: "业务" },
|
|
||||||
{ key: 2, icon: "\uD83D\uDC64", text: "我的" }
|
|
||||||
];
|
|
||||||
|
|
||||||
var handleNavClick = function (key) {
|
|
||||||
setActiveTab(key);
|
|
||||||
};
|
|
||||||
|
|
||||||
var styles = {
|
|
||||||
page: {
|
|
||||||
minHeight: "100vh",
|
|
||||||
backgroundColor: "#f7f7f7",
|
|
||||||
paddingBottom: "70px",
|
|
||||||
boxSizing: "border-box"
|
|
||||||
},
|
|
||||||
header: {
|
|
||||||
backgroundColor: "#fff",
|
|
||||||
padding: "24px 20px",
|
|
||||||
marginBottom: "12px"
|
|
||||||
},
|
|
||||||
headerTitle: {
|
|
||||||
fontSize: "22px",
|
|
||||||
fontWeight: "600",
|
|
||||||
color: "#333",
|
|
||||||
marginBottom: "4px"
|
|
||||||
},
|
|
||||||
headerSub: {
|
|
||||||
fontSize: "14px",
|
|
||||||
color: "#999"
|
|
||||||
},
|
|
||||||
statsRow: {
|
|
||||||
display: "flex",
|
|
||||||
padding: "0 12px 12px",
|
|
||||||
marginBottom: "12px"
|
|
||||||
},
|
|
||||||
statCard: {
|
|
||||||
flex: 1,
|
|
||||||
backgroundColor: "#fff",
|
|
||||||
borderRadius: "8px",
|
|
||||||
padding: "20px 12px",
|
|
||||||
textAlign: "center",
|
|
||||||
margin: "0 6px"
|
|
||||||
},
|
|
||||||
statValue: {
|
|
||||||
fontSize: "24px",
|
|
||||||
fontWeight: "600",
|
|
||||||
marginBottom: "8px"
|
|
||||||
},
|
|
||||||
statLabel: {
|
|
||||||
fontSize: "13px",
|
|
||||||
color: "#999"
|
|
||||||
},
|
|
||||||
section: {
|
|
||||||
backgroundColor: "#fff",
|
|
||||||
padding: "20px",
|
|
||||||
marginBottom: "12px"
|
|
||||||
},
|
|
||||||
sectionTitle: {
|
|
||||||
fontSize: "17px",
|
|
||||||
fontWeight: "600",
|
|
||||||
color: "#333",
|
|
||||||
marginBottom: "16px",
|
|
||||||
display: "flex",
|
|
||||||
justifyContent: "space-between",
|
|
||||||
alignItems: "center"
|
|
||||||
},
|
|
||||||
sectionMore: {
|
|
||||||
fontSize: "14px",
|
|
||||||
color: "#07c160"
|
|
||||||
},
|
|
||||||
todoItem: {
|
|
||||||
display: "flex",
|
|
||||||
alignItems: "center",
|
|
||||||
padding: "14px 0",
|
|
||||||
borderBottom: "1px solid #f0f0f0"
|
|
||||||
},
|
|
||||||
todoItemLast: {
|
|
||||||
borderBottom: "none"
|
|
||||||
},
|
|
||||||
todoLeft: {
|
|
||||||
flex: 1
|
|
||||||
},
|
|
||||||
todoTitle: {
|
|
||||||
fontSize: "15px",
|
|
||||||
color: "#333",
|
|
||||||
marginBottom: "4px"
|
|
||||||
},
|
|
||||||
todoMeta: {
|
|
||||||
fontSize: "12px",
|
|
||||||
color: "#999"
|
|
||||||
},
|
|
||||||
todoStatus: {
|
|
||||||
fontSize: "12px",
|
|
||||||
padding: "4px 10px",
|
|
||||||
borderRadius: "4px",
|
|
||||||
backgroundColor: "#e8f5e9",
|
|
||||||
color: "#07c160"
|
|
||||||
},
|
|
||||||
todoStatusDoing: {
|
|
||||||
fontSize: "12px",
|
|
||||||
padding: "4px 10px",
|
|
||||||
borderRadius: "4px",
|
|
||||||
backgroundColor: "#fff3e0",
|
|
||||||
color: "#ff9800"
|
|
||||||
},
|
|
||||||
bottomNav: {
|
|
||||||
position: "fixed",
|
|
||||||
bottom: 0,
|
|
||||||
left: 0,
|
|
||||||
right: 0,
|
|
||||||
height: "60px",
|
|
||||||
backgroundColor: "#fff",
|
|
||||||
display: "flex",
|
|
||||||
borderTop: "1px solid #e5e5e5",
|
|
||||||
boxSizing: "border-box"
|
|
||||||
},
|
|
||||||
navItem: {
|
|
||||||
flex: 1,
|
|
||||||
display: "flex",
|
|
||||||
flexDirection: "column",
|
|
||||||
alignItems: "center",
|
|
||||||
justifyContent: "center",
|
|
||||||
cursor: "pointer"
|
|
||||||
},
|
|
||||||
navIcon: {
|
|
||||||
fontSize: "24px",
|
|
||||||
marginBottom: "4px"
|
|
||||||
},
|
|
||||||
navText: {
|
|
||||||
fontSize: "11px",
|
|
||||||
color: "#999"
|
|
||||||
},
|
|
||||||
navTextActive: {
|
|
||||||
color: "#07c160"
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
return React.createElement(
|
|
||||||
"div",
|
|
||||||
{ style: styles.page },
|
|
||||||
React.createElement(
|
|
||||||
"div",
|
|
||||||
{ style: styles.header },
|
|
||||||
React.createElement("div", { style: styles.headerTitle }, "工作台"),
|
|
||||||
React.createElement("div", { style: styles.headerSub }, "欢迎使用 ONE-OS 运管平台")
|
|
||||||
),
|
|
||||||
React.createElement(
|
|
||||||
"div",
|
|
||||||
{ style: styles.statsRow },
|
|
||||||
stats.map(function (stat, i) {
|
|
||||||
var valueStyle = {
|
|
||||||
fontSize: "24px",
|
|
||||||
fontWeight: "600",
|
|
||||||
marginBottom: "8px",
|
|
||||||
color: stat.color
|
|
||||||
};
|
|
||||||
return React.createElement(
|
|
||||||
"div",
|
|
||||||
{ key: i, style: styles.statCard },
|
|
||||||
React.createElement("div", { style: valueStyle }, stat.value),
|
|
||||||
React.createElement("div", { style: styles.statLabel }, stat.label)
|
|
||||||
);
|
|
||||||
})
|
|
||||||
),
|
|
||||||
React.createElement(
|
|
||||||
"div",
|
|
||||||
{ style: styles.section },
|
|
||||||
React.createElement(
|
|
||||||
"div",
|
|
||||||
{ style: styles.sectionTitle },
|
|
||||||
React.createElement("span", null, "待办任务"),
|
|
||||||
React.createElement("span", { style: styles.sectionMore }, "全部")
|
|
||||||
),
|
|
||||||
todos.map(function (todo, i) {
|
|
||||||
var isLast = i === todos.length - 1;
|
|
||||||
var statusStyle = todo.status === "进行中" ? styles.todoStatusDoing : styles.todoStatus;
|
|
||||||
var itemStyle = isLast ? { display: "flex", alignItems: "center", padding: "14px 0", borderBottom: "none" } : styles.todoItem;
|
|
||||||
return React.createElement(
|
|
||||||
"div",
|
|
||||||
{ key: todo.id, style: itemStyle },
|
|
||||||
React.createElement(
|
|
||||||
"div",
|
|
||||||
{ style: styles.todoLeft },
|
|
||||||
React.createElement("div", { style: styles.todoTitle }, todo.title),
|
|
||||||
React.createElement("div", { style: styles.todoMeta }, todo.time)
|
|
||||||
),
|
|
||||||
React.createElement("span", { style: statusStyle }, todo.status)
|
|
||||||
);
|
|
||||||
})
|
|
||||||
),
|
|
||||||
React.createElement(
|
|
||||||
"div",
|
|
||||||
{ style: styles.bottomNav },
|
|
||||||
navItems.map(function (item) {
|
|
||||||
var isActive = activeTab === item.key;
|
|
||||||
var textStyle = isActive ? { fontSize: "11px", color: "#07c160" } : styles.navText;
|
|
||||||
return React.createElement(
|
|
||||||
"div",
|
|
||||||
{
|
|
||||||
key: item.key,
|
|
||||||
style: styles.navItem,
|
|
||||||
onClick: function () { handleNavClick(item.key); }
|
|
||||||
},
|
|
||||||
React.createElement("div", { style: styles.navIcon }, item.icon),
|
|
||||||
React.createElement("div", { style: textStyle }, item.text)
|
|
||||||
);
|
|
||||||
})
|
|
||||||
)
|
|
||||||
);
|
|
||||||
};
|
|
||||||
|
|
||||||
// Axhub 要求必须定义 Component 变量
|
|
||||||
var Component = WorkbenchPage;
|
|
||||||
Reference in New Issue
Block a user