satisfactionQuestions.vue 41 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535
  1. <template>
  2. <view class="container">
  3. <scroll-view
  4. class="scroll_view"
  5. scroll-y
  6. scroll-with-animation
  7. scroll-anchoring
  8. :scroll-into-view="point"
  9. >
  10. <view class="top_bg_box">
  11. <image mode="widthFix" :src="icon.satisfaction.ques_top_bg"></image>
  12. <view class="ques_introduce displayFlexCol">
  13. <text>{{ quesList.SubjectTitle }}</text>
  14. <text>{{ quesList.Remark }}</text>
  15. </view>
  16. </view>
  17. <view class="main_box">
  18. <view class="mask_form" v-if="complete"></view>
  19. <block v-for="(item, index) in quesList.QuestionList" :key="index">
  20. <view
  21. class="ques_item_box"
  22. :id="'p' + index"
  23. v-if="!isQuestionHidden(item)"
  24. :class="item.QuestType == 'SubTitle' ? 'sub_title' : ''"
  25. >
  26. <view class="ques_title_box">
  27. <text class="mustQuest_tag" v-if="item.MustQuest">*</text>
  28. <text v-if="item.QuestType != 'SubTitle'">{{ item.Sort }}.{{ item.Question }}</text>
  29. <text v-if="item.QuestType == 'SubTitle'">{{ item.Num }}、{{ item.Question }}</text>
  30. </view>
  31. <!-- 大标题满意度 -->
  32. <view
  33. class="ques_options displayFlexCol"
  34. v-if="item.QuestType == 'SubTitle' && item.HasScaleInSubtitle"
  35. >
  36. <block
  37. v-for="(childItem, childIndex) in subtitleSatisfactionOptions"
  38. :key="`SubTitleSatisfaction-${index}-${childIndex}`"
  39. >
  40. <text
  41. class="choice_item"
  42. :class="
  43. isSubtitleSatisfactionActive(item.SubTitleIndex, childIndex) ? 'active_option' : ''
  44. "
  45. :data-subtitleindex="item.SubTitleIndex"
  46. :data-childindex="childIndex"
  47. @click="choiceSubtitleSatisfaction"
  48. >
  49. {{ childItem }}
  50. </text>
  51. </block>
  52. </view>
  53. <!-- 填空题 -->
  54. <view
  55. class="ques_options align_items_left displayFlexCol"
  56. v-if="item.QuestType == 'Input'"
  57. >
  58. <text class="input_label">{{ item.Question }}:</text>
  59. <view class="textarea_box">
  60. <textarea
  61. auto-height
  62. :data-index="index"
  63. :placeholder="'最多输入' + item.RuleInfo.MaxLength + '个字'"
  64. :maxlength="item.RuleInfo.MaxLength"
  65. :value="item.AnswerList"
  66. @blur="setVal"
  67. />
  68. </view>
  69. </view>
  70. <!-- 矩阵填空题 -->
  71. <view
  72. class="ques_options align_items_left displayFlexCol"
  73. v-if="item.QuestType == 'MatrixInput'"
  74. >
  75. <block
  76. v-for="(childItem, childIndex) in item.MatrixQuestionList"
  77. :key="`MatrixInput-${index}-${childIndex}`"
  78. >
  79. <view class="matrix_input_box margin_bottom_10 displayFlexRow">
  80. <text>{{ childItem.Question }}:</text>
  81. <view class="textarea_box matrix_textarea_box">
  82. <textarea
  83. auto-height
  84. :data-index="index"
  85. :data-childindex="childIndex"
  86. :placeholder="'最多输入' + childItem.RuleInfo.MaxLength + '个字'"
  87. :maxlength="childItem.RuleInfo.MaxLength"
  88. :value="childItem.AnswerList"
  89. @input="setVal"
  90. />
  91. </view>
  92. </view>
  93. </block>
  94. </view>
  95. <!-- 单选/多选题 -->
  96. <view
  97. class="ques_options displayFlexCol"
  98. v-if="item.QuestType == 'Radio' || item.QuestType == 'Checkbox'"
  99. >
  100. <block
  101. v-for="(childItem, childIndex) in item.QuestionItemList"
  102. :key="`Checkbox-${index}-${childIndex}`"
  103. >
  104. <text
  105. class="choice_item"
  106. :class="fn.answer(item, childItem.ItemId) ? 'active_option' : ''"
  107. :data-index="index"
  108. :data-childindex="childIndex"
  109. @click="choiceOption"
  110. >
  111. {{ childItem.ItemName }}
  112. </text>
  113. </block>
  114. </view>
  115. <!-- 选择题 -->
  116. <view class="ques_options displayFlexCol" v-if="item.QuestType == 'Select'">
  117. <picker
  118. class="picker_box"
  119. range-key="ItemName"
  120. :range="item.QuestionItemList"
  121. :data-index="index"
  122. :value="item.AnswerList"
  123. @change="bindPickerChange"
  124. >
  125. <view class="picker displayFlexRow">
  126. <text>{{ item.QuestionItemList[item.AnswerList].ItemName }}</text>
  127. <image :src="icon.satisfaction.right" mode="" />
  128. </view>
  129. </picker>
  130. </view>
  131. <!-- 矩阵单选题/矩阵多选题/矩阵量表 -->
  132. <view
  133. class="ques_options matrix_border displayFlexCol"
  134. v-if="
  135. item.QuestType == 'MatrixRadio' ||
  136. item.QuestType == 'MatrixCheckbox' ||
  137. item.QuestType == 'MatrixScale'
  138. "
  139. >
  140. <view class="matrix_options matrix_options_title displayFlexRow">
  141. <block
  142. v-for="(childItem, childIndex) in item.MatrixQuestionList[0].QuestionItemList"
  143. :key="`${item.QuestType}0-${index}-${childIndex}`"
  144. >
  145. <text
  146. :style="{
  147. width: fn.getWidth(item.MatrixQuestionList[0].QuestionItemList.length) + '%',
  148. }"
  149. >
  150. {{ childItem.ItemName }}
  151. </text>
  152. </block>
  153. </view>
  154. <block
  155. v-for="(childItem, childIndex) in item.MatrixQuestionList"
  156. :key="`${item.QuestType}-${index}-${childIndex}`"
  157. >
  158. <view class="matrix_icon_box displayFlexCol">
  159. <text
  160. :style="{
  161. width: fn.getWidth(item.MatrixQuestionList[0].QuestionItemList.length) + '%',
  162. }"
  163. >{{ childItem.Question }}</text
  164. >
  165. <view class="matrix_options displayFlexBetween">
  166. <block
  167. v-for="(sunItem, sunIndex) in childItem.QuestionItemList"
  168. :key="`${item.QuestType}-${index}-${childIndex}-${sunIndex}`"
  169. >
  170. <view
  171. class="displayFlexRow"
  172. :data-index="index"
  173. :data-childindex="childIndex"
  174. :data-sunindex="sunIndex"
  175. @click="choiceMatrixOption"
  176. >
  177. <!-- 矩阵单选/矩阵量表 -->
  178. <image
  179. :src="
  180. fn.answer(childItem, sunItem.ItemId)
  181. ? icon.satisfaction.circle_active
  182. : icon.satisfaction.circle
  183. "
  184. mode=""
  185. v-if="item.QuestType == 'MatrixRadio' || item.QuestType == 'MatrixScale'"
  186. />
  187. <!-- 矩阵多选 -->
  188. <image
  189. :src="
  190. fn.answer(childItem, sunItem.ItemId)
  191. ? icon.satisfaction.checkBox_circle_active
  192. : icon.satisfaction.checkBox_circle
  193. "
  194. mode=""
  195. v-if="item.QuestType == 'MatrixCheckbox'"
  196. />
  197. </view>
  198. </block>
  199. </view>
  200. </view>
  201. </block>
  202. </view>
  203. <!-- 上传文件题 -->
  204. <view class="ques_options displayFlexCol" v-if="item.QuestType == 'UploadImage'">
  205. <view class="img_list displayFlexRow">
  206. <image
  207. class="add_img"
  208. mode=""
  209. :src="icon.satisfaction.add"
  210. :data-index="index"
  211. @click="choiceFile"
  212. />
  213. <block
  214. v-for="(imgItem, imgIndex) in item.AnswerList"
  215. :key="`UploadImage-${index}-${imgIndex}`"
  216. >
  217. <view class="add_img">
  218. <image class="item_img" :src="imgItem" mode="" />
  219. <image
  220. class="cha_img"
  221. :src="icon.satisfaction.cha_green"
  222. mode=""
  223. :data-index="index"
  224. :data-imgitem="imgItem"
  225. @click="closeImg"
  226. />
  227. </view>
  228. </block>
  229. </view>
  230. <view class="add_img_tips p_flexStart">
  231. <text>限制:</text>
  232. <text> 仅支持图片上传、</text>
  233. <text>
  234. 大小不超过{{ item.RuleInfo.FileSize }}M数量不超过{{ item.RuleInfo.FileCount }}个
  235. </text>
  236. </view>
  237. </view>
  238. <!-- 量表题 -->
  239. <view class="ques_options displayFlexRow" v-if="item.QuestType == 'Scale'">
  240. <block
  241. v-for="(childItem, childIndex) in item.QuestionItemList"
  242. :key="`Scale-${index}-${childIndex}`"
  243. >
  244. <view
  245. class="options_item_box displayFlexCol"
  246. :data-index="index"
  247. :data-childindex="childIndex"
  248. @click="choiceOption"
  249. >
  250. <text>{{ childItem.ItemName }}</text>
  251. <image
  252. :src="
  253. fn.answer(item, childItem.ItemId)
  254. ? icon.satisfaction.circle_active
  255. : icon.satisfaction.circle
  256. "
  257. mode=""
  258. />
  259. </view>
  260. </block>
  261. </view>
  262. </view>
  263. </block>
  264. </view>
  265. </scroll-view>
  266. <!-- <view class="yjfl" @click="yjfk">
  267. <image :src="icon.satisfaction.yjfk" alt="" style="width: 140rpx; height: 140rpx" />
  268. <view class="title"> 意见反馈 </view>
  269. </view> -->
  270. <view class="footer_box displayFlexRow">
  271. <text :class="complete ? 'backgroundCustom_D9' : ''" @click="submit">提交</text>
  272. </view>
  273. <!-- 是否实名弹窗 -->
  274. <view class="modal_wrap" v-if="showModal_Anonymous">
  275. <view class="modal_box">
  276. <view class="modal_tit">是否实名填写</view>
  277. <view class="modal_con">
  278. <view class="modal_box_b1" @click="isAnonymous(1)">实名填写</view>
  279. <view class="modal_box_b1" @click="isAnonymous(2)">匿名填写</view>
  280. </view>
  281. </view>
  282. </view>
  283. <!-- 是否实名弹窗 -->
  284. <view class="modal_wrap" v-if="showModal_User">
  285. <view class="modal_box">
  286. <view class="modal_tit">请选择答卷人</view>
  287. <view class="modal_con">
  288. <view class="modal_user_item" v-if="currentUser.memberName" @click="goSelMember">
  289. <view>
  290. <view>
  291. <text class="modal_t1">{{ currentUser.memberName }}</text>
  292. <text class="modal_t2">
  293. {{ currentUser.sex == 1 ? '男' : currentUser.sex == 2 ? '女' : '未知' }} |
  294. {{ currentUser.age }}岁
  295. </text>
  296. </view>
  297. <view class="modal_t3">{{ currentUser.mobile }}</view>
  298. </view>
  299. <image class="modal_user_right_img" :src="icon.satisfaction.right"></image>
  300. </view>
  301. <view class="modal_user_item" v-else @click="goSelMember">
  302. <view>点击选择答卷人</view>
  303. <image class="modal_user_right_img" :src="icon.satisfaction.right"></image>
  304. </view>
  305. <view class="modal_btn_wrap displayFlexBetween" v-if="currentUser.memberName">
  306. <view class="modal_btn modal_btn1" @click="goBack">取消</view>
  307. <view class="modal_btn modal_btn2" @click="confirmMember">确定</view>
  308. </view>
  309. </view>
  310. </view>
  311. </view>
  312. </view>
  313. </template>
  314. <script lang="ts" setup>
  315. import { reactive, ref } from 'vue';
  316. import { useOnLoad } from '@/hook';
  317. import { useDomain } from '@kasite/uni-app-base';
  318. import { mapGetters } from '@kasite/uni-app-base/store/hook';
  319. import {
  320. QuerySubjectListToChannelTask_V3,
  321. QuerySubjectInfoById_V3,
  322. UploadZxFile,
  323. CommitAnswer_V3,
  324. QuerySample_V3,
  325. QueryMemberByCard_V3,
  326. } from '../../service';
  327. import icon from '@/utils/icon';
  328. import { common, throttle } from '@/utils';
  329. import fn from './fn';
  330. const app = getApp();
  331. let time = null;
  332. const currentUser = ref({} as any);
  333. const taskId = ref('');
  334. const objType = ref('3'); // 3门诊 4住院
  335. const quesList = ref({} as any);
  336. const imgList = ref([]);
  337. const point = ref('');
  338. const complete = ref(false);
  339. const subtitleSatisfactionOptions = ['非常满意', '比较满意', '一般', '不太满意', '很不满意'];
  340. const subtitleSatisfaction = reactive({} as Record<string, number | null>);
  341. const anonymousType = ref(0);
  342. const showModal_Anonymous = ref(false); // 是否实名填写弹窗显示
  343. const showModal_User = ref(false); // 实名用户选择弹窗显示
  344. const pageParams = reactive({
  345. cardNo: '',
  346. cardType: '',
  347. sampleId: '',
  348. });
  349. let quesAnswers = reactive({
  350. MemberId: '',
  351. TaskId: '-1',
  352. SysAppId: 'visit',
  353. SubjectId: '',
  354. UserAgent: '',
  355. IP: '',
  356. Location: '',
  357. Mobile: '',
  358. UserName: '',
  359. Sex: '',
  360. Age: '',
  361. IdCard: '',
  362. ThirdPartyId: '',
  363. AnswerUseTime: 0,
  364. PushDept: '',
  365. PushDeptName: '',
  366. BedNo: '',
  367. HospitalNo: '',
  368. CardNo: '',
  369. CardType: '',
  370. SampleId: '',
  371. AnswerList: [],
  372. });
  373. let queryPatient = reactive({
  374. cardNo: '',
  375. cardType: ''
  376. });
  377. const getAgeByBirthDate = (birthDate = '') => {
  378. const birth = `${birthDate}`.replace(/\D/g, '').slice(0, 8);
  379. if (!/^\d{8}$/.test(birth)) return '';
  380. const year = Number(birth.slice(0, 4));
  381. const month = Number(birth.slice(4, 6));
  382. const day = Number(birth.slice(6, 8));
  383. const date = new Date(year, month - 1, day);
  384. if (date.getFullYear() !== year || date.getMonth() + 1 !== month || date.getDate() !== day) return '';
  385. const today = new Date();
  386. let age = today.getFullYear() - year;
  387. if (today.getMonth() + 1 < month || (today.getMonth() + 1 === month && today.getDate() < day)) {
  388. age--;
  389. }
  390. return age >= 0 ? `${age}` : '';
  391. };
  392. const getPatientInfoByIdCard = (idCard = '') => {
  393. const card = `${idCard}`.trim();
  394. if (!/^\d{17}[\dXx]$/.test(card)) return { sex: '', age: '' };
  395. const factors = [7, 9, 10, 5, 8, 4, 2, 1, 6, 3, 7, 9, 10, 5, 8, 4, 2];
  396. const checkCodes = ['1', '0', 'X', '9', '8', '7', '6', '5', '4', '3', '2'];
  397. const sum = factors.reduce((total, factor, index) => total + Number(card[index]) * factor, 0);
  398. if (checkCodes[sum % 11] !== card[17].toUpperCase()) return { sex: '', age: '' };
  399. const birth = card.slice(6, 14);
  400. const sexCode = Number(card.slice(16, 17));
  401. const age = getAgeByBirthDate(birth);
  402. if (!age) return { sex: '', age: '' };
  403. return {
  404. sex: sexCode % 2 === 1 ? '1' : '2',
  405. age,
  406. };
  407. };
  408. const { getCurrentUser } = mapGetters({
  409. getCurrentUser: 'getCurrentUser',
  410. });
  411. const main = async (options) => {
  412. currentUser.value = getCurrentUser();
  413. pageParams.cardNo = options.cardno || options.cardNo || '';
  414. pageParams.cardType = options.cardtype || options.cardType || '';
  415. pageParams.sampleId = options.sampleId || options.SampleId || '';
  416. const params = {
  417. SubjectId: options.subjectId,
  418. TaskId: options.taskId,
  419. };
  420. const resp = await QuerySubjectListToChannelTask_V3(params);
  421. if (!common.isEmpty(resp)) {
  422. objType.value = resp[0].GroupType;
  423. //匿名有3种传参 ""(空) "true" "false" 转换字符串为布尔值
  424. let anonymous =
  425. resp[0].Anonymous === 'false'
  426. ? false
  427. : resp[0].Anonymous === 'true'
  428. ? true
  429. : resp[0].Anonymous || '';
  430. // type 1实名 2:匿名 3自行选择
  431. anonymousType.value = anonymous === '' ? 3 : anonymous === false ? 1 : 2;
  432. showModal_Anonymous.value = anonymous == 3 ? true : false;
  433. taskId.value = options.taskId;
  434. quesAnswers.SubjectId = options.subjectId;
  435. //如果不是执行选择直接调用对应填写按钮
  436. if (anonymous != 3) {
  437. isAnonymous(anonymousType.value);
  438. }
  439. await querySubjectInfoById_V3();
  440. // 查询样本和答案
  441. // await querySample_V3();
  442. // 开始计算答卷时间
  443. getSec();
  444. if(options?.type == "sms_myddc") {
  445. currentUser.value.cardNo = pageParams.cardNo
  446. currentUser.value.cardType = pageParams.cardType
  447. showModal_Anonymous.value = false
  448. showModal_User.value = false
  449. }
  450. } else {
  451. common.showModal('该任务已失效', () => {
  452. common.goToUrl(`/pages/business/tabbar/homePage/homePage`, { skipWay: 'reLaunch' });
  453. });
  454. return;
  455. }
  456. };
  457. /** 实名/匿名 */
  458. const isAnonymous = (type) => {
  459. //实名
  460. if (type == 1) {
  461. showModal_Anonymous.value = false;
  462. showModal_User.value = true;
  463. }
  464. //匿名
  465. else {
  466. // currentUser.value = {};
  467. showModal_Anonymous.value = false;
  468. }
  469. };
  470. /** 问卷详情 */
  471. const querySubjectInfoById_V3 = async () => {
  472. const resp = await QuerySubjectInfoById_V3({
  473. SubjectId: quesAnswers.SubjectId,
  474. });
  475. if (common.isNotEmpty(resp)) {
  476. if (resp[0].Status != 0) {
  477. common.showModal('该问卷已失效', () => {
  478. common.navigateBack(1);
  479. });
  480. return;
  481. }
  482. if (resp[0].State != 1) {
  483. common.showModal('该问卷未发布', () => {
  484. common.navigateBack(1);
  485. });
  486. return;
  487. }
  488. // 提交答案数据模版
  489. quesAnswers.PushDept = resp[0].DeptId;
  490. quesAnswers.PushDeptName = resp[0].PushDeptName;
  491. resp[0].QuestionList.forEach((item, index) => {
  492. item.AnswerList = [];
  493. item.MustQuest = item.MustQuest == 'false' ? false : true;
  494. item.RuleInfo = item.RuleInfo != '' ? JSON.parse(item.RuleInfo) : '';
  495. // 多选框
  496. if (item.QuestType == 'Select') {
  497. item.AnswerList = 0;
  498. }
  499. if (common.isNotEmpty(item.MatrixQuestionList)) {
  500. item.MatrixQuestionList.forEach((childItem) => {
  501. childItem.AnswerList = [];
  502. childItem.RuleInfo = childItem.RuleInfo != '' ? JSON.parse(childItem.RuleInfo) : '';
  503. // 答案列表模版
  504. let answerItem = {
  505. Answer: [],
  506. Blank: index,
  507. QuestId: childItem.QuestId,
  508. QuestType: item.QuestType,
  509. MustQuest: item.MustQuest,
  510. };
  511. quesAnswers.AnswerList.push(answerItem);
  512. if (common.isNotEmpty(childItem.QuestionItemList)) {
  513. childItem.QuestionItemList.forEach((sunItem) => {
  514. sunItem.Check = false;
  515. });
  516. }
  517. });
  518. } else {
  519. // 答案列表模版
  520. let answerItem = {
  521. Answer: [],
  522. Blank: index,
  523. QuestId: item.QuestId,
  524. QuestType: item.QuestType,
  525. MustQuest: item.MustQuest,
  526. };
  527. quesAnswers.AnswerList.push(answerItem);
  528. }
  529. });
  530. resp[0].QuestionList = bySort(resp[0].QuestionList);
  531. quesList.value = resp[0];
  532. }
  533. };
  534. /** 查询样本和答案 */
  535. const querySample_V3 = async () => {
  536. const resp = await QuerySample_V3({
  537. SubjectId: quesAnswers.SubjectId,
  538. IsGetAnswer: true,
  539. ThirdPartyId: currentUser.MemberId,
  540. State: 1
  541. });
  542. if (common.isNotEmpty(resp)) {
  543. quesList.value.QuestionList.forEach((item) => {
  544. resp[0].AnswerList.forEach((childItem) => {
  545. if(item.QuestId == childItem.QuestId) {
  546. if(item.QuestType == "Input") {
  547. item.AnswerList = childItem.Answer
  548. }
  549. if(item.QuestType == "UploadImage") {
  550. item.AnswerList = childItem.Answer.split(",")
  551. }
  552. if(common.isNotEmpty(item.QuestionItemList)) {
  553. if(item.QuestType == "Select"){
  554. item.QuestionItemList.forEach((sunItem,sunIndex) => {
  555. if(sunItem.ItemId == childItem.Answer) {
  556. item.AnswerList = sunIndex
  557. }
  558. })
  559. }else {
  560. item.AnswerList = childItem.Answer.split(",")
  561. }
  562. }
  563. }
  564. if(common.isNotEmpty(item.MatrixQuestionList)) {
  565. item.MatrixQuestionList.forEach((sunItem) => {
  566. if(sunItem.QuestId == childItem.QuestId) {
  567. if(sunItem.QuestType == "MatrixInput") {
  568. sunItem.AnswerList = childItem.Answer
  569. }
  570. if(sunItem.QuestType == "MatrixCheckbox" || sunItem.QuestType == "MatrixRadio" || sunItem.QuestType == "MatrixScale") {
  571. sunItem.AnswerList = childItem.Answer.split(",")
  572. }
  573. }
  574. })
  575. }
  576. })
  577. })
  578. complete.value = true;
  579. }
  580. }
  581. /** 计算答题时间 */
  582. const getSec = () => {
  583. time = setTimeout(() => {
  584. let answerUseTime = quesAnswers.AnswerUseTime;
  585. answerUseTime++;
  586. quesAnswers.AnswerUseTime = answerUseTime;
  587. getSec();
  588. }, 1000);
  589. };
  590. /** 根据子标题排序 */
  591. const bySort = (list: any[]) => {
  592. let find = 0;
  593. let sort = 0;
  594. let currentSubTitleIndex = -1;
  595. let currentSubTitleItem = null as any;
  596. let item = {} as any;
  597. for (var t = 0; t < list.length; t++) {
  598. item = list[t];
  599. //子标题
  600. if (item.QuestType == 'SubTitle') {
  601. //将子标题底下的题目从1开始排
  602. sort = 0;
  603. //判断是出现的第几个子标题
  604. //num是子标题的排序
  605. item.SubTitleIndex = find;
  606. item.HasScaleInSubtitle = false;
  607. currentSubTitleIndex = find;
  608. currentSubTitleItem = item;
  609. item.Num = toChinesNum(find + 1);
  610. find++;
  611. } else {
  612. //sort是子标题底下的排序
  613. item.SubTitleIndex = currentSubTitleIndex;
  614. item.Sort = sort + 1;
  615. sort++;
  616. if (item.QuestType == 'Scale' && currentSubTitleItem) {
  617. currentSubTitleItem.HasScaleInSubtitle = true;
  618. }
  619. }
  620. item.SortNum = t;
  621. if (common.isNotEmpty(item.QuestionItemList)) {
  622. item.QuestionItemList.forEach((childItem, childIndex) => {
  623. childItem.SortNum = childIndex;
  624. if (common.isNotEmpty(childItem.QuestionItem)) {
  625. childItem.QuestionItem.forEach((sunItem, sunIndex) => {
  626. sunItem.SortNum = sunIndex;
  627. });
  628. }
  629. });
  630. }
  631. }
  632. return list;
  633. };
  634. /** 汉字顺序 */
  635. const toChinesNum = (num) => {
  636. var changeNum = ['一', '二', '三', '四', '五', '六', '七', '八', '九', '十'],
  637. newNum = '',
  638. arr = num.toString().split('');
  639. arr[0] = parseInt(arr[0]) - 1;
  640. if (arr[0] == -1 && arr.length == 1) {
  641. return '零';
  642. }
  643. if (arr.length > 1) {
  644. arr[1] = parseInt(arr[1]) - 1;
  645. if (!arr[0]) {
  646. newNum = !arr[0] && arr[1] == -1 ? changeNum[9] : changeNum[9] + changeNum[arr[1]];
  647. } else {
  648. newNum = changeNum[arr[0]] + changeNum[9] + (changeNum[arr[1]] ? changeNum[arr[1]] : '');
  649. }
  650. } else {
  651. newNum = changeNum[arr[0]];
  652. }
  653. return newNum;
  654. };
  655. /** 单选/多选/量表 */
  656. const isSubtitleScaleExpanded = (subtitleIndex) => {
  657. return Number(subtitleSatisfaction[subtitleIndex]) > 0;
  658. };
  659. const isSubtitleSatisfactionActive = (subtitleIndex, childIndex) => {
  660. return Number(subtitleSatisfaction[subtitleIndex]) === Number(childIndex);
  661. };
  662. const isQuestionHidden = (item) => {
  663. return item?.QuestType == 'Scale' && item.SubTitleIndex > -1 && !isSubtitleScaleExpanded(item.SubTitleIndex);
  664. };
  665. const getAnswerIndex = (answerList, questId) => {
  666. let answerIndex = -1;
  667. answerList.forEach((item, index) => {
  668. if (item.QuestId == questId) {
  669. answerIndex = index;
  670. }
  671. });
  672. return answerIndex;
  673. };
  674. const setSingleQuestionAnswer = (question, answerList, childIndex) => {
  675. if (!question?.QuestionItemList?.[childIndex]) return;
  676. const answerIndex = getAnswerIndex(answerList, question.QuestId);
  677. const answer = question.QuestionItemList[childIndex].ItemId;
  678. question.AnswerList = [answer];
  679. if (answerIndex > -1) {
  680. answerList[answerIndex].Answer = answer;
  681. }
  682. };
  683. const choiceSubtitleSatisfaction = (e) => {
  684. const subtitleIndex = Number(e.currentTarget.dataset.subtitleindex);
  685. const childIndex = Number(e.currentTarget.dataset.childindex);
  686. const questionList = quesList.value.QuestionList;
  687. const answerList = quesAnswers.AnswerList;
  688. subtitleSatisfaction[subtitleIndex] = childIndex;
  689. if (childIndex == 0) {
  690. questionList.forEach((item) => {
  691. if (item.SubTitleIndex == subtitleIndex && item.QuestType == 'Scale') {
  692. setSingleQuestionAnswer(item, answerList, 0);
  693. }
  694. });
  695. }
  696. quesList.value.QuestionList = questionList;
  697. quesAnswers.AnswerList = answerList;
  698. };
  699. const choiceOption = (e) => {
  700. let index = e.currentTarget.dataset.index;
  701. let childIndex = e.currentTarget.dataset.childindex;
  702. let answerIndex = 0;
  703. let questionList = quesList.value.QuestionList;
  704. let answerList = quesAnswers.AnswerList;
  705. answerList.forEach((itm, ind) => {
  706. if (itm.QuestId == questionList[index].QuestId) {
  707. answerIndex = ind;
  708. }
  709. });
  710. // 单选/量表
  711. if (questionList[index].QuestType == 'Radio' || questionList[index].QuestType == 'Scale') {
  712. if (
  713. questionList[index].AnswerList[0] != questionList[index].QuestionItemList[childIndex].ItemId
  714. ) {
  715. questionList[index].AnswerList = [];
  716. questionList[index].AnswerList.push(questionList[index].QuestionItemList[childIndex].ItemId);
  717. }
  718. answerList[answerIndex].Answer = questionList[index].QuestionItemList[childIndex].ItemId;
  719. }
  720. // 多选
  721. else if (questionList[index].QuestType == 'Checkbox') {
  722. let flag = false;
  723. questionList[index].AnswerList.forEach((item) => {
  724. if (item == questionList[index].QuestionItemList[childIndex].ItemId) {
  725. flag = true;
  726. }
  727. });
  728. if (flag) {
  729. questionList[index].AnswerList = questionList[index].AnswerList.filter((item) => {
  730. return item != questionList[index].QuestionItemList[childIndex].ItemId;
  731. });
  732. answerList[answerIndex].Answer = answerList[answerIndex].Answer.filter((fiItem) => {
  733. return fiItem != questionList[index].QuestionItemList[childIndex].ItemId;
  734. });
  735. } else {
  736. if (questionList[index].RuleInfo.MaxLength < questionList[index].AnswerList.length + 1) {
  737. common.showModal('最多选择' + questionList[index].RuleInfo.MaxLength + '项');
  738. return;
  739. }
  740. questionList[index].AnswerList.push(questionList[index].QuestionItemList[childIndex].ItemId);
  741. answerList[answerIndex].Answer.push(questionList[index].QuestionItemList[childIndex].ItemId);
  742. }
  743. }
  744. quesList.value.QuestionList = questionList;
  745. quesAnswers.AnswerList = answerList;
  746. };
  747. /** 选择题 */
  748. const bindPickerChange = (e) => {
  749. let index = e.currentTarget.dataset.index;
  750. let val = e.detail.value;
  751. let questionList = quesList.value.QuestionList;
  752. let answerList = quesAnswers.AnswerList;
  753. let answerIndex = 0;
  754. answerList.forEach((itm, ind) => {
  755. if (itm.QuestId == questionList[index].QuestId) {
  756. answerIndex = ind;
  757. }
  758. });
  759. questionList[index].AnswerList = val;
  760. answerList[answerIndex].Answer = questionList[index].QuestionItemList[val].ItemId;
  761. quesList.value.QuestionList = questionList;
  762. quesAnswers.AnswerList = answerList;
  763. };
  764. /** 矩阵单选 */
  765. const choiceMatrixOption = (e) => {
  766. let index = e.currentTarget.dataset.index;
  767. let childIndex = e.currentTarget.dataset.childindex;
  768. let sunIndex = e.currentTarget.dataset.sunindex;
  769. let questionList = quesList.value.QuestionList;
  770. let answerList = quesAnswers.AnswerList;
  771. let answerIndex = 0;
  772. answerList.forEach((itm, ind) => {
  773. if (itm.QuestId == questionList[index].MatrixQuestionList[childIndex].QuestId) {
  774. answerIndex = ind;
  775. }
  776. });
  777. // 矩阵单选/矩阵量表
  778. if (
  779. questionList[index].QuestType == 'MatrixRadio' ||
  780. questionList[index].QuestType == 'MatrixScale'
  781. ) {
  782. if (
  783. questionList[index].MatrixQuestionList[childIndex].AnswerList[0] !=
  784. questionList[index].MatrixQuestionList[childIndex].QuestionItemList[sunIndex].ItemId
  785. ) {
  786. questionList[index].MatrixQuestionList[childIndex].AnswerList = [];
  787. questionList[index].MatrixQuestionList[childIndex].AnswerList.push(
  788. questionList[index].MatrixQuestionList[childIndex].QuestionItemList[sunIndex].ItemId
  789. );
  790. }
  791. answerList[answerIndex].Answer =
  792. questionList[index].MatrixQuestionList[childIndex].QuestionItemList[sunIndex].ItemId;
  793. }
  794. // 矩阵多选
  795. else if (questionList[index].QuestType == 'MatrixCheckbox') {
  796. let flag = false;
  797. questionList[index].MatrixQuestionList[childIndex].AnswerList.forEach((item) => {
  798. if (
  799. item == questionList[index].MatrixQuestionList[childIndex].QuestionItemList[sunIndex].ItemId
  800. ) {
  801. flag = true;
  802. }
  803. });
  804. if (flag) {
  805. questionList[index].MatrixQuestionList[childIndex].AnswerList = questionList[
  806. index
  807. ].MatrixQuestionList[childIndex].AnswerList.filter((item) => {
  808. return (
  809. item !=
  810. questionList[index].MatrixQuestionList[childIndex].QuestionItemList[sunIndex].ItemId
  811. );
  812. });
  813. answerList[answerIndex].Answer = answerList[answerIndex].Answer.filter((fiItem) => {
  814. return (
  815. fiItem !=
  816. questionList[index].MatrixQuestionList[childIndex].QuestionItemList[sunIndex].ItemId
  817. );
  818. });
  819. } else {
  820. questionList[index].MatrixQuestionList[childIndex].AnswerList.push(
  821. questionList[index].MatrixQuestionList[childIndex].QuestionItemList[sunIndex].ItemId
  822. );
  823. answerList[answerIndex].Answer.push(
  824. questionList[index].MatrixQuestionList[childIndex].QuestionItemList[sunIndex].ItemId
  825. );
  826. }
  827. }
  828. quesList.value.QuestionList = questionList;
  829. quesAnswers.AnswerList = answerList;
  830. };
  831. /** 选择文件 */
  832. const choiceFile = (e) => {
  833. let index = e.currentTarget.dataset.index;
  834. let questionList = quesList.value.QuestionList;
  835. let answerList = quesAnswers.AnswerList;
  836. let answerIndex = 0;
  837. answerList.forEach((itm, ind) => {
  838. if (itm.QuestId == questionList[index].QuestId) {
  839. answerIndex = ind;
  840. }
  841. });
  842. if (answerList[answerIndex].Answer.length >= questionList[index].RuleInfo.FileCount) {
  843. common.showModal('最多上传' + questionList[index].RuleInfo.FileCount + '张图片');
  844. return;
  845. }
  846. uni.chooseImage({
  847. count: questionList[index].RuleInfo.FileCount,
  848. sourceType: ['album', 'camera'],
  849. sizeType: ['compressed'],
  850. async success(res) {
  851. uni.showLoading({
  852. title: '上传中。。。',
  853. });
  854. for (var i = 0; i < res.tempFiles.length; i++) {
  855. let m = 1024 * 1024;
  856. if (res.tempFiles[i].size < m) {
  857. let imgUrl = (await uploadFile(
  858. res.tempFilePaths[i],
  859. questionList[index].RuleInfo.FileCount,
  860. answerList[answerIndex].Answer
  861. )) as string;
  862. if (common.isNotEmpty(imgUrl)) {
  863. imgUrl =
  864. imgUrl.indexOf('http') > -1 ? imgUrl : `${useDomain()}/${imgUrl.replace(/\\/g, '/')}`;
  865. answerList[answerIndex].Answer.push(imgUrl);
  866. questionList[index].AnswerList = answerList[answerIndex].Answer;
  867. quesList.value.QuestionList = questionList;
  868. quesAnswers.AnswerList = answerList;
  869. if (res.tempFiles.length - 1 == i) {
  870. uni.hideLoading();
  871. }
  872. }
  873. } else {
  874. uni.hideLoading();
  875. common.showModal('文件不得大于' + questionList[index].RuleInfo.FileSize + 'M');
  876. return;
  877. }
  878. }
  879. },
  880. });
  881. };
  882. /** 上传文件 */
  883. const uploadFile = (imgItem, fileCount, imgList) => {
  884. return new Promise((resolve, reject) => {
  885. if (imgList.length >= fileCount) {
  886. uni.hideLoading();
  887. common.showModal('最多上传' + fileCount + '张图片');
  888. return;
  889. }
  890. // 将图片上传至服务器
  891. uni.uploadFile({
  892. url: UploadZxFile,
  893. filePath: imgItem,
  894. name: 'newsFile',
  895. formData: {
  896. user: 'test',
  897. },
  898. header: {
  899. token: uni.getStorageSync('token'),
  900. },
  901. data: {},
  902. success(res) {
  903. const data = JSON.parse(res.data);
  904. if (data.RespCode == '10000') {
  905. resolve(data.url);
  906. } else {
  907. common.showModal(data.msg);
  908. }
  909. }
  910. });
  911. });
  912. };
  913. /** 删除图片 */
  914. const closeImg = (e) => {
  915. let index = e.currentTarget.dataset.index;
  916. let imgItem = e.currentTarget.dataset.imgitem;
  917. let questionList = quesList.value.QuestionList;
  918. let answerList = quesAnswers.AnswerList;
  919. let answerIndex = 0;
  920. answerList.forEach((itm, ind) => {
  921. if (itm.QuestId == questionList[index].QuestId) {
  922. answerIndex = ind;
  923. }
  924. });
  925. answerList[answerIndex].Answer = answerList[answerIndex].Answer.filter((item) => {
  926. return item != imgItem;
  927. });
  928. questionList[index].AnswerList = answerList[answerIndex].Answer;
  929. quesList.value.QuestionList = questionList;
  930. quesAnswers.AnswerList = answerList;
  931. };
  932. /** 获取input值 */
  933. const setVal = (e) => {
  934. let index = e.currentTarget.dataset.index;
  935. let childIndex = e.currentTarget.dataset.childindex;
  936. let questionList = quesList.value.QuestionList;
  937. let answerList = quesAnswers.AnswerList;
  938. let answerIndex = 0;
  939. // 矩阵填空题
  940. if (questionList[index].QuestType == 'MatrixInput') {
  941. if (
  942. questionList[index].MatrixQuestionList[childIndex].AnswerList.length ==
  943. questionList[index].MatrixQuestionList[childIndex].RuleInfo.MaxLength
  944. ) {
  945. common.showToast(
  946. '最多输入' + questionList[index].MatrixQuestionList[childIndex].RuleInfo.MaxLength + '个字'
  947. );
  948. return;
  949. }
  950. answerList.forEach((itm, ind) => {
  951. if (itm.QuestId == questionList[index].MatrixQuestionList[childIndex].QuestId) {
  952. answerIndex = ind;
  953. }
  954. });
  955. questionList[index].MatrixQuestionList[childIndex].AnswerList = e.detail.value;
  956. }
  957. // 填空题
  958. else {
  959. if (questionList[index].RuleInfo.DataType != '无') {
  960. let dataTypeOptions = questionList[index].RuleInfo.DataTypeOptions;
  961. for (var i = 0; i < dataTypeOptions.length; i++) {
  962. if (questionList[index].RuleInfo.DataType == dataTypeOptions[i].Value) {
  963. const regRule = dataTypeOptions[i].Rule;
  964. let reg = null;
  965. if (regRule.startsWith('/') && regRule.endsWith('/')) {
  966. reg = new RegExp(regRule.slice(1, -1));
  967. } else {
  968. reg = new RegExp(regRule);
  969. }
  970. if (!reg.test(e.detail.value)) {
  971. common.showModal('请输入' + dataTypeOptions[i].Text);
  972. questionList[index].AnswerList = '';
  973. answerList[answerIndex].Answer = '';
  974. this.setData({
  975. 'quesList.QuestionList': questionList,
  976. 'quesAnswers.AnswerList': answerList,
  977. });
  978. return;
  979. }
  980. }
  981. }
  982. }
  983. if (questionList[index].AnswerList.length == questionList[index].RuleInfo.MaxLength) {
  984. common.showToast('最多输入' + questionList[index].RuleInfo.MaxLength + '个字');
  985. return;
  986. }
  987. answerList.forEach((itm, ind) => {
  988. if (itm.QuestId == questionList[index].QuestId) {
  989. answerIndex = ind;
  990. }
  991. });
  992. questionList[index].AnswerList = e.detail.value;
  993. }
  994. answerList[answerIndex].Answer = e.detail.value;
  995. quesList.value.QuestionList = questionList;
  996. quesAnswers.AnswerList = answerList;
  997. };
  998. /** 提交 */
  999. const validateSubtitleSatisfaction = () => {
  1000. const questionList = quesList.value.QuestionList || [];
  1001. for (var i = 0; i < questionList.length; i++) {
  1002. const item = questionList[i];
  1003. if (
  1004. item.QuestType == 'SubTitle' &&
  1005. item.HasScaleInSubtitle &&
  1006. subtitleSatisfaction[item.SubTitleIndex] == null
  1007. ) {
  1008. common.showToast('存在未填写的问卷');
  1009. point.value = 'p' + i;
  1010. return false;
  1011. }
  1012. }
  1013. return true;
  1014. };
  1015. const submit = () => {
  1016. throttle(async () => {
  1017. await common.sleep(1000);
  1018. if (complete.value) return;
  1019. if (!validateSubtitleSatisfaction()) return;
  1020. uni.showLoading();
  1021. const answers = { ...quesAnswers } as any;
  1022. for (var i = 0; i < answers.AnswerList.length; i++) {
  1023. let item = answers.AnswerList[i];
  1024. if (item.MustQuest && common.isEmpty(item.Answer)) {
  1025. common.showToast('存在未填写的问卷');
  1026. point.value = 'p' + item.Blank;
  1027. return;
  1028. }
  1029. }
  1030. answers.AnswerList.forEach((item) => {
  1031. if (typeof item.Answer == 'object') {
  1032. item.Answer = item.Answer.join();
  1033. }
  1034. });
  1035. const cardNo = pageParams.cardNo || currentUser.value?.cardNo || '';
  1036. const cardType = pageParams.cardType || currentUser.value?.cardType || '';
  1037. let mobile = currentUser.value?.mobile ?? '';
  1038. let memberName = currentUser.value?.memberName ?? '';
  1039. let sex = currentUser.value?.sex ?? '';
  1040. let age = currentUser.value?.age ?? '';
  1041. let idCard = currentUser.value?.idCard ?? currentUser.value?.certNum ?? '';
  1042. let memberId = currentUser.value?.MemberId ?? currentUser.value?.memberId ?? cardNo ?? '';
  1043. queryPatient.cardNo = cardNo;
  1044. queryPatient.cardType = cardType;
  1045. let patientInfoRes = await QueryMemberByCard_V3(queryPatient);
  1046. let patientInfo = patientInfoRes.resData;
  1047. if (!patientInfo) {
  1048. uni.hideLoading();
  1049. return;
  1050. }
  1051. if (patientInfo.RespCode === '10000' && patientInfo.Data && patientInfo.Data.length > 0) {
  1052. const patient = patientInfo.Data[0];
  1053. const patientIdCard = patient.idCard || patient.idcard || patient.certNum || '';
  1054. const patientInfoByIdCard = getPatientInfoByIdCard(patientIdCard);
  1055. mobile = patient.mobile || mobile;
  1056. memberName = patient.memberName || memberName;
  1057. sex = patient.sex || patientInfoByIdCard.sex || sex;
  1058. age = currentUser.value?.age || getAgeByBirthDate(patient.birthDate) || patientInfoByIdCard.age || age;
  1059. idCard = patientIdCard || idCard;
  1060. memberId = patient.hisMemberId || patient.memberId || memberId;
  1061. }
  1062. answers.AnswerList = JSON.stringify(quesAnswers.AnswerList);
  1063. // quesAnswers.IP = (await getIP()).cip;
  1064. // quesAnswers.Location = (await getIP()).cname;
  1065. quesAnswers.UserAgent = app.globalData.smallPro_systemInfo;
  1066. quesAnswers.Mobile = mobile;
  1067. quesAnswers.UserName = memberName;
  1068. quesAnswers.MemberId = memberId;
  1069. quesAnswers.Sex = sex;
  1070. quesAnswers.Age = age;
  1071. quesAnswers.IdCard = idCard;
  1072. quesAnswers.ThirdPartyId = memberId || uni.getStorageSync('openid');
  1073. quesAnswers.BedNo = '';
  1074. quesAnswers.HospitalNo = objType.value == '4' ? cardNo : '';
  1075. quesAnswers.CardNo = objType.value == '3' ? cardNo : '';
  1076. quesAnswers.TaskId = taskId.value;
  1077. quesAnswers.CardType = objType.value == '3' ? cardType : '';
  1078. quesAnswers.SampleId = pageParams.sampleId;
  1079. let res = await CommitAnswer_V3(quesAnswers);
  1080. clearTimeout(time);
  1081. if (common.isNotEmpty(res)) {
  1082. common.showModal('提交成功!', () => {
  1083. common.navigateBack(1);
  1084. });
  1085. }
  1086. }, 5 * 1000);
  1087. };
  1088. /** 获取IP */
  1089. const getIP = () => {
  1090. return new Promise((resolve, reject) => {
  1091. uni.request({
  1092. url: 'https://pv.sohu.com/cityjson?ie=utf-8',
  1093. success: (res: any) => {
  1094. const result = res.data.substring(res.data.indexOf('{'), res.data.lastIndexOf('}') + 1);
  1095. const obj = JSON.parse(result);
  1096. resolve(obj);
  1097. },
  1098. });
  1099. }) as Promise<any>;
  1100. };
  1101. const goBack = () => {
  1102. uni.navigateBack({
  1103. delta: 1,
  1104. });
  1105. };
  1106. const yjfk = () => {};
  1107. const goSelMember = () => {};
  1108. const confirmMember = () => {};
  1109. useOnLoad((options) => {
  1110. main(options);
  1111. });
  1112. </script>
  1113. <style lang="scss" scoped>
  1114. .align_items_left {
  1115. align-items: flex-start;
  1116. }
  1117. .active_option {
  1118. background: #18ba89 !important;
  1119. color: white !important;
  1120. }
  1121. .mask_form {
  1122. width: 100%;
  1123. height: 100%;
  1124. position: absolute;
  1125. top: 0;
  1126. left: 0;
  1127. z-index: 100;
  1128. }
  1129. .container {
  1130. overflow: hidden;
  1131. }
  1132. .scroll_view {
  1133. height: 100%;
  1134. }
  1135. .top_bg_box {
  1136. position: relative;
  1137. image {
  1138. width: 100%;
  1139. height: 456rpx;
  1140. position: absolute;
  1141. top: 0;
  1142. left: 0;
  1143. z-index: 1;
  1144. }
  1145. .ques_introduce {
  1146. padding: 46rpx 52rpx 0 52rpx;
  1147. box-sizing: border-box;
  1148. position: absolute;
  1149. top: 0;
  1150. left: 0;
  1151. z-index: 2;
  1152. text:nth-child(1) {
  1153. font-size: 36rpx;
  1154. font-weight: bold;
  1155. color: white;
  1156. margin-bottom: 20rpx;
  1157. }
  1158. text:nth-child(2) {
  1159. line-height: 45rpx;
  1160. font-size: 28rpx;
  1161. color: white;
  1162. }
  1163. }
  1164. }
  1165. .main_box {
  1166. padding: 470rpx 30rpx 190rpx 30rpx;
  1167. box-sizing: border-box;
  1168. position: relative;
  1169. z-index: 2;
  1170. }
  1171. .ques_item_box {
  1172. padding: 30rpx;
  1173. box-sizing: border-box;
  1174. background: white;
  1175. border-radius: 20rpx;
  1176. margin-bottom: 32rpx;
  1177. > .ques_title_box > text {
  1178. line-height: 50rpx;
  1179. font-size: 36rpx;
  1180. font-weight: bold;
  1181. color: #1c1c1c;
  1182. }
  1183. .mustQuest_tag {
  1184. color: #dc2828;
  1185. }
  1186. }
  1187. .ques_options {
  1188. margin-top: 34rpx;
  1189. }
  1190. .choice_item {
  1191. width: 100%;
  1192. line-height: 80rpx;
  1193. font-size: 30rpx;
  1194. color: #686868;
  1195. text-align: center;
  1196. margin-bottom: 16rpx;
  1197. border-radius: 10rpx;
  1198. background: #f8f8fa;
  1199. &:last-child {
  1200. margin-bottom: 0;
  1201. }
  1202. }
  1203. .input_label {
  1204. line-height: 40rpx;
  1205. font-size: 32rpx;
  1206. color: #474747;
  1207. }
  1208. .textarea_box {
  1209. width: 100%;
  1210. padding: 20rpx;
  1211. box-sizing: border-box;
  1212. border-radius: 10rpx;
  1213. background: #f8f8fa;
  1214. margin-top: 22rpx;
  1215. textarea {
  1216. width: 100%;
  1217. }
  1218. }
  1219. .matrix_textarea_box {
  1220. width: 70%;
  1221. }
  1222. .picker_box {
  1223. width: 100%;
  1224. }
  1225. .picker {
  1226. width: 100%;
  1227. height: 80rpx;
  1228. padding: 22rpx;
  1229. box-sizing: border-box;
  1230. background: #f9f9f9;
  1231. border-radius: 20rpx;
  1232. justify-content: space-between;
  1233. text {
  1234. white-space: nowrap;
  1235. font-size: 28rpx;
  1236. color: #686868;
  1237. }
  1238. image {
  1239. width: 12rpx;
  1240. height: 24rpx;
  1241. }
  1242. }
  1243. .matrix_options {
  1244. width: 100%;
  1245. margin-bottom: 34rpx;
  1246. justify-content: space-between;
  1247. text {
  1248. font-size: 30rpx;
  1249. color: #1c1c1c;
  1250. text-align: center;
  1251. padding: 20rpx;
  1252. box-sizing: border-box;
  1253. word-wrap: break-word;
  1254. word-break: break-all;
  1255. }
  1256. }
  1257. .matrix_border {
  1258. border: 1px solid #f0f0f0;
  1259. }
  1260. .matrix_options_title {
  1261. background: #f5f5f5;
  1262. }
  1263. .matrix_icon_box {
  1264. width: 100%;
  1265. align-items: flex-start;
  1266. text {
  1267. font-size: 30rpx;
  1268. color: #1c1c1c;
  1269. margin-bottom: 36rpx;
  1270. padding: 0 20rpx;
  1271. box-sizing: border-box;
  1272. }
  1273. image {
  1274. width: 40rpx;
  1275. height: 40rpx;
  1276. }
  1277. }
  1278. .sub_title {
  1279. background: none;
  1280. }
  1281. .img_list {
  1282. width: 100%;
  1283. margin-bottom: 24rpx;
  1284. justify-content: flex-start;
  1285. flex-wrap: wrap;
  1286. .item_img {
  1287. width: 100%;
  1288. height: 100%;
  1289. }
  1290. }
  1291. .add_img {
  1292. width: 32%;
  1293. height: 200rpx;
  1294. margin-right: 2%;
  1295. margin-bottom: 3%;
  1296. position: relative;
  1297. &:nth-child(3n) {
  1298. margin-right: 0;
  1299. }
  1300. }
  1301. .add_img_tips {
  1302. width: 100%;
  1303. text {
  1304. font-size: 30rpx;
  1305. color: #474747;
  1306. }
  1307. }
  1308. .cha_img {
  1309. width: 50rpx;
  1310. height: 50rpx;
  1311. position: absolute;
  1312. top: -15rpx;
  1313. right: -5rpx;
  1314. }
  1315. .options_item_box {
  1316. width: 100%;
  1317. padding: 0 10rpx;
  1318. box-sizing: border-box;
  1319. margin-bottom: 20rpx;
  1320. justify-content: space-between;
  1321. text {
  1322. font-size: 28rpx;
  1323. color: #686868;
  1324. word-wrap: break-word;
  1325. word-break: break-all;
  1326. }
  1327. image {
  1328. width: 40rpx;
  1329. height: 40rpx;
  1330. margin: 20rpx 0;
  1331. }
  1332. }
  1333. .matrix_input_box {
  1334. width: 100%;
  1335. text {
  1336. width: 30%;
  1337. white-space: nowrap;
  1338. }
  1339. input {
  1340. width: 70%;
  1341. }
  1342. }
  1343. .footer_box {
  1344. width: 100%;
  1345. padding: 30rpx 30rpx 60rpx 30rpx;
  1346. box-sizing: border-box;
  1347. background: white;
  1348. position: fixed;
  1349. bottom: 0;
  1350. left: 0;
  1351. z-index: 10;
  1352. text {
  1353. width: 100%;
  1354. line-height: 88rpx;
  1355. font-size: 36rpx;
  1356. color: white;
  1357. text-align: center;
  1358. border-radius: 88rpx;
  1359. background: #18ba89;
  1360. display: block;
  1361. }
  1362. }
  1363. .modal_wrap {
  1364. width: 100%;
  1365. height: 100%;
  1366. background-color: rgba(0, 0, 0, 0.6);
  1367. position: fixed;
  1368. left: 0;
  1369. top: 0;
  1370. z-index: 99;
  1371. display: flex;
  1372. align-items: center;
  1373. justify-content: center;
  1374. }
  1375. .modal_box {
  1376. width: 600rpx;
  1377. max-height: 600rpx;
  1378. background-color: #fff;
  1379. border-radius: 5px;
  1380. padding: 40rpx 40rpx 60rpx;
  1381. }
  1382. .modal_tit {
  1383. text-align: center;
  1384. font-size: 30rpx;
  1385. }
  1386. .modal_box_b1 {
  1387. background-color: #f2f2f2;
  1388. border-radius: 5px;
  1389. line-height: 80rpx;
  1390. margin-top: 40rpx;
  1391. /* padding-left: 40rpx; */
  1392. text-align: center;
  1393. }
  1394. .modal_user_item {
  1395. background: #f2f2f2;
  1396. padding: 30rpx;
  1397. margin-top: 40rpx;
  1398. position: relative;
  1399. }
  1400. .modal_user_right_img {
  1401. width: 12rpx;
  1402. height: 21rpx;
  1403. position: absolute;
  1404. right: 30rpx;
  1405. top: 0;
  1406. bottom: 0;
  1407. margin: auto 0;
  1408. }
  1409. .modal_t1 {
  1410. font-weight: bold;
  1411. display: inline-block;
  1412. margin-right: 20rpx;
  1413. font-size: 32rpx;
  1414. }
  1415. .modal_t3 {
  1416. margin-top: 20rpx;
  1417. }
  1418. .modal_btn {
  1419. width: 46%;
  1420. line-height: 75rpx;
  1421. text-align: center;
  1422. border-radius: 50rpx;
  1423. margin-top: 40rpx;
  1424. }
  1425. .modal_btn1 {
  1426. background: #aaaaaa;
  1427. color: #fff;
  1428. }
  1429. .modal_btn2 {
  1430. background: #61c88f;
  1431. color: #fff;
  1432. }
  1433. .yjfl {
  1434. position: fixed;
  1435. bottom: 340rpx;
  1436. right: 0;
  1437. z-index: 100;
  1438. width: 160rpx;
  1439. text-align: center;
  1440. .title {
  1441. color: #fff;
  1442. position: absolute;
  1443. bottom: 10rpx;
  1444. right: 4rpx;
  1445. width: 100%;
  1446. text-align: center;
  1447. font-size: 24rpx;
  1448. }
  1449. }
  1450. </style>