创建应用

src/views/app/AppHomeView.vue

@@ -21,10 +21,16 @@ const appCreate = () => {
 }
 const name = ref(undefined)
 const showDialog = ref(false)
+const detail = ref(undefined)
+const showDetailsDialog = ref(false)
 const addApp = () => {
   name.value = undefined
   showDialog.value = true
 }
+const showApp = (scope) => {
+  detail.value = undefined
+  // showDetailsDialog.value = true
+}
 init()
 </script>
 
@@ -37,6 +43,12 @@ init()
       <el-table-column type="index" width="150" label="序号" />
       <el-table-column prop="appName" label="应用名称" />
       <el-table-column prop="createTime" label="创建时间" />
+      <el-table-column fixed="right" label="操作" min-width="120">
+        <template #default="scope">
+          <el-button link type="primary" size="small" @click="showApp(scope.row)"> 详情 </el-button>
+          <el-button link type="primary" size="small">删除</el-button>
+        </template>
+      </el-table-column>
     </el-table>
   </el-card>
   <el-dialog v-model="showDialog" title="新建应用" width="500">
@@ -55,6 +67,21 @@ init()
       </div>
     </template>
   </el-dialog>
+  <el-dialog v-model="showDetailsDialog" title="应用信息" width="500">
+    <el-input
+      class="text item"
+      v-model="name"
+      style="width: 440px"
+      placeholder="请输入应用名称"
+      :prefix-icon="PriceTag"
+      :clearable="true"
+    />
+    <template #footer>
+      <div class="dialog-footer">
+        <el-button type="primary" @click="showDetailsDialog = false"> 关闭</el-button>
+      </div>
+    </template>
+  </el-dialog>
 </template>
 
 <style scoped></style>