mirror of
https://github.com/QingdaoU/OnlineJudgeFE.git
synced 2024-12-29 16:01:51 +00:00
problem支持MathJAX公式显示
This commit is contained in:
zema1
parent
bbe8065b60
commit
5a0db5385a
@ -216,11 +216,9 @@ export default {
|
||||
data
|
||||
})
|
||||
},
|
||||
makeContestProblemPublic (problemID) {
|
||||
makeContestProblemPublic (data) {
|
||||
return ajax('admin/contest_problem/make_public', 'post', {
|
||||
data: {
|
||||
problem_id: problemID
|
||||
}
|
||||
data
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
@ -91,7 +91,10 @@
|
||||
loading: false,
|
||||
currentPage: 1,
|
||||
routeName: '',
|
||||
contestId: ''
|
||||
contestId: '',
|
||||
// for make public use
|
||||
currentProblemID: '',
|
||||
makePublicDialogVisible: false
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
@ -131,12 +134,9 @@
|
||||
})
|
||||
},
|
||||
makeContestProblemPublic (problemID) {
|
||||
this.$confirm('Sure to public this problem?', 'Warning', {
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
api.makeContestProblemPublic(problemID).catch(() => {
|
||||
})
|
||||
}).catch(() => {
|
||||
this.$prompt('Please input display id for the public problem', 'confirm').then(({value}) => {
|
||||
api.makeContestProblemPublic({id: problemID, display_id: value}).catch()
|
||||
}, () => {
|
||||
})
|
||||
},
|
||||
handleVisibleSwitch (row) {
|
||||
|
||||
@ -88,13 +88,13 @@ const webpackConfig = merge(baseWebpackConfig, {
|
||||
chunks: ['vendor']
|
||||
}),
|
||||
// copy custom static assets
|
||||
// new CopyWebpackPlugin([
|
||||
// {
|
||||
// from: path.resolve(__dirname, '../static'),
|
||||
// to: config.build.assetsSubDirectory,
|
||||
// ignore: ['.*']
|
||||
// }
|
||||
// ])
|
||||
new CopyWebpackPlugin([
|
||||
{
|
||||
from: path.resolve(__dirname, '../static'),
|
||||
to: config.build.assetsSubDirectory,
|
||||
ignore: ['.*']
|
||||
}
|
||||
])
|
||||
]
|
||||
})
|
||||
|
||||
|
||||
126
oj/index.html
126
oj/index.html
@ -1,104 +1,46 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<title>OnlineJudge</title>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
|
||||
<meta name="renderer" content="webkit"/>
|
||||
<title>OnlineJudge</title>
|
||||
|
||||
<link href="static/css/loader.css" rel="stylesheet">
|
||||
|
||||
<script type="text/x-mathjax-config">
|
||||
MathJax.Hub.Config({
|
||||
showProcessingMessages: false,
|
||||
messageStyle: "none",
|
||||
extensions: ["tex2jax.js"],
|
||||
jax: ["input/TeX", "output/HTML-CSS"],
|
||||
tex2jax: {
|
||||
inlineMath: [ ["$", "$"] ],
|
||||
displayMath: [ ["$$","$$"] ],
|
||||
skipTags: ['script', 'noscript', 'style', 'textarea', 'pre','code','a']
|
||||
},
|
||||
"HTML-CSS": {
|
||||
availableFonts: ["STIX","TeX"],
|
||||
showMathMenu: false
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<script src="//cdn.bootcss.com/mathjax/2.7.0/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script>
|
||||
</head>
|
||||
<style>
|
||||
#app-loader {
|
||||
height: 20px;
|
||||
width: 250px;
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 50%;
|
||||
transform: translateY(-50%) translateX(-50%);
|
||||
}
|
||||
|
||||
.loader--dot {
|
||||
animation-name: loader;
|
||||
animation-timing-function: ease-in-out;
|
||||
animation-duration: 3s;
|
||||
animation-iteration-count: infinite;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
border-radius: 100%;
|
||||
background-color: black;
|
||||
position: absolute;
|
||||
border: 2px solid white;
|
||||
}
|
||||
|
||||
.loader--dot:first-child {
|
||||
background-color: #8cc759;
|
||||
animation-delay: 0.5s;
|
||||
}
|
||||
|
||||
.loader--dot:nth-child(2) {
|
||||
background-color: #8c6daf;
|
||||
animation-delay: 0.4s;
|
||||
}
|
||||
|
||||
.loader--dot:nth-child(3) {
|
||||
background-color: #ef5d74;
|
||||
animation-delay: 0.3s;
|
||||
}
|
||||
|
||||
.loader--dot:nth-child(4) {
|
||||
background-color: #f9a74b;
|
||||
animation-delay: 0.2s;
|
||||
}
|
||||
|
||||
.loader--dot:nth-child(5) {
|
||||
background-color: #60beeb;
|
||||
animation-delay: 0.1s;
|
||||
}
|
||||
|
||||
.loader--dot:nth-child(6) {
|
||||
background-color: #fbef5a;
|
||||
animation-delay: 0s;
|
||||
}
|
||||
|
||||
@keyframes loader {
|
||||
15% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
45% {
|
||||
transform: translateX(230px);
|
||||
}
|
||||
65% {
|
||||
transform: translateX(230px);
|
||||
}
|
||||
95% {
|
||||
transform: translateX(0);
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes loading-text {
|
||||
0% {
|
||||
content: "Loading";
|
||||
}
|
||||
25% {
|
||||
content: "Loading.";
|
||||
}
|
||||
50% {
|
||||
content: "Loading..";
|
||||
}
|
||||
75% {
|
||||
content: "Loading...";
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<body style="background: #eee">
|
||||
<div id='app-loader'>
|
||||
<div class='loader--dot'></div>
|
||||
<div class='loader--dot'></div>
|
||||
<div class='loader--dot'></div>
|
||||
<div class='loader--dot'></div>
|
||||
<div class='loader--dot'></div>
|
||||
<div class='loader--dot'></div>
|
||||
<body>
|
||||
<div id="app-loader">
|
||||
<div class="square"></div>
|
||||
<div class="square"></div>
|
||||
<div class="square last"></div>
|
||||
<div class="square clear"></div>
|
||||
<div class="square"></div>
|
||||
<div class="square last"></div>
|
||||
<div class="square clear"></div>
|
||||
<div class="square "></div>
|
||||
<div class="square last"></div>
|
||||
</div>
|
||||
|
||||
<div id="app"></div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
|
||||
@ -68,14 +68,7 @@
|
||||
}
|
||||
}
|
||||
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
background-color: #eee;
|
||||
min-width: 800px;
|
||||
}
|
||||
|
||||
|
||||
.content-app {
|
||||
margin-top: 80px;
|
||||
|
||||
@ -1,3 +1,12 @@
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
background-color: #eee;
|
||||
min-width: 800px;
|
||||
}
|
||||
|
||||
.flex-container {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
@ -44,6 +53,16 @@
|
||||
position: relative;
|
||||
}
|
||||
|
||||
// for mathjax
|
||||
.MathJax {
|
||||
outline: 0;
|
||||
}
|
||||
|
||||
.MathJax_Display {
|
||||
overflow-x: auto;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
hr {
|
||||
border-top: 1px dashed #b3b3b3;
|
||||
margin: 5px auto;
|
||||
|
||||
@ -248,8 +248,10 @@
|
||||
if (problemCode) {
|
||||
this.code = problemCode.code
|
||||
this.language = problemCode.language
|
||||
console.log(problemCode)
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
window.MathJax.Hub.Queue(['Typeset', window.MathJax.Hub, 'problem-content'])
|
||||
})
|
||||
}, () => {
|
||||
this.$Loading.error()
|
||||
})
|
||||
|
||||
129
oj/static/css/loader.css
Normal file
129
oj/static/css/loader.css
Normal file
@ -0,0 +1,129 @@
|
||||
@-webkit-keyframes enter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: -10px;
|
||||
}
|
||||
5% {
|
||||
opacity: 1;
|
||||
top: 0px;
|
||||
}
|
||||
50.9% {
|
||||
opacity: 1;
|
||||
top: 0px;
|
||||
}
|
||||
55.9% {
|
||||
opacity: 0;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
@keyframes enter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: -10px;
|
||||
}
|
||||
5% {
|
||||
opacity: 1;
|
||||
top: 0px;
|
||||
}
|
||||
50.9% {
|
||||
opacity: 1;
|
||||
top: 0px;
|
||||
}
|
||||
55.9% {
|
||||
opacity: 0;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
@-moz-keyframes enter {
|
||||
0% {
|
||||
opacity: 0;
|
||||
top: -10px;
|
||||
}
|
||||
5% {
|
||||
opacity: 1;
|
||||
top: 0px;
|
||||
}
|
||||
50.9% {
|
||||
opacity: 1;
|
||||
top: 0px;
|
||||
}
|
||||
55.9% {
|
||||
opacity: 0;
|
||||
top: 10px;
|
||||
}
|
||||
}
|
||||
body {
|
||||
background: #f8f8f9;
|
||||
}
|
||||
|
||||
#app-loader {
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
margin-left: -27.5px;
|
||||
margin-top: -27.5px;
|
||||
}
|
||||
#app-loader .square {
|
||||
background: #2d8cf0;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
float: left;
|
||||
top: -10px;
|
||||
margin-right: 5px;
|
||||
margin-top: 5px;
|
||||
position: relative;
|
||||
opacity: 0;
|
||||
-webkit-animation: enter 6s infinite;
|
||||
animation: enter 6s infinite;
|
||||
}
|
||||
#app-loader .enter {
|
||||
top: 0px;
|
||||
opacity: 1;
|
||||
}
|
||||
#app-loader .square:nth-child(1) {
|
||||
-webkit-animation-delay: 1.8s;
|
||||
-moz-animation-delay: 1.8s;
|
||||
animation-delay: 1.8s;
|
||||
}
|
||||
#app-loader .square:nth-child(2) {
|
||||
-webkit-animation-delay: 2.1s;
|
||||
-moz-animation-delay: 2.1s;
|
||||
animation-delay: 2.1s;
|
||||
}
|
||||
#app-loader .square:nth-child(3) {
|
||||
-webkit-animation-delay: 2.4s;
|
||||
-moz-animation-delay: 2.4s;
|
||||
animation-delay: 2.4s;
|
||||
background: #ff9900;
|
||||
}
|
||||
#app-loader .square:nth-child(4) {
|
||||
-webkit-animation-delay: 0.9s;
|
||||
-moz-animation-delay: 0.9s;
|
||||
animation-delay: 0.9s;
|
||||
}
|
||||
#app-loader .square:nth-child(5) {
|
||||
-webkit-animation-delay: 1.2s;
|
||||
-moz-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s;
|
||||
}
|
||||
#app-loader .square:nth-child(6) {
|
||||
-webkit-animation-delay: 1.5s;
|
||||
-moz-animation-delay: 1.5s;
|
||||
animation-delay: 1.5s;
|
||||
}
|
||||
#app-loader .square:nth-child(8) {
|
||||
-webkit-animation-delay: 0.3s;
|
||||
-moz-animation-delay: 0.3s;
|
||||
animation-delay: 0.3s;
|
||||
}
|
||||
#app-loader .square:nth-child(9) {
|
||||
-webkit-animation-delay: 0.6s;
|
||||
-moz-animation-delay: 0.6s;
|
||||
animation-delay: 0.6s;
|
||||
}
|
||||
#app-loader .clear {
|
||||
clear: both;
|
||||
}
|
||||
#app-loader .last {
|
||||
margin-right: 0;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user