wally
/
plugin-templete
1
0
Fork 1
Code Issues Releases Wiki Activity
Browse Source

红头文件

ts-red-header-file
xuesinan 4 years ago
parent
136d4f5540
commit
b0a1281069
1 changed files with 67 additions and 19 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 86
      index.html

86
index.html
View File

@ -37,7 +37,7 @@
</div>
</div> -->
<div class="flex-1" style="height: 50rem;">
<div class="flex-1" style="width: 100%; height: 50rem;">
<div class="rounded-lg bg-white p-3" style="height: 100%;">
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="alert('hello')">测试组建1</button>
<button class="bg-blue-500 py-2 px-5 rounded text-white" onclick="p100.show()">测试组建2</button>
@ -99,9 +99,12 @@
fileId: '', // 上传文件ID
filePath: '', // 上传文件路径
curStatus: 0, // 当前状态 0 未提交 1 已提交待审核
curIndex: 0, // 当前选择的模板
// curIndex: 0, // 当前选择的模板
tempList: [{name: '模板1', organizer: '国家体育总局社会体育指导中心', title: ''}, {name: '模板2', organizer: '', title: ''}, {name: '模板3', organizer: '', title: ''}],
tempData: {},
tempData: {}, // 当前选择的模板数据
currTempData: {}, // 当前计划的模板数据
templateId: '', // 当前选择的模板ID
currTemplateId: '', // 当前计划的模板ID
init() {
this.dom = document.querySelector("div[data-root=p1472866674721169408]");
@ -129,8 +132,7 @@
that.token = data.token;
// 查询培训计划
that.getTrainPlan()
// 查询所有模板
that.getAllTemp();
} else {
console.log('msg: ', msg);
}
@ -158,10 +160,16 @@
.then(function(res) {
const { success, code, data, msg } = res;
if (success && code === 200) {
that.templateId = data.templateId;
that.currTemplateId = data.templateId;
that.tempData = data.trainingInfos;
that.currTempData = data.trainingInfos;
} else {
console.log('msg: ', msg);
}
// 查询所有模板
that.getAllTemp();
});
},
@ -212,8 +220,15 @@
temps[i].classList.add("border-gray-200");
}
temps[index].classList.add("border-blue-400");
this.curIndex = index;
this.getTempData(obj.id);
this.templateId = obj.id;
if (this.currTemplateId === obj.id) {
this.tempData = this.currTempData;
this.renderTempData(); // 渲染模板数据
} else {
// this.curIndex = index;
this.getTempData(obj.id);
}
},
// 根据模板id获取模板数据
@ -251,36 +266,43 @@
// 渲染模板
renderTemp() {
let that = this;
// this.tempList
let html = '';
for (let j = 0; j < that.tempList.length; j++) {
let d = that.tempList[j];
html += `<div class="temp-item border border-gray-200 flex justify-center items-center ${j > 2 ? 'mt-2' : ''}" style="width: 30%; height: 100px; ${j % 3 == 2 ? '' : 'margin-right: 5%;'}" onclick="p1472866674721169408.selTemp(${j})">
<img style="max-width: 100%; max-height: 100%;" src="${that.tempList[j].path}" />
<img style="max-width: 100%; max-height: 100%;" src="${d.path}" />
</div>`;
}
that.dom.querySelector('.temp-list').innerHTML = html;
for (let j = 0; j < that.tempList.length; j++) {
if (that.tempList[j].id === that.currTemplateId) {
that.selTemp(j);
}
}
},
// 渲染模板数据
renderTempData() {
let that = this;
let html = '';
for (let i = 0; i < that.tempData.length; i++) {
let data = that.tempData[i];
if (data.type === 1) {
html += `<div class="ques-box mt-2.5 px-2 py-1.5 w-full border border-gray-200 rounded-sm text-sm" data-id="${data.questionId}">
<div class="flex justify-between items-center w-full" style="height: 20px;">
<p class="w-20 flex-shrink-0 text-gray-400">${data.question}</p>
<input data-id="${data.questionId}" class="train-name text-right outline-none" style="width: calc(100% - 6rem)" type="text" placeholder="请输入${data.question}" />
<input data-id="${data.questionId}" class="train-name text-right outline-none" style="width: calc(100% - 6rem)" type="text" value="${data.answer ? data.answer : ''}" placeholder="请输入${data.question}" />
</div>
</div>`;
} else if (data.type === 2) {
html += `<div class="mt-2.5 px-2 py-1.5 flex justify-between w-full h-16 border border-gray-200 rounded-sm text-sm" data-id="${data.questionId}">
<p class="w-20 flex-shrink-0 text-gray-400">${data.question}</p>
<textarea data-id="${data.questionId}" class="train-desc text-right outline-none" style="width: calc(100% - 6rem)" placeholder="请输入${data.question}"></textarea>
<textarea data-id="${data.questionId}" class="train-desc text-right outline-none" style="width: calc(100% - 6rem)" placeholder="请输入${data.question}">${data.answer ? data.answer : ''}</textarea>
</div>`;
} else if (data.type === 3) {
html += `<div class="mt-2.5 px-2 py-1.5 flex justify-between w-full border border-gray-200 rounded-sm text-sm" data-id="${data.questionId}">`;
@ -288,7 +310,7 @@
html += `<div class="flex items-center flex-wrap justify-end">`;
for (let j = 0; j < data.optionList.length; j++) {
html += `<label class="ml-3 my-1 flex items-center"><input class="mr-1.5" name="Fruit" type="radio" data-id="${data.questionId}" value="${data.optionList[j].submitValue}" />${data.optionList[j].showValue}</label>`;
html += `<label class="ml-3 my-1 flex items-center"><input class="mr-1.5" name="Fruit" type="radio" ${data.optionList[j].choose ? 'checked' : ''} data-id="${data.questionId}" value="${data.optionList[j].submitValue}" />${data.optionList[j].showValue}</label>`;
}
html += `</div>`;
html += `</div>`;
@ -297,7 +319,7 @@
html += `<p class="w-20 flex-shrink-0 text-gray-400">${data.question}</p>`;
html += `<div class="flex items-center flex-wrap justify-end">`;
for (let j = 0; j < data.optionList.length; j++) {
html += `<label class="ml-3 my-1 flex items-center"><input class="mr-1.5" name="Fruit" type="checkbox" data-id="${data.questionId}" value="${data.optionList[j].submitValue}" />${data.optionList[j].showValue}</label>`;
html += `<label class="ml-3 my-1 flex items-center"><input class="mr-1.5" name="Fruit" type="checkbox" ${data.optionList[j].choose ? 'checked' : ''} data-id="${data.questionId}" value="${data.optionList[j].submitValue}" />${data.optionList[j].showValue}</label>`;
}
html += `</div>`;
html += `</div>`;
@ -305,9 +327,9 @@
data.answer = '1';
html += `<div class="mt-2.5 px-2 py-1.5 flex justify-between w-full border border-gray-200 rounded-sm text-sm" data-id="${data.questionId}">`;
html += `<p class="w-20 flex-shrink-0 text-gray-400">${data.question}</p>`;
html += `<select id="group" data-id="${data.questionId}" value="1">`;
html += `<select id="group" data-id="${data.questionId}" value="${data.answer}">`;
for (let j = 0; j < data.optionList.length; j++) {
html += `<option value="${data.optionList[j].submitValue}">${data.optionList[j].showValue} </option>`;
html += `<option value="${data.optionList[j].submitValue}" ${data.optionList[j].choose ? 'selected' : ''}>${data.optionList[j].showValue}</option>`;
}
html += `</select>`;
html += `</div>`;
@ -315,12 +337,12 @@
html += `<div class="mt-2.5 px-2 py-1.5 flex justify-between w-full border border-gray-200 rounded-sm text-sm" data-id="${data.questionId}">
<div class="flex justify-between items-center w-full" style="height: 20px;">
<p class="w-20 flex-shrink-0 text-gray-400">${data.question}</p>
<input class="train-start-time text-right outline-none" data-id="${data.questionId}" type="date" placeholder="请选择${data.question}">
<input class="train-start-time text-right outline-none" data-id="${data.questionId}" type="date" value="${data.answer}" placeholder="请选择${data.question}">
</div>
</div>`;
} else if (data.type === 7) {
html += `<div class="file-upload mt-2.5 px-2 flex justify-between items-center w-full h-8 border border-gray-200 rounded-sm text-sm">
<p class="file-name text-gray-400">文件上传</p>
<p class="file-name text-gray-400 truncate" style="width: calc(100% - 50px);">${data.answer ? data.answer : '文件上传'}</p>
<div class="relative flex items-center">
<button>上传</button>
<input class="input-file absolute z-10 opacity-0" type="file" data-id="${data.questionId}" name="files" id="file" multiple>
@ -419,6 +441,32 @@
})
console.log('questionList', questionList)
fetch(`https://test.tall.wiki/gateway/sports/training/save`, {
headers: new Headers({
'Authorization': 'Bearer ' + that.token,
'Content-Type': 'application/json; charset=utf-8'
}),
method: 'POST',
body: JSON.stringify({
param: {
projectId: that.projectId,
questionList,
templateId: that.templateId
}
}),
})
.then(function(response) {
return response.json();
})
.then(function(res) {
const { success, code, data, msg } = res;
if (success && code === 200) {
that.getTrainPlan(); // 重新调用查询培训计划方法，查询提交后的红头文件
} else {
console.log('msg: ', msg);
}
});
},
// 文件上传

Write Preview
Loading…
Cancel
Save