| @@ -0,0 +1,98 @@ | |||
| <style> | |||
| .active{ | |||
| color: #0087f5!important; | |||
| border: 1px solid #0087f5!important; | |||
| /* margin: -1px!important; */ | |||
| background: #fff!important; | |||
| } | |||
| </style> | |||
| {{template "base/head" .}} | |||
| <div class="repository"> | |||
| {{template "repo/header" .}} | |||
| <div class="ui container"> | |||
| <input type="hidden" id="postPath" value="{{.Link}}"> | |||
| <div style="width: 80%;margin: auto;"> | |||
| <h4 class="ui top attached header"> | |||
| 上传数据集文件 | |||
| </h4> | |||
| <div class="ui attached segment" style="padding: 2em 3em;"> | |||
| <div class="ui form" id="dataset-base"> | |||
| <el-form label-width="140px"> | |||
| {{.CsrfTokenHtml}} | |||
| <el-form-item label="存储位置:" prop="title"> | |||
| <el-button :class="{active:type==0}" size="small" style="margin: 0;border-radius: 0.28571429rem 0 0 0.28571429rem;" @click="uploadGpu">CPU/GPU</el-button> | |||
| <el-button :class="{active:type==1}" size="small" style="margin: 0 0 0 -4px;border-radius: 0 0.28571429rem 0.28571429rem 0;" @click="uploadNpu">NPU</el-button> | |||
| <!-- <span>请输入字母、数字、_和-,最长64个字符,且不能以中划线(-)结尾。</span> --> | |||
| </el-form-item> | |||
| <el-form-item label="文件描述:" prop="description"> | |||
| <el-input type="textarea" :rows="3" maxlength="255" v-model="desc"></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="数据上传:" prop="category"> | |||
| <minio-uploader :uploadtype="type" :desc="desc"></minio-uploader> | |||
| <!-- <obs-uploader v-if="type==1"></obs-uploader> --> | |||
| </el-form-item> | |||
| <!-- <el-form-item label="研究方向/应用领域" prop="task"> | |||
| <el-select v-model="ruleForm.task" placeholder="请选择活动区域" style="width: 60%;"> | |||
| <el-option label="区域一" value="shanghai"></el-option> | |||
| <el-option label="区域二" value="beijing"></el-option> | |||
| </el-select> | |||
| </el-form-item> --> | |||
| <!-- <el-form-item> | |||
| <el-button style="background-color: #21ba45;" type="success" @click="createDataset('ruleForm')">确定</el-button> | |||
| <el-button type="info" @click="cancelDataset">取消</el-button> | |||
| </el-form-item> --> | |||
| <div style='display:none;' | |||
| id="minioUploader-params" | |||
| data-uuid="{{.uuid}}" | |||
| data-add-url="{{.Repo.OwnerName}}/attachments/add" | |||
| data-accepts="{{.AttachmentAllowedTypes}}" | |||
| data-remove-url="{{AppSubUrl}}/attachments/delete" | |||
| data-csrf="{{.CsrfToken}}" | |||
| dataset-id={{.dataset.ID}} | |||
| data-max-file="100" | |||
| data-dataset-id="{{.dataset.ID}}" | |||
| data-max-size="{{.AttachmentMaxSize}}" | |||
| data-default-message="{{.i18n.Tr "dropzone.default_message"}}" | |||
| data-invalid-input-type="{{.i18n.Tr "dropzone.invalid_input_type"}}" | |||
| data-file-too-big="{{.i18n.Tr "dropzone.file_too_big"}}" | |||
| data-remove-file="{{.i18n.Tr "dropzone.remove_file"}}" | |||
| data-file-status='{{.i18n.Tr "dropzone.file_status"}}' | |||
| data-file-init-status='{{.i18n.Tr "dropzone.file_init_status"}}' | |||
| data-waitting-uploading='{{.i18n.Tr "dropzone.waitting_uploading"}}' | |||
| data-md5-computing='{{.i18n.Tr "dropzone.md5_computing"}}' | |||
| data-obs-connecting='{{.i18n.Tr "dropzone.obs-connecting"}}' | |||
| data-loading-file='{{.i18n.Tr "dropzone.loading_file"}}' | |||
| data-upload-complete='{{.i18n.Tr "dropzone.upload_complete"}}' | |||
| data-uploading='{{.i18n.Tr "dropzone.uploading"}}' | |||
| data-failed='{{.i18n.Tr "dropzone.failed"}}' | |||
| data-repopath='{{AppSubUrl}}/{{.Repo.OwnerName}}/{{.Repo.Name}}/datasets' | |||
| > | |||
| </div> | |||
| <div id="datasetId" datasetId="{{.datasetId}}"></div> | |||
| </el-form> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div style="width: 80%;margin: auto;padding-top: 2em;"> | |||
| <!-- <p>说明:<br> | |||
| - 只有<span class="text blue">zip格式</span>zip格式的数据集才能发起云脑任务;<br> | |||
| - 云脑1提供 <span class="text blue">CPU / GPU</span> 资源,云脑2提供 <span class="text blue">Ascend NPU</span> 资源;调试使用的数据集也需要上传到对应的环境。 | |||
| </p> --> | |||
| <p style="color: 505559;">说明:</p> | |||
| <p style="line-height: 1.5;color: #101010;">只有<span class="text red">zip格式</span>的数据集才能发起云脑任务;</br> | |||
| 云脑1提供CPU / GPU资源,云脑2提供Ascend NPU资源;调试使用的数据集也需要上传到对应的环境;</p> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| {{template "base/footer" .}} | |||
| <script> | |||
| console.log({{.datasetId}}) | |||
| console.log({{.Repo}}) | |||
| </script> | |||
| @@ -0,0 +1,65 @@ | |||
| <style> | |||
| #dataset-base>.field>label{ | |||
| width:120px !important; | |||
| text-align:right !important; | |||
| } | |||
| </style> | |||
| <div id="mask"> | |||
| <div id="loadingPage"> | |||
| <div class="rect1"></div> | |||
| <div class="rect2"></div> | |||
| <div class="rect3"></div> | |||
| <div class="rect4"></div> | |||
| <div class="rect5"></div> | |||
| </div> | |||
| </div> | |||
| {{template "base/head" .}} | |||
| <div class="repository"> | |||
| {{template "repo/header" .}} | |||
| <div class="ui container"> | |||
| <input type="hidden" id="postPath" value="{{.Link}}"> | |||
| <div style="width: 80%;margin: auto;"> | |||
| <h4 class="ui top attached header"> | |||
| {{.i18n.Tr "repo.modelarts.train_job.new_infer"}} | |||
| </h4> | |||
| <div class="ui attached segment" style="padding: 2em 3em;"> | |||
| <div class="ui form" id="dataset-base"> | |||
| <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="140px"> | |||
| {{.CsrfTokenHtml}} | |||
| <el-form-item label="数据集名称" prop="title"> | |||
| <el-input v-model="ruleForm.title"></el-input> | |||
| <span style="font-size: 12px;color: #888;line-height: 1;margin-top: 0.5em;display: inline-block;">请输入字母、数字、_和-,最长64个字符,且不能以中划线(-)结尾。</span> | |||
| <!-- <span>请输入字母、数字、_和-,最长64个字符,且不能以中划线(-)结尾。</span> --> | |||
| </el-form-item> | |||
| <el-form-item label="数据集描述" prop="description"> | |||
| <el-input type="textarea" :rows="3" maxlength="255" v-model="ruleForm.description"></el-input> | |||
| </el-form-item> | |||
| <el-form-item label="分类" prop="category"> | |||
| <el-select v-model="ruleForm.category" placeholder="请选择活动区域" style="width: 60%;"> | |||
| <el-option label="区域一" value="shanghai"></el-option> | |||
| <el-option label="区域二" value="beijing"></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="研究方向/应用领域" prop="task"> | |||
| <el-select v-model="ruleForm.task" placeholder="请选择活动区域" style="width: 60%;"> | |||
| <el-option label="区域一" value="shanghai"></el-option> | |||
| <el-option label="区域二" value="beijing"></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item label="授权许可" prop="license"> | |||
| <el-select v-model="ruleForm.license" placeholder="请选择活动区域" style="width: 60%;"> | |||
| <el-option label="区域一" value="shanghai"></el-option> | |||
| <el-option label="区域二" value="beijing"></el-option> | |||
| </el-select> | |||
| </el-form-item> | |||
| <el-form-item> | |||
| <el-button style="background-color: #21ba45;" type="success" @click="createDataset('ruleForm')">确定</el-button> | |||
| <el-button type="info" @click="cancelDataset">取消</el-button> | |||
| </el-form-item> | |||
| </el-form> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| </div onbeforeunload="return false"> | |||
| {{template "base/footer" .}} | |||
| @@ -6,145 +6,142 @@ | |||
| margin: -1px; | |||
| background: #FFF !important; | |||
| } | |||
| .wrapper { | |||
| display: flex; | |||
| overflow: hidden; | |||
| padding: 0 1rem; | |||
| } | |||
| .exp{ | |||
| display: none; | |||
| } | |||
| .exp:checked+.text{ | |||
| max-height: none; | |||
| } | |||
| .exp:checked+.text::after{ | |||
| visibility: hidden; | |||
| } | |||
| .exp:checked+.text .btn::before{ | |||
| visibility: hidden; | |||
| } | |||
| .exp:checked+.text .btn::after{ | |||
| content:'收起' | |||
| } | |||
| .wrapper>.text { | |||
| font-family: SourceHanSansSC-regular; | |||
| font-size: 14px; | |||
| color: #101010; | |||
| overflow: hidden; | |||
| text-overflow: ellipsis; | |||
| text-align: justify; | |||
| position: relative; | |||
| line-height: 1.5; | |||
| max-height: 3em; | |||
| transition: .3s max-height; | |||
| } | |||
| .wrapper>.text::before { | |||
| content: ''; | |||
| height: calc(100% - 20px); | |||
| float: right; | |||
| } | |||
| .wrapper>.text::after { | |||
| content: ''; | |||
| width: 999vw; | |||
| height: 999vw; | |||
| position: absolute; | |||
| box-shadow: inset calc(100px - 999vw) calc(30px - 999vw) 0 0 #fff; | |||
| margin-left: -100px; | |||
| } | |||
| .btn{ | |||
| position: relative; | |||
| float: right; | |||
| clear: both; | |||
| margin-left: 20px; | |||
| font-size: 14px; | |||
| padding: 0 8px; | |||
| background: #3F51B5; | |||
| line-height: 20px; | |||
| border-radius: 4px; | |||
| color: #fff; | |||
| cursor: pointer; | |||
| /* margin-top: -30px; */ | |||
| } | |||
| .btn::after{ | |||
| content:'展开' | |||
| } | |||
| .btn::before{ | |||
| content: '...'; | |||
| position: absolute; | |||
| left: -5px; | |||
| color: #333; | |||
| transform: translateX(-100%) | |||
| } | |||
| </style> | |||
| <div class="repository release dataset-list view"> | |||
| <div class="repository"> | |||
| {{template "repo/header" .}} | |||
| <script> | |||
| $(document).ready(function() { | |||
| const params = new URLSearchParams(window.location.search); | |||
| if (params.get('type') == 0){ | |||
| $('.contorl_component').attr("id", 'minioUploader') | |||
| }else{ | |||
| $('.contorl_component').attr("id", 'obsUploader') | |||
| } | |||
| }); | |||
| </script> | |||
| <form class="ui container" action="{{.Link}}" method="post"> | |||
| <input name="id" value="{{.dataset.ID}}" type="hidden" /> | |||
| <!-- | |||
| <span class="alert" style="font-size:20px;color:red"> | |||
| <strong>{{.i18n.Tr "dataset.alert"}}</strong> | |||
| </span> | |||
| --> | |||
| <div id="datasetId" datasetId="{{.dataset.ID}}"> | |||
| {{.CsrfTokenHtml}} | |||
| {{template "base/alert" .}} | |||
| <div class="ui stackable grid {{if .Error}}hide{{end}}" id="dataset-content"> | |||
| <div class="row"> | |||
| <div class="column sixteen {{if .Permission.CanWrite $.UnitTypeDatasets}}twelve{{end}} wide"> | |||
| <h2>{{.dataset.Title}}</h2> | |||
| </div> | |||
| {{if .Permission.CanWrite $.UnitTypeDatasets}} | |||
| <div class="column four wide right aligned"> | |||
| <a class="ui green button" href="javascript:void(0)" id="dataset-edit"> | |||
| {{.i18n.Tr "dataset.edit"}} | |||
| </a> | |||
| </div> | |||
| {{end}} | |||
| </div> | |||
| <div class="row"> | |||
| <div class="column sixteen wide"> | |||
| {{if .dataset.Description }} | |||
| <span class="no-description text-italic">{{.dataset.Description}}</span> | |||
| {{else}} | |||
| <span class="no-description text-italic">{{.Repository.DescriptionHTML}}</span> | |||
| {{end}} | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div class="ui grid form segment success {{if not .Error}}hide{{end}}" id="dataset-content-edit"> | |||
| <label class="d-block">{{.i18n.Tr "dataset.title"}}</label> | |||
| <div class="sixteen wide column"> | |||
| <input name="title" placeholder='{{.i18n.Tr "dataset.title"}}' value="{{.dataset.Title}}" autofocus required maxlength="255"> | |||
| </div> | |||
| <label class="d-block">{{.i18n.Tr "dataset.description"}}</label> | |||
| <div class="sixteen wide column"> | |||
| <textarea name="description" rows="3">{{.dataset.Description}}</textarea> | |||
| </div> | |||
| <input name="type" value="{{.Type}}" type="hidden" /> | |||
| <div class="sixteen wide column"> | |||
| <a class="ui button" id="cancel">{{.i18n.Tr "cancel"}}</a> | |||
| <button class="ui green button" id="submit">{{.i18n.Tr "dataset.update_dataset"}}</button> | |||
| </div> | |||
| </div> | |||
| <div class="ui blue mini menu selectcloudbrain"> | |||
| <a class="{{if eq .Type 0}}active {{end}}item" href="{{.RepoLink}}/datasets?type=0">{{svg "octicon-server" 16}} CPU / GPU</a> | |||
| <a class="{{if eq .Type 1}}active {{end}}item" href="{{.RepoLink}}/datasets?type=1">{{svg "octicon-server" 16}} Ascend NPU</a> | |||
| </div> | |||
| <div class="ui stackable grid"> | |||
| <div class="twelve wide column"> | |||
| <div class="ui sixteen wide column"> | |||
| <div class="ui two column stackable grid"> | |||
| <div class="column"> | |||
| <strong>{{if eq .Type 0}}{{.i18n.Tr "repo.cloudbrain1"}}{{else}}{{.i18n.Tr "repo.cloudbrain2"}}{{end}}-{{.i18n.Tr "datasets"}}</strong> | |||
| </div> | |||
| <div class="column right aligned" style="z-index:1"> | |||
| <div class="ui right dropdown type jump item"> | |||
| <span class="text"> | |||
| {{.i18n.Tr "repo.issues.filter_sort"}}<i class="dropdown icon"></i> | |||
| </span> | |||
| <div class="menu"> | |||
| <a class="item" href="{{$.Link}}?sort=newest&q={{$.Keyword}}&tab={{$.TabName}}&type={{.Type}}">{{.i18n.Tr "repo.issues.filter_sort.latest"}}</a> | |||
| <a class="item" href="{{$.Link}}?sort=oldest&q={{$.Keyword}}&tab={{$.TabName}}&type={{.Type}}">{{.i18n.Tr "repo.issues.filter_sort.oldest"}}</a> | |||
| {{if .dataset}} | |||
| <div id="dataset-base"> | |||
| <div class="ui container"> | |||
| <div class="ui mobile reversed stackable grid"> | |||
| <div class="row"> | |||
| <div class="column thirteen wide"><h2>{{.dataset.Title}}</h2></div> | |||
| <div class="column three wide right aligned"> | |||
| <span style="display: flex;align-items: center;justify-content: flex-end;height: 36px;"> | |||
| <div style="line-height: 1;margin-right: 4px;margin-bottom: -2px;fill: #FA8C16;"> | |||
| <svg width="1.4em" height="1.4em" viewBox="0 0 32 32" class="heart-stroke"><path d="M4.4 6.54c-1.761 1.643-2.6 3.793-2.36 6.056.24 2.263 1.507 4.521 3.663 6.534a29110.9 29110.9 0 0010.296 9.633l10.297-9.633c2.157-2.013 3.424-4.273 3.664-6.536.24-2.264-.599-4.412-2.36-6.056-1.73-1.613-3.84-2.29-6.097-1.955-1.689.25-3.454 1.078-5.105 2.394l-.4.319-.398-.319c-1.649-1.316-3.414-2.143-5.105-2.394a7.612 7.612 0 00-1.113-.081c-1.838 0-3.541.694-4.983 2.038z"></path></svg> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <span style="line-height: 1;">{{.dataset.NumStars}}</span> | |||
| <a style="margin-left:30px;" href="" class="ui primary basic mini button">修改</a> | |||
| </span> | |||
| </div> | |||
| <div class="column thirteen wide"> | |||
| <span class="ui repo-topic small label topic" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=">{{.dataset.Title}}</span> | |||
| <span class="ui repo-topic small label topic" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=">{{.dataset.Category}}</span> | |||
| <span class="ui repo-topic small label topic" href="{{AppSubUrl}}/explore/repos?q={{.Name}}&topic=">{{.dataset.License}}</span> | |||
| </div> | |||
| </div> | |||
| <div class="dataset list"> | |||
| {{template "repo/datasets/dataset_list" .}} | |||
| </div> | |||
| <div class="dataset ui middle very relaxed page"> | |||
| <div class="column"> | |||
| {{if .Permission.CanWrite $.UnitTypeDatasets}} | |||
| <div style='display:none;' | |||
| id="minioUploader-params" | |||
| data-uuid="{{.uuid}}" | |||
| data-add-url="{{AppSubUrl}}/attachments/add" | |||
| data-accepts="{{.AttachmentAllowedTypes}}" | |||
| data-remove-url="{{AppSubUrl}}/attachments/delete" | |||
| data-csrf="{{.CsrfToken}}" | |||
| dataset-id={{.dataset.ID}} | |||
| data-max-file="100" | |||
| data-dataset-id="{{.dataset.ID}}" | |||
| data-max-size="{{.AttachmentMaxSize}}" | |||
| data-default-message="{{.i18n.Tr "dropzone.default_message"}}" | |||
| data-invalid-input-type="{{.i18n.Tr "dropzone.invalid_input_type"}}" | |||
| data-file-too-big="{{.i18n.Tr "dropzone.file_too_big"}}" | |||
| data-remove-file="{{.i18n.Tr "dropzone.remove_file"}}" | |||
| data-file-status='{{.i18n.Tr "dropzone.file_status"}}' | |||
| data-file-init-status='{{.i18n.Tr "dropzone.file_init_status"}}' | |||
| data-waitting-uploading='{{.i18n.Tr "dropzone.waitting_uploading"}}' | |||
| data-md5-computing='{{.i18n.Tr "dropzone.md5_computing"}}' | |||
| data-obs-connecting='{{.i18n.Tr "dropzone.obs-connecting"}}' | |||
| data-loading-file='{{.i18n.Tr "dropzone.loading_file"}}' | |||
| data-upload-complete='{{.i18n.Tr "dropzone.upload_complete"}}' | |||
| data-uploading='{{.i18n.Tr "dropzone.uploading"}}' | |||
| data-failed='{{.i18n.Tr "dropzone.failed"}}' | |||
| > | |||
| <div class="row" style="padding-top: 0;"> | |||
| <div class=" wrapper"> | |||
| <input id="exp1" class="exp" type="checkbox"> | |||
| <div class="text"> | |||
| <label class="btn" for="exp1"></label> | |||
| 浮动元素是如何定位的 | |||
| 正如我们前面提到的那样,当一个元素浮动之后,它会被移出正常的文档流,然后向左或者向右平移,一直平移直到碰到了所处的容器的边框,或者碰到另外一个浮动的元素。 | |||
| 浮动元素是如何定位的 | |||
| 正如我们前面提到的那样,当一个元素浮动之后,它会被移出正常的文档流,然后向左或者向右平移,一直平移直到碰到了所处的容器的边框,或者碰到另外一个浮动的元素。 | |||
| </div> | |||
| </div> | |||
| <div class="contorl_component"></div> | |||
| {{end}} | |||
| </div> | |||
| <div class="row"> | |||
| <div class="column ten wide"></div> | |||
| <div class="column six wide right aligned"> | |||
| <el-select v-model="datasetType" style="width: 40%;" size="small"> | |||
| <i slot="prefix" style="display: inline-block;color: #101010;" class="el-input__icon ri-archive-drawer-line"></i> | |||
| <el-option label="全部" value="all"></el-option> | |||
| <el-option label="CPU/GPU" value="CPU/GPU"></el-option> | |||
| <el-option label="NPU" value="NPU"></el-option> | |||
| </el-select> | |||
| <el-button icon="el-icon-upload" type="primary" size="small" @click="gotoUpload({{.dataset.ID}})">上传</el-button> | |||
| </div> | |||
| </div> | |||
| </div> | |||
| <div class="four wide column"> | |||
| {{template "repo/datasets/right_side" .}} | |||
| </div> | |||
| </div> | |||
| </form> | |||
| </div> | |||
| <div class="ui small basic delete modal" id="data-dataset-delete-modal"> | |||
| <div class="ui icon header"> | |||
| <i class="trash icon"></i> | |||
| {{.i18n.Tr "dataset.attachment.delete"}} | |||
| </div> | |||
| <div class="content"> | |||
| <p>{{.i18n.Tr "dataset.attachment.delete_desc" | Str2html}}</p> | |||
| </div> | |||
| {{template "base/delete_modal_actions" .}} | |||
| </div> | |||
| {{else}} | |||
| <div class="ui placeholder segment bgtask-none"> | |||
| <div class="ui icon header bgtask-header-pic"></div> | |||
| <div class="bgtask-content-header">还未创建过数据集</div> | |||
| <a class="ui green button" href="{{.RepoLink}}/datasets/create">新建数据集</a> | |||
| <div class="bgtask-content"> | |||
| <div class="bgtask-content-txt">数据集:云脑1提供 CPU / GPU 资源,云脑2提供 Ascend NPU 资源,调试使用的数据集也需要上传到对应的环境;</div> | |||
| <div class="bgtask-content-txt">使用说明:可以参考启智AI协作平台<a href="https://git.openi.org.cn/zeizei/OpenI_Learning">小白训练营课程。</a></div> | |||
| </div> | |||
| </div> | |||
| {{end}} | |||
| </div> | |||
| {{template "base/footer" .}} | |||
| <script> | |||
| console.log({{.dataset}}) | |||
| console.log({{.RepoLink}}) | |||
| </script> | |||
| @@ -8,9 +8,11 @@ | |||
| {{ file_status_text }} | |||
| <strong class="success text red">{{ status }}</strong> | |||
| </p> | |||
| <p>说明:<br> | |||
| <el-button style="background-color: #21ba45;" type="success" :disabled="btnFlag" @click="onFileAdded">上传</el-button> | |||
| <el-button type="info" @click="cancelDataset">取消</el-button> | |||
| <!-- <p>说明:<br> | |||
| - 只有zip格式的数据集才能发起云脑任务;<br> | |||
| - 云脑1提供 <span class="text blue">CPU / GPU</span> 资源,云脑2提供 <span class="text blue">Ascend NPU</span> 资源;调试使用的数据集也需要上传到对应的环境。</p> | |||
| - 云脑1提供 <span class="text blue">CPU / GPU</span> 资源,云脑2提供 <span class="text blue">Ascend NPU</span> 资源;调试使用的数据集也需要上传到对应的环境。</p> --> | |||
| </div> | |||
| </template> | |||
| @@ -24,9 +26,19 @@ import qs from 'qs'; | |||
| import createDropzone from '../features/dropzone.js'; | |||
| const {_AppSubUrl, _StaticUrlPrefix, csrf} = window.config; | |||
| const CloudBrainType = 0; | |||
| // const uploadtype = 0; | |||
| export default { | |||
| props:{ | |||
| uploadtype:{ | |||
| type:Number, | |||
| required:true | |||
| }, | |||
| desc:{ | |||
| type:String, | |||
| default:'' | |||
| } | |||
| }, | |||
| data() { | |||
| return { | |||
| dropzoneUploader: null, | |||
| @@ -36,7 +48,10 @@ export default { | |||
| progress: 0, | |||
| status: '', | |||
| dropzoneParams: {}, | |||
| file_status_text: '' | |||
| file_status_text: '', | |||
| file:{}, | |||
| repoPath:'', | |||
| btnFlag:false | |||
| }; | |||
| }, | |||
| @@ -44,33 +59,45 @@ export default { | |||
| this.dropzoneParams = $('div#minioUploader-params'); | |||
| this.file_status_text = this.dropzoneParams.data('file-status'); | |||
| this.status = this.dropzoneParams.data('file-init-status'); | |||
| let previewTemplate = ''; | |||
| previewTemplate += '<div class="dz-preview dz-file-preview">\n '; | |||
| previewTemplate += ' <div class="dz-details">\n '; | |||
| previewTemplate += ' <div class="dz-filename">'; | |||
| previewTemplate += | |||
| ' <span data-dz-name data-dz-thumbnail></span>'; | |||
| previewTemplate += ' </div>\n '; | |||
| previewTemplate += ' <div class="dz-size" data-dz-size style="white-space: nowrap"></div>\n '; | |||
| previewTemplate += ' </div>\n '; | |||
| previewTemplate += ' <div class="dz-progress ui active progress">'; | |||
| previewTemplate += | |||
| ' <div class="dz-upload bar" data-dz-uploadprogress><div class="progress"></div></div>\n '; | |||
| previewTemplate += ' </div>\n '; | |||
| previewTemplate += ' <div class="dz-success-mark">'; | |||
| previewTemplate += ' <span>上传成功</span>'; | |||
| previewTemplate += ' </div>\n '; | |||
| previewTemplate += ' <div class="dz-error-mark">'; | |||
| previewTemplate += ' <span>上传失败</span>'; | |||
| previewTemplate += ' </div>\n '; | |||
| previewTemplate += ' <div class="dz-error-message">'; | |||
| previewTemplate += ' <span data-dz-errormessage></span>'; | |||
| previewTemplate += ' </div>\n'; | |||
| previewTemplate += '</div>'; | |||
| this.repoPath = this.dropzoneParams.data('repopath'); | |||
| // let previewTemplate = ''; | |||
| // previewTemplate += '<div class="dz-preview dz-file-preview">\n '; | |||
| // previewTemplate += ' <div class="dz-details">\n '; | |||
| // previewTemplate += ' <div class="dz-filename">'; | |||
| // previewTemplate += | |||
| // ' <span data-dz-name data-dz-thumbnail></span>'; | |||
| // previewTemplate += ' </div>\n '; | |||
| // previewTemplate += ' <div class="dz-size" data-dz-size style="white-space: nowrap"></div>\n '; | |||
| // previewTemplate += ' </div>\n '; | |||
| // previewTemplate += ' <div class="dz-progress ui active progress">'; | |||
| // previewTemplate += | |||
| // ' <div class="dz-upload bar" data-dz-uploadprogress><div class="progress"></div></div>\n '; | |||
| // previewTemplate += ' </div>\n '; | |||
| // previewTemplate += ' <div class="dz-success-mark">'; | |||
| // previewTemplate += ' <span>上传成功</span>'; | |||
| // previewTemplate += ' </div>\n '; | |||
| // previewTemplate += ' <div class="dz-error-mark">'; | |||
| // previewTemplate += ' <span>上传失败</span>'; | |||
| // previewTemplate += ' </div>\n '; | |||
| // previewTemplate += ' <div class="dz-error-message">'; | |||
| // previewTemplate += ' <span data-dz-errormessage></span>'; | |||
| // previewTemplate += ' </div>\n'; | |||
| // previewTemplate += '</div>'; | |||
| let previewTemplate = '' | |||
| previewTemplate += '<div class="dz-preview dz-file-preview" style="width:100%">' | |||
| previewTemplate += '<div class="dz-details">' | |||
| previewTemplate += '<div class="dz-filename"><span data-dz-name></span></div>' | |||
| previewTemplate += '<div class="dz-size" data-dz-size></div>' | |||
| previewTemplate += '<div class="dz-progress ui active progress" style="top: 75%;width: 80%;left: 15%;"><div class="dz-upload bar" data-dz-uploadprogress><div class="progress"></div></div></div>' | |||
| previewTemplate += '<img data-dz-thumbnail />' | |||
| previewTemplate += '</div>' | |||
| previewTemplate += '<div class="dz-success-mark"><span>✔</span></div>' | |||
| previewTemplate += '<div class="dz-error-mark"><span>✘</span></div>' | |||
| previewTemplate += '<div class="dz-error-message"><span data-dz-errormessage></span></div>' | |||
| previewTemplate += '</div>' | |||
| const $dropzone = $('div#dataset'); | |||
| console.log('createDropzone'); | |||
| const dropzoneUploader = await createDropzone($dropzone[0], { | |||
| url: '/todouploader', | |||
| maxFiles: this.maxFiles, | |||
| @@ -84,10 +111,7 @@ export default { | |||
| previewTemplate | |||
| }); | |||
| dropzoneUploader.on('addedfile', (file) => { | |||
| setTimeout(() => { | |||
| // eslint-disable-next-line no-unused-expressions | |||
| file.accepted && this.onFileAdded(file); | |||
| }, 200); | |||
| this.file = file | |||
| }); | |||
| dropzoneUploader.on('maxfilesexceeded', function (file) { | |||
| if (this.files[0].status !== 'success') { | |||
| @@ -105,11 +129,15 @@ export default { | |||
| resetStatus() { | |||
| this.progress = 0; | |||
| this.status = ''; | |||
| console.log(this.uploadtype) | |||
| }, | |||
| updateProgress(file, progress) { | |||
| file.previewTemplate.querySelector( | |||
| '.dz-upload' | |||
| ).style.width = `${progress}%`; | |||
| ).style.width = `${progress}%` | |||
| file.previewTemplate.querySelector( | |||
| '.dz-upload' | |||
| ).style.background = '#409eff'; | |||
| }, | |||
| emitDropzoneSuccess(file) { | |||
| file.status = 'success'; | |||
| @@ -122,18 +150,19 @@ export default { | |||
| this.dropzoneUploader.emit('error', file); | |||
| // this.dropzoneUploader.emit('complete', file); | |||
| }, | |||
| onFileAdded(file) { | |||
| file.datasetId = document | |||
| onFileAdded() { | |||
| this.btnFlag = true | |||
| this.file.datasetId = document | |||
| .getElementById('datasetId') | |||
| .getAttribute('datasetId'); | |||
| this.resetStatus(); | |||
| this.computeMD5(file); | |||
| this.computeMD5(this.file); | |||
| }, | |||
| finishUpload(file) { | |||
| this.emitDropzoneSuccess(file); | |||
| setTimeout(() => { | |||
| window.location.reload(); | |||
| window.location.href = this.repoPath | |||
| }, 1000); | |||
| }, | |||
| @@ -249,7 +278,7 @@ export default { | |||
| file_name: file.name, | |||
| size: file.size, | |||
| dataset_id: file.datasetId, | |||
| type: CloudBrainType, | |||
| type: this.uploadtype, | |||
| _csrf: csrf | |||
| }) | |||
| ); | |||
| @@ -288,7 +317,7 @@ export default { | |||
| md5: file.uniqueIdentifier, | |||
| size: file.size, | |||
| fileType: file.type, | |||
| type: CloudBrainType, | |||
| type: this.uploadtype, | |||
| _csrf: csrf | |||
| } | |||
| }); | |||
| @@ -329,7 +358,7 @@ export default { | |||
| uploadID: file.uploadID, | |||
| size: partSize, | |||
| chunkNumber: currentChunk + 1, | |||
| type: CloudBrainType, | |||
| type: this.uploadtype, | |||
| _csrf: csrf | |||
| } | |||
| }); | |||
| @@ -403,8 +432,9 @@ export default { | |||
| file_name: file.name, | |||
| size: file.size, | |||
| dataset_id: file.datasetId, | |||
| type: CloudBrainType, | |||
| _csrf: csrf | |||
| type: this.uploadtype, | |||
| _csrf: csrf, | |||
| description:this.desc | |||
| }) | |||
| ); | |||
| } | |||
| @@ -455,7 +485,7 @@ export default { | |||
| <style> | |||
| .dropzone-wrapper { | |||
| margin: 2em auto; | |||
| margin: 0; | |||
| } | |||
| .ui .dropzone { | |||
| border: 2px dashed #0087f5; | |||
| @@ -473,4 +503,8 @@ export default { | |||
| border-bottom: 1px solid #dadce0; | |||
| min-height: 0; | |||
| } | |||
| .upload-info{ | |||
| margin-top: 1em; | |||
| margin-bottom: 3em; | |||
| } | |||
| </style> | |||
| @@ -460,7 +460,7 @@ export default { | |||
| <style> | |||
| .dropzone-wrapper { | |||
| margin: 2em auto; | |||
| margin: 0; | |||
| } | |||
| .ui .dropzone { | |||
| border: 2px dashed #0087f5; | |||
| @@ -478,4 +478,7 @@ export default { | |||
| border-bottom: 1px solid #dadce0; | |||
| min-height: 0; | |||
| } | |||
| .upload-info{ | |||
| margin-top: 0.2em; | |||
| } | |||
| </style> | |||
| @@ -2918,6 +2918,7 @@ $(document).ready(async () => { | |||
| initVueApp(); | |||
| initVueUploader(); | |||
| initObsUploader(); | |||
| initVueDataset(); | |||
| initVueEditAbout(); | |||
| initVueEditTopic(); | |||
| initVueContributors(); | |||
| @@ -3658,6 +3659,101 @@ function initVueEditAbout() { | |||
| }); | |||
| } | |||
| function initVueDataset() { | |||
| const el = document.getElementById('dataset-base'); | |||
| if (!el) { | |||
| return; | |||
| } | |||
| new Vue({ | |||
| delimiters: ['${', '}'], | |||
| el, | |||
| data: { | |||
| suburl: AppSubUrl, | |||
| url:'', | |||
| type:0, | |||
| desc:'', | |||
| datasetType:'全部', | |||
| ruleForm:{ | |||
| title:'', | |||
| description:'', | |||
| category:'', | |||
| task:'', | |||
| license:'', | |||
| _csrf:csrf | |||
| }, | |||
| rules: { | |||
| title: [ | |||
| { required: true, message: '请输入数据集名称', trigger: 'blur' }, | |||
| { min: 1, max: 100, message: '长度在 1 到 100 个字符', trigger: 'blur' }, | |||
| // {required:true,message:'test',pattern:'/^[a-zA-Z0-9-_]{1,100}[^-]$/',trigger:'blur'}, | |||
| { validator: (rule, value, callback) => { | |||
| if (/^[a-zA-Z0-9-_]{1,100}[^-]$/.test(value) == false) { | |||
| callback(new Error("输入不符合数据集名称规则")); | |||
| } else { | |||
| callback(); | |||
| } | |||
| }, trigger: 'blur'} | |||
| ], | |||
| description: [ | |||
| { required: true, message: '请输入数据集描述详情', trigger: 'blur' } | |||
| ], | |||
| category: [ | |||
| { required: true, message: '请选择分类', trigger: 'change' } | |||
| ], | |||
| task: [ | |||
| { required: true, message: '请选择研究方向/应用领域', trigger: 'change' } | |||
| ], | |||
| // license: [ | |||
| // { required: true, message: '请选择活动区域', trigger: 'change' } | |||
| // ] | |||
| }, | |||
| }, | |||
| components: { | |||
| MinioUploader, | |||
| ObsUploader | |||
| }, | |||
| mounted(){ | |||
| if(document.getElementById('postPath')){ | |||
| this.url = document.getElementById('postPath').value | |||
| } | |||
| }, | |||
| methods:{ | |||
| createDataset(formName){ | |||
| let _this = this | |||
| this.$refs[formName].validate((valid)=>{ | |||
| if(valid){ | |||
| document.getElementById("mask").style.display = "block" | |||
| _this.$axios.post(_this.url,_this.qs.stringify(_this.ruleForm)).then((res)=>{ | |||
| if(res.data.Code===0){ | |||
| document.getElementById("mask").style.display = "none" | |||
| location.href = _this.url.split('/create')[0]+'?type=-1' | |||
| }else{ | |||
| console.log(res.data.Message) | |||
| } | |||
| }) | |||
| } | |||
| else{ | |||
| return false | |||
| } | |||
| }) | |||
| }, | |||
| cancelDataset(){ | |||
| location.href = this.url.split('/create')[0]+'?type=-1' | |||
| }, | |||
| gotoUpload(datsetId){ | |||
| location.href = `${AppSubUrl}/attachments/upload?datasetId=${datsetId}` | |||
| }, | |||
| uploadGpu(){ | |||
| this.type=0 | |||
| }, | |||
| uploadNpu(){ | |||
| this.type=1 | |||
| } | |||
| } | |||
| }); | |||
| } | |||
| function initVueEditTopic() { | |||
| const el = document.getElementById('topic_edit1'); | |||
| @@ -375,6 +375,10 @@ display: block; | |||
| font-size: 18px; | |||
| margin-bottom: 1rem; | |||
| } | |||
| .bgtask-content-button{ | |||
| margin-top: 1em; | |||
| margin-bottom: 1em; | |||
| } | |||
| .selectcloudbrain .active.item{ | |||
| color: #0087f5 !important; | |||