【新增】私有证书

frontend/apps/vue-flow/flow.css

@@ -0,0 +1,213 @@
+.title {
+  font-size: 16px;
+  font-weight: bold;
+  padding: 8px;
+  background-color: white;
+  border-radius: 4px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.node-toolbar {
+  display: flex;
+  gap: 8px;
+  background-color: white;
+  padding: 6px;
+  border-radius: 4px;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.toolbar-btn {
+  cursor: pointer;
+  border: none;
+  padding: 4px 8px;
+  border-radius: 3px;
+  font-size: 12px;
+  color: white;
+  display: flex;
+  align-items: center;
+}
+
+.delete-btn {
+  background-color: #f56c6c;
+}
+
+.delete-btn:hover {
+  background-color: #e64242;
+}
+
+.duplicate-btn {
+  background-color: #409eff;
+}
+
+.duplicate-btn:hover {
+  background-color: #2a8ce8;
+}
+
+/* Vue Flow 自定义样式 */
+
+/* 自定义节点通用样式 */
+.vue-flow__node {
+  border-radius: 5px;
+  font-size: 14px;
+  text-align: center;
+  border: 1px solid #ddd;
+  background-color: white;
+  width: 240px;
+  min-height: 120px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+  transition: all 0.3s ease;
+  z-index: -99 !important;
+}
+
+.vue-flow__node:hover {
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
+  transform: translateY(-2px);
+}
+
+.vue-flow__node.selected {
+  box-shadow: 0 0 0 2px #18a0fb;
+}
+
+/* 开始节点样式 */
+.vue-flow__node.start {
+  background-color: #e6f7ff;
+  border-color: #1890ff;
+  color: #1890ff;
+  font-weight: bold;
+}
+
+/* 结束节点样式 */
+.vue-flow__node.end {
+  background-color: #f6ffed;
+  border-color: #52c41a;
+  color: #52c41a;
+  font-weight: bold;
+}
+
+/* 申请证书节点样式 */
+.vue-flow__node.apply {
+  background-color: #fff7e6;
+  border-color: #fa8c16;
+  color: #fa8c16;
+}
+
+/* 部署证书节点样式 */
+.vue-flow__node.deploy {
+  background-color: #f9f0ff;
+  border-color: #722ed1;
+  color: #722ed1;
+}
+
+/* 通知节点样式 */
+.vue-flow__node.notify {
+  background-color: #fcf4f6;
+  border-color: #eb2f96;
+  color: #eb2f96;
+}
+
+/* 边的样式 */
+.vue-flow__edge {
+  stroke: #b1b1b7;
+  stroke-width: 2;
+  z-index: -1;
+}
+
+.vue-flow__edge.selected {
+  stroke: #18a0fb;
+  stroke-width: 3;
+}
+
+.vue-flow__edge-path {
+  stroke: #b1b1b7;
+  stroke-width: 2;
+  z-index: -1;
+}
+
+.vue-flow__edge-path:hover {
+  stroke: #18a0fb;
+}
+
+.vue-flow__edge.selected .vue-flow__edge-path {
+  stroke: #18a0fb;
+  stroke-width: 3;
+}
+
+/* 连接点样式 */
+.vue-flow__handle {
+  width: 8px;
+  height: 8px;
+  background-color: #1890ff;
+  border-color: white;
+  z-index: 0;
+}
+
+/* 工具栏样式 */
+.node-toolbar {
+  display: flex;
+  gap: 5px;
+  padding: 3px;
+  background: white;
+  border-radius: 4px;
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
+}
+
+.toolbar-btn {
+  padding: 3px 8px;
+  border: none;
+  border-radius: 3px;
+  background: #f5f5f5;
+  color: #333;
+  cursor: pointer;
+  font-size: 12px;
+}
+
+.toolbar-btn:hover {
+  background: #e8e8e8;
+}
+
+.delete-btn {
+  background: #fff1f0;
+  color: #f5222d;
+}
+
+.delete-btn:hover {
+  background: #ffa39e;
+}
+
+.duplicate-btn {
+  background: #e6f7ff;
+  color: #1890ff;
+}
+
+.duplicate-btn:hover {
+  background: #bae7ff;
+}
+
+/* 迷你地图样式 */
+.vue-flow__minimap {
+  background-color: #f5f5f5;
+  border: 1px solid #eee;
+}
+
+/* 背景样式 */
+.vue-flow__background {
+  background-color: #fafafa;
+}
+
+/* 控制面板样式 */
+.vue-flow__controls {
+  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
+}
+
+.vue-flow__controls-button {
+  background: white;
+  border: 1px solid #eee;
+  color: #666;
+}
+
+.vue-flow__controls-button:hover {
+  background: #f5f5f5;
+}