71 lines
2.5 KiB
Vue
71 lines
2.5 KiB
Vue
<template>
|
|
<div class="col-md-12"><br>
|
|
<label>{{ $t("problem.sample") }}</label>
|
|
<button class="btn btn-primary btn-sm add-sample-btn" type="button" v-on:click="addSample">{{ $t("problem.addSample") }}
|
|
</button>
|
|
|
|
<div>
|
|
<div class="panel panel-default" v-for="sample in sampleList">
|
|
<div class="panel-heading">
|
|
<span class="panel-title">{{ $t("problem.sample") }} {{ $index + 1 }}</span>
|
|
<button type="button" class="btn btn-primary btn-sm" v-on:click="toggleSample($index)">
|
|
{{ sample.visible?$t("problem.fold"):$t("problem.show") }}
|
|
</button>
|
|
<button type="button" class="btn btn-danger btn-sm" v-on:click="delSample($index)">
|
|
{{ $t("adminUtils.delete") }}
|
|
</button>
|
|
</div>
|
|
<div class="panel-body row" v-show="sample.visible">
|
|
<div class="col-md-6">
|
|
<div class="form-group">
|
|
<p>{{ $t("problem.sample") }}{{ $t("adminUtils.input") }}</p>
|
|
<textarea class="form-control" rows="5" required></textarea>
|
|
</div>
|
|
</div>
|
|
<div class="col-md-6">
|
|
<div class="form-group">
|
|
<p>{{ $t("problem.sample") }}{{ $t("adminUtils.output") }}</p>
|
|
<textarea class="form-control" rows="5" required></textarea>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default({
|
|
props: {
|
|
sampleList: {
|
|
type: Array,
|
|
required: true
|
|
}
|
|
},
|
|
methods: {
|
|
addSample() {
|
|
this.sampleList.push({input: "", output: "", visible: true});
|
|
},
|
|
toggleSample(index) {
|
|
this.sampleList[index].visible = !this.sampleList[index].visible;
|
|
},
|
|
delSample(index) {
|
|
confirm(this.$t("problem.deleteThisSample"), ()=> {
|
|
this.sampleList.splice(index, 1);
|
|
});
|
|
}
|
|
}
|
|
})
|
|
</script>
|
|
|
|
<style scoped>
|
|
.add-sample-btn {
|
|
margin-bottom: 5px;
|
|
}
|
|
.panel-heading {
|
|
padding-bottom: 8px;
|
|
}
|
|
.panel-body {
|
|
padding-top: 5px;
|
|
}
|
|
</style> |