FlowChart削除メニュー追加

2023-09-08 21:17:20 +09:00
parent ff03490209
commit 8e095b51e3
2 changed files with 20 additions and 4 deletions
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -1,5 +1,5 @@
 <!DOCTYPE html>
-<html>
+<html lang="ja-jp">
  <head>
    <title><%= productName %></title>

--- a/frontend/src/components/main/NodeItem.vue
+++ b/frontend/src/components/main/NodeItem.vue
@@ -2,9 +2,25 @@
  <div class="row justify-center" :style="{ marginLeft: node.inputPoint !== '' ? '240px' : '' }" @click="onNodeClick">
    <div class="row">
      <q-card class="action-node" :class="nodeStyle" :square="false" >
-        <q-card-section>
-          <div class="text-h6">{{ node.title }}</div>
+        <q-toolbar class="col" >
          <div class="text-subtitle2">{{ node.subTitle }}</div>
+          <q-space></q-space>
+          <q-btn flat round dense icon="more_horiz" >
+            <q-menu  auto-close anchor="top right">
+                <q-list>
+                  <q-item clickable v-if="!isRoot">
+                    <q-item-section>削除する</q-item-section>
+                  </q-item>
+                  <q-item clickable>
+                    <q-item-section>以下すべて削除する</q-item-section>
+                  </q-item>
+                </q-list>
+              </q-menu>
+          </q-btn>
+        </q-toolbar>
+        <q-separator />
+        <q-card-section>
+          <div class="text-h7">{{ node.title }}</div>
        </q-card-section>
        <template v-if="hasBranch">
          <q-separator />
@@ -107,7 +123,7 @@ export default defineComponent({
 </script>
 <style lang="scss">
 .action-node {
-  min-width: 250px !important;
+  min-width: 300px !important;
 }

 .line {