|
|
@@ -2,39 +2,58 @@
|
|
|
<html>
|
|
|
<head>
|
|
|
<meta charset="UTF-8">
|
|
|
- <title>用户信息</title>
|
|
|
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@3.3.7/dist/css/bootstrap.min.css">
|
|
|
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="ie=edge">
|
|
|
+ <title>生成命令页面</title>
|
|
|
+ <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.2/css/bootstrap.min.css">
|
|
|
+ <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.0/theme-chalk/index.css">
|
|
|
</head>
|
|
|
<body>
|
|
|
-<div class="container">
|
|
|
- <h1>用户信息</h1>
|
|
|
- <form id="userForm">
|
|
|
- <div class="form-group">
|
|
|
- <label for="name">姓名:</label>
|
|
|
- <input type="text" class="form-control" id="name" placeholder="请输入姓名">
|
|
|
- </div>
|
|
|
- <div class="form-group">
|
|
|
- <label for="age">年龄:</label>
|
|
|
- <input type="number" class="form-control" id="age" placeholder="请输入年龄">
|
|
|
- </div>
|
|
|
- <div class="form-group">
|
|
|
- <label for="city">城市:</label>
|
|
|
- <input type="text" class="form-control" id="city" placeholder="请输入城市">
|
|
|
- </div>
|
|
|
- <button type="submit" class="btn btn-primary">发送</button>
|
|
|
- </form>
|
|
|
+<div id="app" class="container">
|
|
|
+ <h1>生成命令页面</h1>
|
|
|
+ <el-form ref="form" :model="formData" label-width="100px">
|
|
|
+ <el-form-item label="Tag名称">
|
|
|
+ <el-input v-model="formData.tagname"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="备注">
|
|
|
+ <el-input v-model="formData.remark"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="选择仓库">
|
|
|
+ <el-checkbox-group v-model="formData.selectedRepos">
|
|
|
+ <el-checkbox v-for="repo in repos" :label="repo.value" :key="repo.value">{{repo.name}}</el-checkbox>
|
|
|
+ </el-checkbox-group>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="generateCommand">生成命令</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item>
|
|
|
+ <label for="command">生成的命令:</label>
|
|
|
+ <pre id="command">{{ command }}</pre>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
</div>
|
|
|
-<script src="https://cdn.jsdelivr.net/npm/vue@2.6.12/dist/vue.min.js"></script>
|
|
|
+
|
|
|
+<script src="https://cdn.bootcdn.net/ajax/libs/vue/2.5.16/vue.min.js"></script>
|
|
|
+<script src="https://cdn.bootcdn.net/ajax/libs/lodash.js/4.17.21/lodash.min.js"></script>
|
|
|
+<script src="https://cdn.bootcdn.net/ajax/libs/element-ui/2.15.0/index.js"></script>
|
|
|
<script>
|
|
|
- const app = new Vue({
|
|
|
- el: '#userForm',
|
|
|
+ new Vue({
|
|
|
+ el: '#app',
|
|
|
+ data: {
|
|
|
+ formData: {
|
|
|
+ tagname: '',
|
|
|
+ remark: '',
|
|
|
+ selectedRepos: []
|
|
|
+ },
|
|
|
+ repos: [
|
|
|
+ { name: '模型manager', value: '/path/to/repo1' },
|
|
|
+ { name: '模型worker', value: '/path/to/repo2' }
|
|
|
+ ],
|
|
|
+ command: ''
|
|
|
+ },
|
|
|
methods: {
|
|
|
- submitForm() {
|
|
|
- const name = document.getElementById('name').value;
|
|
|
- const age = document.getElementById('age').value;
|
|
|
- const city = document.getElementById('city').value;
|
|
|
- // 将用户输入的数据发送到后台
|
|
|
- // 发送方式可以使用fetch或axios等库来实现
|
|
|
+ generateCommand() {
|
|
|
+ this.command = `tag_service.sh ${this.formData.selectedRepos.join(",")} ${this.formData.tagname} "${this.formData.remark}"`;
|
|
|
}
|
|
|
}
|
|
|
});
|
tianyun