Skip to content

Commit

Permalink
Merge pull request #610 from ota-hiroko/ota-kamonohashi-#607
Browse files Browse the repository at this point in the history
学習のコピー実行時にもデータセットのデータパス一覧を表示するように修正
  • Loading branch information
Reiw98 authored Mar 23, 2022
2 parents 5edaba7 + d841e4f commit dc5840e
Show file tree
Hide file tree
Showing 4 changed files with 109 additions and 48 deletions.
60 changes: 60 additions & 0 deletions web-pages/src/components/KqiPathInfo.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,60 @@
<template>
<span v-if="Object.keys(dataSet).length !== 0">
<el-row style="margin-bottom:5px; padding-left:15px; font-size:0.8em;">
参考:選択したデータセット【{{ dataSet.name }}】のデータパス、データ名一覧
</el-row>
<el-row class="data-list">
<el-col
v-if="dataSet.flatEntries == null || dataSet.flatEntries.length == 0"
:span="24"
>
<ul v-for="(datalist, index) in dataSet.entries" :key="index">
<li style="padding-top:5px; list-style-type:none">{{ index }}:</li>
<li
v-for="data in datalist"
:key="data.id"
style="padding-top:5px; padding-left:15px; list-style-type:none"
>
/kqi/input/{{ index }}/{{ data.id }} 【{{ data.name }}】
</li>
</ul>
</el-col>
<el-col v-else :span="24">
<ul>
<li
v-for="data in dataSet.flatEntries"
:key="data.id"
style="padding-top:5px; list-style-type:none"
>
/kqi/input/{{ data.id }} 【{{ data.name }}】
</li>
</ul>
</el-col>
</el-row>
</span>
</template>

<script>
export default {
name: 'PathInfo',
props: {
dataSet: {
type: Object,
default: () => {},
},
},
}
</script>

<style lang="scss" scoped>
.data-list {
overflow: auto;
height: 120px;
padding: 3px 15px 8px 15px;
border: 1px solid #e4e7ed;
border-radius: 5px;
background-color: #f5f7fa;
color: #999;
margin-left: 10px;
}
</style>
16 changes: 16 additions & 0 deletions web-pages/src/views/inference/Create.vue
Original file line number Diff line number Diff line change
Expand Up @@ -27,6 +27,7 @@
<kqi-data-set-selector
v-model="form.dataSetId"
:data-sets="dataSets"
@input="selectDataset"
/>
<el-form-item label="データセット作成方式">
<el-switch
Expand All @@ -44,6 +45,7 @@
:autosize="{ minRows: 10 }"
/>
</el-form-item>
<kqi-path-info :data-set="dataSetDetail" />
<kqi-container-selector
v-model="form.containerImage"
:registries="registries"
Expand Down Expand Up @@ -133,6 +135,7 @@
<kqi-data-set-selector
v-model="form.dataSetId"
:data-sets="dataSets"
@input="selectDataset"
/>
<el-form-item label="データセット作成方式">
<el-switch
Expand Down Expand Up @@ -183,6 +186,7 @@
:autosize="{ minRows: 10 }"
/>
</el-form-item>
<kqi-path-info :data-set="dataSetDetail" />
</el-col>
</el-form>

Expand Down Expand Up @@ -270,6 +274,7 @@ import KqiInferenceHistorySelector from '@/components/selector/KqiInferenceHisto
import KqiContainerSelector from '@/components/selector/KqiContainerSelector'
import KqiGitSelector from '@/components/selector/KqiGitSelector'
import KqiResourceSelector from '@/components/selector/KqiResourceSelector'
import KqiPathInfo from '@/components/KqiPathInfo'
import KqiEnvironmentVariables from '@/components/KqiEnvironmentVariables'
import KqiPartitionSelector from '@/components/selector/KqiPartitionSelector'
import validator from '@/util/validator'
Expand All @@ -292,6 +297,7 @@ export default {
KqiContainerSelector,
KqiGitSelector,
KqiResourceSelector,
KqiPathInfo,
KqiEnvironmentVariables,
KqiPartitionSelector,
},
Expand Down Expand Up @@ -360,6 +366,7 @@ export default {
inferenceHistories: ['inference/historiesToMount'],
trainingDetail: ['training/detail'],
dataSets: ['dataSet/dataSets'],
dataSetDetail: ['dataSet/detail'],
registries: ['registrySelector/registries'],
defaultRegistryId: ['registrySelector/defaultRegistryId'],
images: ['registrySelector/images'],
Expand Down Expand Up @@ -393,6 +400,8 @@ export default {
await this['cluster/fetchPartitions']()
await this['cluster/fetchQuota']()
await this['dataSet/fetchDataSets']()
// データセット詳細を初期化
await this['dataSet/fetchDetail'](null)
// レジストリ一覧を取得し、デフォルトレジストリを設定
await this['registrySelector/fetchRegistries']()
Expand Down Expand Up @@ -468,6 +477,8 @@ export default {
// 下記は学習からの遷移/コピー実行に関わらずコピー
this.form.dataSetId = String(detail.dataSet.id)
await this['dataSet/fetchDetail'](String(detail.dataSet.id))
// レジストリの設定
this.form.containerImage.registry = {
id: detail.containerImage.registryId,
Expand Down Expand Up @@ -515,6 +526,7 @@ export default {
'cluster/fetchPartitions',
'cluster/fetchQuota',
'dataSet/fetchDataSets',
'dataSet/fetchDetail',
'registrySelector/fetchRegistries',
'registrySelector/fetchImages',
'registrySelector/fetchTags',
Expand All @@ -524,6 +536,10 @@ export default {
'gitSelector/fetchCommits',
'gitSelector/fetchCommitDetail',
]),
async selectDataset() {
//データセットを選択後、データセット詳細を取得する
await this['dataSet/fetchDetail'](this.form.dataSetId)
},
async runInference() {
let form = this.$refs.runForm
if (this.active !== 0) {
Expand Down
17 changes: 17 additions & 0 deletions web-pages/src/views/notebook/Create.vue
Original file line number Diff line number Diff line change
Expand Up @@ -46,6 +46,7 @@
<kqi-data-set-selector
v-model="form.dataSetId"
:data-sets="dataSets"
@input="selectDataset"
/>
<el-form-item
v-show="form.dataSetId"
Expand All @@ -65,6 +66,7 @@
:autosize="{ minRows: 2 }"
/>
</el-form-item>
<kqi-path-info :data-set="dataSetDetail" />
<kqi-container-selector
v-model="form.containerImage"
:registries="registries"
Expand Down Expand Up @@ -162,6 +164,7 @@
<kqi-data-set-selector
v-model="form.dataSetId"
:data-sets="dataSets"
@input="selectDataset"
/>
<el-form-item
v-show="form.dataSetId"
Expand All @@ -181,6 +184,7 @@
:autosize="{ minRows: 2 }"
/>
</el-form-item>
<kqi-path-info :data-set="dataSetDetail" />
<kqi-container-selector
v-model="form.containerImage"
:registries="registries"
Expand Down Expand Up @@ -344,6 +348,7 @@
<kqi-data-set-selector
v-model="form.dataSetId"
:data-sets="dataSets"
@input="selectDataset"
/>
<el-form-item
v-show="form.dataSetId"
Expand All @@ -369,6 +374,7 @@
:autosize="{ minRows: 2 }"
/>
</el-form-item>
<kqi-path-info :data-set="dataSetDetail" />
<kqi-environment-variables v-model="form.variables" />
<kqi-partition-selector
v-model="form.partition"
Expand Down Expand Up @@ -430,6 +436,7 @@ import KqiInferenceHistorySelector from '@/components/selector/KqiInferenceHisto
import KqiContainerSelector from '@/components/selector/KqiContainerSelector'
import KqiGitSelector from '@/components/selector/KqiGitSelector'
import KqiResourceSelector from '@/components/selector/KqiResourceSelector'
import KqiPathInfo from '@/components/KqiPathInfo'
import KqiEnvironmentVariables from '@/components/KqiEnvironmentVariables'
import KqiPartitionSelector from '@/components/selector/KqiPartitionSelector'
import registrySelectorUtil from '@/util/registrySelectorUtil'
Expand All @@ -445,6 +452,7 @@ export default {
KqiResourceSelector,
KqiContainerSelector,
KqiGitSelector,
KqiPathInfo,
KqiEnvironmentVariables,
KqiPartitionSelector,
},
Expand Down Expand Up @@ -514,6 +522,7 @@ export default {
trainingHistories: ['training/historiesToMount'],
inferenceHistories: ['inference/historiesToMount'],
dataSets: ['dataSet/dataSets'],
dataSetDetail: ['dataSet/detail'],
registries: ['registrySelector/registries'],
defaultRegistryId: ['registrySelector/defaultRegistryId'],
images: ['registrySelector/images'],
Expand Down Expand Up @@ -550,6 +559,8 @@ export default {
await this['cluster/fetchPartitions']()
await this['cluster/fetchQuota']()
await this['dataSet/fetchDataSets']()
// データセット詳細を初期化
await this['dataSet/fetchDetail'](null)
// レジストリ一覧を取得し、デフォルトレジストリを設定
await this['registrySelector/fetchRegistries']()
Expand Down Expand Up @@ -621,6 +632,7 @@ export default {
if (this.detail.dataSet) {
this.form.dataSetId = String(this.detail.dataSet.id)
await this['dataSet/fetchDetail'](String(this.detail.dataSet.id))
}
// レジストリの設定
Expand Down Expand Up @@ -676,6 +688,7 @@ export default {
'cluster/fetchPartitions',
'cluster/fetchQuota',
'dataSet/fetchDataSets',
'dataSet/fetchDetail',
'registrySelector/fetchRegistries',
'registrySelector/fetchImages',
'registrySelector/fetchTags',
Expand All @@ -685,6 +698,10 @@ export default {
'gitSelector/fetchCommits',
'gitSelector/fetchCommitDetail',
]),
async selectDataset() {
//データセットを選択後、データセット詳細を取得する
await this['dataSet/fetchDetail'](this.form.dataSetId)
},
async runNotebook() {
if (this.isReRunCreation) {
// 再実行
Expand Down
64 changes: 16 additions & 48 deletions web-pages/src/views/training/Create.vue
Original file line number Diff line number Diff line change
Expand Up @@ -22,6 +22,7 @@
<kqi-data-set-selector
v-model="form.dataSetId"
:data-sets="dataSets"
@input="selectDataset"
/>
<el-form-item label="データセット作成方式">
<el-switch
Expand All @@ -32,13 +33,20 @@
/>
</el-form-item>

<el-form-item label="実行コマンド" prop="entryPoint">
<el-form-item
label="実行コマンド"
prop="entryPoint"
style="margin-bottom:5px"
>
<el-input
v-model="form.entryPoint"
type="textarea"
:autosize="{ minRows: 10 }"
/>
</el-form-item>

<kqi-path-info :data-set="dataSetDetail" />

<kqi-container-selector
v-model="form.containerImage"
:registries="registries"
Expand Down Expand Up @@ -181,43 +189,8 @@
:autosize="{ minRows: 10 }"
/>
</el-form-item>
<el-row
style="margin-bottom:5px;padding-left:15px;font-size:0.8em;"
>
参考:選択したデータセット【{{
dataSetDetail.name
}}】のデータパス一覧
</el-row>
<el-row class="data-list">
<el-col v-if="dataSetDetail.flatEntries.length == 0" :span="24">
<ul
v-for="(datalist, index) in dataSetDetail.entries"
:key="index"
>
<li style="padding-top:5px;list-style-type: none">
{{ index }}:
</li>
<li
v-for="data in datalist"
:key="data.id"
style="padding-top:5px;padding-left:15px; list-style-type: none"
>
/kqi/input/{{ index }}/{{ data.id }}
</li>
</ul>
</el-col>
<el-col v-else :span="24">
<ul>
<li
v-for="data in dataSetDetail.flatEntries"
:key="data.id"
style="padding-top:5px; list-style-type: none"
>
/kqi/input/{{ data.id }}
</li>
</ul>
</el-col>
</el-row>

<kqi-path-info :data-set="dataSetDetail" />
</el-col>
</el-form>

Expand Down Expand Up @@ -311,6 +284,7 @@ import KqiTrainingHistorySelector from '@/components/selector/KqiTrainingHistory
import KqiContainerSelector from '@/components/selector/KqiContainerSelector'
import KqiGitSelector from '@/components/selector/KqiGitSelector'
import KqiResourceSelector from '@/components/selector/KqiResourceSelector'
import KqiPathInfo from '@/components/KqiPathInfo'
import KqiEnvironmentVariables from '@/components/KqiEnvironmentVariables'
import KqiExposePorts from '@/components/KqiExposePorts'
import KqiTagEditor from '@/components/KqiTagEditor'
Expand All @@ -334,6 +308,7 @@ export default {
KqiContainerSelector,
KqiGitSelector,
KqiResourceSelector,
KqiPathInfo,
KqiEnvironmentVariables,
KqiExposePorts,
KqiTagEditor,
Expand Down Expand Up @@ -438,6 +413,8 @@ export default {
await this['cluster/fetchQuota']()
await this['dataSet/fetchDataSets']()
await this['training/fetchTenantTags']()
// データセット詳細を初期化
await this['dataSet/fetchDetail'](null)
// レジストリ一覧を取得し、デフォルトレジストリを設定
await this['registrySelector/fetchRegistries']()
Expand All @@ -456,6 +433,7 @@ export default {
// コピー実行時はコピー元情報を各項目を設定
if (this.isCopyCreation) {
await this['training/fetchDetail'](this.originId)
await this['dataSet/fetchDetail'](String(this.detail.dataSet.id))
this.form.name = this.detail.name
this.form.dataSetId = String(this.detail.dataSet.id)
Expand Down Expand Up @@ -777,14 +755,4 @@ export default {
.element {
padding-top: 40px;
}
.data-list {
overflow: auto;
height: 120px;
padding: 3px 15px 8px 15px;
border: 1px solid #e4e7ed;
border-radius: 5px;
background-color: #f5f7fa;
color: #999;
margin-left: 10px;
}
</style>

0 comments on commit dc5840e

Please sign in to comment.