| | |
| | | <template> |
| | | <div class="questionnaire"> |
| | | <h1>夏季防暑随访收集问卷</h1> |
| | | <el-form :model="formData" label-width="80px"> |
| | | <el-form-item label="问题一"> |
| | | <el-input v-model="formData.question1"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="问题二"> |
| | | <el-input v-model="formData.question2"></el-input> |
| | | </el-form-item> |
| | | <el-form-item label="问题三"> |
| | | <el-radio-group v-model="formData.question3"> |
| | | <el-radio label="选项1">选项1</el-radio> |
| | | <el-radio label="选项2">选项2</el-radio> |
| | | <el-radio label="选项3">选项3</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | <el-form-item label="问题四"> |
| | | <el-radio-group v-model="formData.question3"> |
| | | <el-radio label="选项1">选项1</el-radio> |
| | | <el-radio label="选项2">选项2</el-radio> |
| | | <el-radio label="选项3">选项3</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | <el-form-item label="问题五"> |
| | | <el-radio-group v-model="formData.question3"> |
| | | <el-radio label="选项1">选项1</el-radio> |
| | | <el-radio label="选项2">选项2</el-radio> |
| | | <el-radio label="选项3">选项3</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | <el-form-item label="问题六"> |
| | | <el-radio-group v-model="formData.question3"> |
| | | <el-radio label="选项1">选项1</el-radio> |
| | | <el-radio label="选项2">选项2</el-radio> |
| | | <el-radio label="选项3">选项3</el-radio> |
| | | </el-radio-group> |
| | | </el-form-item> |
| | | <el-form-item> |
| | | <el-button type="primary" @click="submitForm">提交问卷</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | <div class="CONTENT"> |
| | | <div class="title">随访问卷</div> |
| | | <div class="preview-left"> |
| | | <!-- 单选 --> |
| | | <div |
| | | class="topic-dev" |
| | | v-for="(item, index) in questionList" |
| | | :key="item.aaa" |
| | | > |
| | | <div |
| | | class="scriptTopic-dev" |
| | | :key="item.sort" |
| | | v-if="item.scriptType == 1" |
| | | > |
| | | <div class="dev-text"> |
| | | {{ item.sort }}、[单选]<span>{{ item.scriptContent }}</span> |
| | | </div> |
| | | <div class="dev-xx"> |
| | | <el-radio-group v-model="item.remark"> |
| | | <el-radio |
| | | v-for="(items, index) in item.svyLibTemplateTargetoptions" |
| | | :key="index" |
| | | :label="index" |
| | | >{{ items.optioncontent }}</el-radio |
| | | > |
| | | </el-radio-group> |
| | | </div> |
| | | </div> |
| | | <!-- 多选 --> |
| | | <div |
| | | class="scriptTopic-dev" |
| | | :key="item.sort" |
| | | v-if="item.scriptType == 2" |
| | | > |
| | | <div class="dev-text"> |
| | | {{ item.sort }}、[多选]<span>{{ item.scriptContent }}</span> |
| | | </div> |
| | | <div class="dev-xx"> |
| | | <el-checkbox-group v-model="qremark"> |
| | | <el-checkbox |
| | | v-for="(items, index) in item.svyLibTemplateTargetoptions" |
| | | :key="index" |
| | | :label="index" |
| | | > |
| | | {{ items.optioncontent }} |
| | | </el-checkbox> |
| | | </el-checkbox-group> |
| | | </div> |
| | | </div> |
| | | <!-- 填空 --> |
| | | <div |
| | | class="scriptTopic-dev" |
| | | :key="item.sort" |
| | | v-if="item.scriptType == 4" |
| | | > |
| | | <div class="dev-text"> |
| | | {{ item.sort }}、[问答]<span>{{ item.scriptContent }}</span> |
| | | </div> |
| | | <div class="dev-xx"> |
| | | <el-input placeholder="请输入答案" v-model="radioas" clearable> |
| | | </el-input> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <el-form :model="formData" label-width="80px"> |
| | | <el-form-item> |
| | | <el-button type="primary" @click="submitForm">提交问卷</el-button> |
| | | </el-form-item> |
| | | </el-form> |
| | | </div> |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | import { |
| | | getExternalfollowup, |
| | | SetsaveQuestionAnswer, |
| | | } from "@/api/AiCentre/index"; |
| | | import JSEncrypt from "jsencrypt"; |
| | | export default { |
| | | data() { |
| | | return { |
| | | taskid: 355, |
| | | patid: 265823, |
| | | questionList: null, |
| | | // 前端公钥 |
| | | publicKey: |
| | | "MFwwDQYJKoZIhvcNAQEBBQADSwAwSAJBAKR0yHv0rbJWQE+Sc7/FwpW66qMd9qX2k6z+SDgkSdxWh/1GbBoAP7bDQQRF6vXmoKsD2ya42H6XRLSDXAoayuMCAwEAAQ== ", |
| | | // 后端私钥 |
| | | privateKey: |
| | | " MIIBUwIBADANBgkqhkiG9w0BAQEFAASCAT0wggE5AgEAAkEAtDOpbUQhcEoYy77agRhIHmAzs7H+KHJhN56gTTI9fWq23j77nI055MFV3oQQziIrNUTNaPpEQhZXBpI0+f9K9QIDAQABAkB3n0fcWfrcoMN/FU3VnrnZOEF6CzFNxkgU9P8y36QECWKZ9JhYQkNpKrMC9oXlN3VSaRigV7B+L/I/a0Rs1W+tAiEA4jx7xcXJ4y4BNwAmVHt6NNiEkzIwWnwC/0qsEu8NsOsCIQDL6MMn1D2uznC6OuOWpxDCkBh1JL1NzZTZeH2G+hj7nwIgKGAC9tjFnvWm4dn0/T7MIIJDpsFeP8fCAS2iZ/6hwuECIAS/eLvWr1EAsZNEh8QcQ8GkBU3E+ztyjAK8UX/xFt/VAiBf79/1tDErX4/DChecM8w3c3DhbBcjuE3fHZn7p6/UKg==", |
| | | formData: { |
| | | question1: "", |
| | | question2: "", |
| | |
| | | this.getQuestionnaire(); |
| | | }, |
| | | methods: { |
| | | // 获取数据 |
| | | getQuestionnaire() { |
| | | this.taskid = this.$route.query.param1; |
| | | this.patid = this.$route.query.param2; |
| | | let taskname = this.$route.query.param3; |
| | | let routertf = this.$route.query.param5; |
| | | |
| | | // console.log(taskid, "taskid"); |
| | | // console.log(patid, "patid"); |
| | | // console.log(taskname, "taskname"); |
| | | // console.log(routertf, "routertf"); |
| | | // let taskid = |
| | | // "OFp7tn/B6x7IzKJetvGWHdSWBj7msRlnlj6am9dyuHTH6sEt4uBbVCUXs5kcF/e4O2W6vqHf2Bz9K3/evbYDmw=="; |
| | | // let patid = |
| | | // "CVk0j8O86AeCqhV5WPsBBYDg9fec0wDoDlP9imYK4wDBNIkxywZzMJEGlPagOxnq6qr2WYZo0U8MUGWRGnq8ZA=="; |
| | | // 解密 |
| | | // this.taskid = this.decrypt(taskid); |
| | | // this.patid = this.decrypt(patid); |
| | | |
| | | // this.taskid = taskid; |
| | | // this.patid = patid; |
| | | |
| | | |
| | | this.$modal.msgSuccess("用户id为" + this.patid); |
| | | this.$modal.msgSuccess("任务id为" + this.taskid); |
| | | // let taskids = this.encrypt(this.taskid); |
| | | // let patids = this.encrypt(this.patid); |
| | | getExternalfollowup({ param1: this.taskid, param2: this.patid }).then((res) => { |
| | | if (res.code == 200) { |
| | | this.questionList = res.rows; |
| | | } |
| | | }); |
| | | }, |
| | | // 加密函数 |
| | | encrypt(txt) { |
| | | const encryptor = new JSEncrypt(); |
| | | encryptor.setPublicKey(this.publicKey); // 设置公钥 |
| | | return encryptor.encrypt(txt); // 对数据进行加密 |
| | | }, |
| | | |
| | | // 解密函数 |
| | | decrypt(txt) { |
| | | const encryptor = new JSEncrypt(); |
| | | encryptor.setPrivateKey(this.privateKey); // 设置私钥 |
| | | return encryptor.decrypt(txt); // 对数据进行解密 |
| | | }, |
| | | // 提交 |
| | | submitForm() { |
| | | // 提交表单逻辑 |
| | | console.log(this.formData); |
| | | console.log(this.questionList); |
| | | let form = { |
| | | param1: this.taskid, |
| | | param2: this.patid, |
| | | ivrTaskcalldetailList: [], |
| | | }; |
| | | this.questionList.forEach((item) => { |
| | | let optionarr = []; |
| | | item.ivrLibaScriptTargetoptionList.forEach((option) => { |
| | | optionarr.push(option.targetvalue); |
| | | }); |
| | | let ivrTaskcalldetail = { |
| | | asrtext: item.asrtext, |
| | | valueType: item.valueType, |
| | | scriptContent: item.scriptContent, |
| | | targetoptions: optionarr.join(","), |
| | | }; |
| | | form.ivrTaskcalldetailList.push(ivrTaskcalldetail); |
| | | }); |
| | | console.log(form, "form"); |
| | | |
| | | SetsaveQuestionAnswer(form).then((res) => { |
| | | if (res.code == 200) { |
| | | this.$modal.msgSuccess("提交成功"); |
| | | } |
| | | }); |
| | | // 可以将数据提交到后端或者进行其他处理 |
| | | }, |
| | | getQuestionnaire() { |
| | | this.taskid = this.$route.query.taskid; |
| | | this.userid = this.$route.query.userid; |
| | | this.$modal.msgSuccess("用户id为" + this.userid); |
| | | this.$modal.msgSuccess("任务id为" + this.taskid); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | | <style scoped> |
| | | <style lang="scss" scoped> |
| | | .questionnaire { |
| | | max-width: 600px; |
| | | margin: 0 auto; |
| | | padding: 20px; |
| | | border: 1px solid #eee; |
| | | border-radius: 5px; |
| | | background-color: #e1f3f2; |
| | | // background-image: url("../assets/images/chainbackground.jpg"); |
| | | // background-repeat: no-repeat; |
| | | // background-position: center center; |
| | | // background-size: cover; |
| | | // height: 100vh; |
| | | background-image: url("../assets/images/chainbackground.jpg"); |
| | | background-size: cover; |
| | | background-attachment: fixed; /* 保持背景固定 */ |
| | | background-position: center; |
| | | font-family: Arial, sans-serif; |
| | | min-height: 100vh; |
| | | margin: 0; |
| | | padding: 0; |
| | | .CONTENT { |
| | | padding: 10px; |
| | | .title { |
| | | font-size: 22px; |
| | | font-weight: bold; |
| | | margin-bottom: 20px; |
| | | text-align: center; |
| | | } |
| | | } |
| | | } |
| | | .preview-left { |
| | | margin: 20px; |
| | | // margin: 20px; |
| | | padding: 30px; |
| | | // background: #ffff; |
| | | border: 1px solid #dcdfe6; |
| | | -webkit-box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12), |
| | | 0 0 6px 0 rgba(0, 0, 0, 0.04); |
| | | .topic-dev { |
| | | margin-bottom: 25px; |
| | | font-size: 20px !important; |
| | | .dev-text { |
| | | margin-bottom: 10px; |
| | | } |
| | | } |
| | | } |
| | | </style> |