Files
Simple_Drawing/templates/page/tools.html
T
2021-09-07 23:12:03 +08:00

292 lines
8.9 KiB
HTML

{% load static %}
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<title>Simple Drawing</title>
<link rel="stylesheet" href="{% static '/css/layui.css' %}">
<link rel="stylesheet" href="{% static '/css/mycss.css' %}">
</head>
<body>
<div class="layui-layout layui-layout-admin">
<div class="layui-header">
<div class="layui-logo layui-hide-xs layui-bg-black">Simple Drawing</div>
<!-- 头部区域(可配合layui 已有的水平导航) -->
<ul class="layui-nav layui-layout-left">
<li class="layui-nav-item layui-hide-xs" style="margin-left: 200px"><a href="{{ url }}">Home</a></li>
<li class="layui-nav-item layui-hide-xs layui-this" style="margin-left: 200px"><a
href="tools.html">Tools</a></li>
<li class="layui-nav-item layui-hide-xs " style="margin-left: 200px"><a href="about.html">About us</a></li>
<li class="layui-nav-item layui-hide-xs" style="margin-left: 200px"><i
class="layui-icon layui-icon-search"></i></li>
<li class="layui-nav-item layui-hide-xs" style="margin-left: 10px">
<input type="text" placeholder="Search " name="search" onkeydown="entersearch()" data-toggle="search"
id="search" class="layui-input"/>
</li>
</ul>
</div>
<div class="layui-side layui-bg-black">
<div class="layui-side-scroll">
<!-- 左侧导航区域(可配合layui已有的垂直导航) -->
<ul class="layui-nav layui-nav-tree" lay-filter="test">
<li class="layui-nav-item">
<a class="" href="javascript:;">Basics</a>
<dl class="layui-nav-child">
<dd><a onclick=blast()>blast</a></dd>
<dd><a onclick=genbank_to_fasta()>genbank to fasta</a></dd>
<dd><a onclick=gff_to_gtf()>gff to gtf</a></dd>
<dd><a onclick=orf()>orf</a></dd>
<dd><a onclick=Basics()>序列基础</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">Gene Family</a>
<dl class="layui-nav-child">
<dd><a onclick=pfam()>pfam</a></dd>
</dl>
</li>
<li class="layui-nav-item">
<a href="javascript:;">Omics</a>
<dl class="layui-nav-child">
<dd><a href="javascript:;" onclick=Differential_expression_analysis()>Differential expression
analysis</a></dd>
<dd><a href="javascript:;" onclick=GO()>GO 富集</a></dd>
<dd><a href="javascript:;" onclick=kegg()>kegg富集</a></dd>
<dd><a href="javascript:;" onclick=fastqc()>fastqc</a></dd>
</dl>
</li>
</ul>
</div>
</div>
<div class="layui-body" style="background-color: rgb(242, 242, 242);">
<div class="declare_box" id="main_show">
</div>
<div class="layui-footer">
<!-- 底部固定区域 -->
底部固定区域
</div>
</div>
</div>
<script src="{% static 'layui.js' %}"></script>
<script>
//JS
layui.use(['element', 'layer', 'util'], function () {
var element = layui.element
, layer = layui.layer
, util = layui.util
, $ = layui.$;
//头部事件
util.event('lay-header-event', {
//左侧菜单事件
menuLeft: function (othis) {
layer.msg('展开左侧菜单的操作', {icon: 0});
}
, menuRight: function () {
layer.open({
type: 1
, content: '<div style="padding: 15px;">处理右侧面板的操作</div>'
, area: ['260px', '100%']
, offset: 'rt' //右上角
, anim: 5
, shadeClose: true
});
}
});
});
</script>
<script>
var $ = layui.jquery;
var form = layui.form;
var url_up = 'http://127.0.0.1:8000/'
// 页面跳转加载函数
function blast() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/blast.html' %}`)
up_file_blast()
form.render();
}
function genbank_to_fasta() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/genbank_to_fasta.html' %}`)
form.render();
}
function gff_to_gtf() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/gff_to_gtf.html' %}`)
form.render();
}
function orf() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/orf.html' %}`)
form.render();
}
function Basics() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/Basics.html' %}`)
form.render();
}
// 基因家族功能
function pfam() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/pfam.html' %}`)
form.render();
}
// 组学
function Differential_expression_analysis() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/Differential_expression_analysis.html' %}`)
form.render();
}
function GO() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/GO.html' %}`)
form.render();
}
function kegg() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/kegg.html' %}`)
form.render();
}
function fastqc() {
temp = $('#main_show')
temp.empty()
temp.append(String.raw`{% include 'tools/fastqc.html' %}`)
up_file("select_file", {})
form.render();
}
// 加载等待动画
function lodeing() {
layer.load(1);
setTimeout(function () {
});
}
// 文件上传
function up_file(tools_type, in_data) {
layui.use(['upload'], function () {
var $ = layui.jquery
, upload = layui.upload
, element = layui.element
, layer = layui.layer;
//选完文件后不自动上传["select_file1","select_file1","blast"], {}
upload.render({
elem: '#select_file1'
, url: url_up + 'tools/' + tools_type
, auto: false
, accept: 'file'
, field: "file1"
, data: {
csrfmiddlewaretoken: '{{ csrf_token }}'
, file_type: 1
}
, bindAction: '#run'
, done: function (res) {
layer.msg('上传成功');
console.log(res)
}
});
})
}
// 两文件上传
function up_file_blast(tools_type, in_data) {
layui.use(['upload'], function () {
var $ = layui.jquery
, upload = layui.upload
, element = layui.element
, layer = layui.layer;
//选完文件后不自动上传
upload.render({
elem: '#select_file2'
, url: url_up + 'tools/blast'
, auto: false
, accept: 'file'
, field: "file2"
, data: {
csrfmiddlewaretoken: '{{ csrf_token }}'
, file_type: 2
, type : $("#quiz1").val()
, e : $("#e").val()
}
, bindAction: '#run'
, done: function (res) {
layer.msg('上传成功');
console.log(res)
}
});
})
layui.use(['upload'], function () {
var $ = layui.jquery
, upload = layui.upload
, element = layui.element
, layer = layui.layer;
//选完文件后不自动上传
upload.render({
elem: '#select_file1'
, url: url_up + 'tools/tools'
, auto: false
, accept: 'file'
, field: "file1"
, data: {csrfmiddlewaretoken: '{{ csrf_token }}'}
, bindAction: '#id_transform_run'
, done: function (res) {
layer.msg('上传成功');
console.log(res)
}
});
})
}
</script>
</body>
</html>