index.vue 62 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172117311741175117611771178117911801181118211831184118511861187118811891190119111921193119411951196119711981199120012011202120312041205120612071208120912101211121212131214121512161217121812191220122112221223122412251226122712281229123012311232123312341235123612371238123912401241124212431244124512461247124812491250125112521253125412551256125712581259126012611262126312641265126612671268126912701271127212731274127512761277127812791280128112821283128412851286128712881289129012911292129312941295129612971298129913001301130213031304130513061307130813091310131113121313131413151316131713181319132013211322132313241325132613271328132913301331133213331334133513361337133813391340134113421343134413451346134713481349135013511352135313541355135613571358135913601361136213631364136513661367136813691370137113721373137413751376137713781379138013811382138313841385138613871388138913901391139213931394139513961397139813991400140114021403140414051406140714081409141014111412141314141415141614171418141914201421142214231424142514261427142814291430143114321433143414351436143714381439144014411442144314441445144614471448144914501451145214531454145514561457145814591460146114621463146414651466146714681469147014711472147314741475147614771478147914801481148214831484148514861487148814891490149114921493149414951496149714981499150015011502150315041505150615071508150915101511151215131514151515161517151815191520152115221523152415251526152715281529153015311532153315341535153615371538153915401541154215431544154515461547154815491550155115521553155415551556155715581559156015611562156315641565156615671568156915701571157215731574157515761577157815791580158115821583158415851586158715881589159015911592159315941595159615971598159916001601160216031604160516061607160816091610161116121613161416151616161716181619162016211622162316241625162616271628162916301631163216331634163516361637163816391640164116421643164416451646164716481649165016511652165316541655165616571658165916601661166216631664166516661667166816691670167116721673167416751676167716781679168016811682168316841685168616871688168916901691169216931694169516961697169816991700170117021703170417051706170717081709171017111712171317141715171617171718171917201721172217231724172517261727172817291730173117321733173417351736173717381739174017411742174317441745174617471748174917501751175217531754175517561757175817591760176117621763176417651766176717681769177017711772177317741775177617771778177917801781178217831784178517861787178817891790179117921793179417951796179717981799180018011802180318041805180618071808180918101811181218131814181518161817181818191820182118221823182418251826182718281829183018311832183318341835183618371838183918401841184218431844184518461847184818491850185118521853185418551856185718581859186018611862186318641865186618671868186918701871187218731874187518761877187818791880188118821883188418851886188718881889189018911892189318941895189618971898189919001901190219031904190519061907190819091910191119121913191419151916191719181919192019211922192319241925192619271928192919301931193219331934193519361937193819391940194119421943194419451946194719481949195019511952195319541955195619571958195919601961196219631964
  1. <template>
  2. <div class="m-container">
  3. <h2>
  4. <el-page-header
  5. @back="onCancel"
  6. content="VIP/乐理课申请"
  7. ></el-page-header>
  8. <!-- <div class="squrt" /> -->
  9. </h2>
  10. <div class="m-core">
  11. <div class="vipLeft">
  12. <el-alert
  13. title="课程信息"
  14. type="info"
  15. :closable="false"
  16. class="vipMsg"
  17. ></el-alert>
  18. <el-form
  19. ref="leftForm"
  20. :inline="true"
  21. :rules="leftFormRules"
  22. :label-position="labelPosition"
  23. label-width="110px"
  24. :model="leftForm"
  25. >
  26. <!-- <el-form-item label="课程名称" prop="name">
  27. <el-input v-model.trim="leftForm.name" />
  28. </el-form-item> -->
  29. <!-- :disabled="!leftForm.teacher || !leftForm.educationalTeacherId" -->
  30. <el-form-item label="课程分部" prop="classOrganId">
  31. <el-select
  32. v-model.trim="leftForm.classOrganId"
  33. filterable
  34. clearable
  35. @change="onClassChange"
  36. >
  37. <el-option
  38. v-for="(item, index) in selects.branchs"
  39. :key="index"
  40. :label="item.name"
  41. :value="item.id"
  42. />
  43. </el-select>
  44. </el-form-item>
  45. <el-form-item label="科目名称" prop="subject">
  46. <el-select
  47. v-model.trim="leftForm.subject"
  48. filterable
  49. clearable
  50. @change="changeSubject"
  51. :disabled="!leftForm.classOrganId"
  52. >
  53. <el-option
  54. v-for="(item, index) in subjectList"
  55. :key="index"
  56. :value="item.id"
  57. :label="item.name"
  58. />
  59. </el-select>
  60. </el-form-item>
  61. <!-- -->
  62. <el-form-item label="指导老师" prop="teacher">
  63. <el-select
  64. v-model.trim="leftForm.teacher"
  65. filterable
  66. clearable
  67. :disabled="!leftForm.subject"
  68. @change="setSection($event)"
  69. >
  70. <el-option
  71. v-for="(item, index) in teacherList"
  72. :key="index"
  73. :label="item.realName"
  74. :value="item.id"
  75. />
  76. </el-select>
  77. </el-form-item>
  78. <!-- @change="getClassOrgan()" -->
  79. <el-form-item label="乐团主管" prop="educationalTeacherId">
  80. <el-select
  81. v-model.trim="leftForm.educationalTeacherId"
  82. filterable
  83. clearable
  84. :disabled="!leftForm.subject"
  85. >
  86. <el-option
  87. v-for="(item, index) in educationList"
  88. :key="index"
  89. :label="item.userName"
  90. :value="item.userId"
  91. />
  92. </el-select>
  93. </el-form-item>
  94. <el-form-item label="课程形式" prop="courseType">
  95. <el-select
  96. v-model.trim="leftForm.courseType"
  97. clearable
  98. filterable
  99. :disabled="!leftForm.classOrganId || !leftForm.teacher"
  100. @change="changeType"
  101. >
  102. <el-option
  103. v-for="(item, index) in courseTypeList"
  104. :key="index"
  105. :label="item.name"
  106. :value="item.id"
  107. />
  108. </el-select>
  109. </el-form-item>
  110. <el-form-item label="教学点">
  111. <el-select
  112. v-model.trim="leftForm.section"
  113. filterable
  114. clearable
  115. :disabled="!leftForm.teacher"
  116. >
  117. <el-option
  118. v-for="(item, index) in scetionList"
  119. :key="index"
  120. :value="item.id"
  121. :label="item.name"
  122. />
  123. </el-select>
  124. </el-form-item>
  125. <el-form-item label="活动方案" prop="activeType" v-if="isMusicTheory">
  126. <el-select
  127. v-model.trim="leftForm.activeType"
  128. filterable
  129. clearable
  130. :disabled="!leftForm.courseType || isMusicTheory"
  131. @change="chioseActive"
  132. >
  133. <el-option
  134. v-for="(item, index) in activeList"
  135. :key="index"
  136. :value="item.id"
  137. :label="item.name"
  138. />
  139. </el-select>
  140. </el-form-item>
  141. <el-form-item
  142. label="活动方案"
  143. prop="activeType"
  144. v-else
  145. :rules="[
  146. {
  147. required: true,
  148. message: '请选择活动方案',
  149. trigger: 'change',
  150. },
  151. ]"
  152. >
  153. <el-select
  154. v-model.trim="leftForm.activeType"
  155. filterable
  156. clearable
  157. :disabled="!leftForm.courseType"
  158. @change="chioseActive"
  159. >
  160. <el-option
  161. v-for="(item, index) in activeList"
  162. :key="index"
  163. :value="item.id"
  164. :label="item.name"
  165. />
  166. </el-select>
  167. </el-form-item>
  168. <el-form-item label="每课时长">
  169. <el-select
  170. v-model.trim="leftForm.classTime"
  171. :disabled="timeTable.length > 0"
  172. >
  173. <el-option
  174. v-for="(item, index) in this.classTimeList"
  175. :key="index"
  176. :value="item"
  177. :label="item"
  178. ></el-option>
  179. </el-select>
  180. </el-form-item>
  181. <el-form-item label="报名开始时间" prop="signUpStart">
  182. <!-- @change="changeStartTime" -->
  183. <el-date-picker
  184. v-model.trim="leftForm.signUpStart"
  185. type="date"
  186. :picker-options="pickerOptions"
  187. value-format="yyyy-MM-dd HH:mm:ss"
  188. placeholder="请选择时间"
  189. />
  190. <!-- <el-date-picker
  191. v-model="leftForm.signTimer"
  192. type="daterange"
  193. range-separator="至"
  194. start-placeholder="开始日期"
  195. end-placeholder="结束日期"
  196. >
  197. </el-date-picker> -->
  198. </el-form-item>
  199. <el-form-item label="报名结束时间" prop="signUpEnd">
  200. <el-date-picker
  201. v-model.trim="leftForm.signUpEnd"
  202. type="date"
  203. :picker-options="pickerOptions1"
  204. value-format="yyyy-MM-dd HH:mm:ss"
  205. placeholder="请选择时间"
  206. />
  207. </el-form-item>
  208. <el-form-item label="上课学员" prop="students">
  209. <el-select
  210. v-model.trim="leftForm.students"
  211. collapse-tags
  212. multiple
  213. clearable
  214. placeholder="请输入上课学员"
  215. remote
  216. reserve-keyword
  217. @change="changeStudent"
  218. filterable
  219. :multiple-limit="studentLimit"
  220. :disabled="!leftForm.classOrganId || !leftForm.courseType"
  221. :remote-method="remoteMethod"
  222. :loading="remoteLoading"
  223. >
  224. <el-option
  225. v-for="item in studentList"
  226. :key="item.userId"
  227. :label="item.username"
  228. :value="item.userId"
  229. >
  230. <span style="float: left">{{ item.username }}</span>
  231. <span style="float: right; color: #8492a6; font-size: 13px">{{
  232. item.parentsPhone
  233. }}</span>
  234. </el-option>
  235. </el-select>
  236. </el-form-item>
  237. </el-form>
  238. </div>
  239. <div class="center">
  240. <el-alert
  241. title="排课设置"
  242. type="info"
  243. :closable="false"
  244. class="vipMsg"
  245. ></el-alert>
  246. <p class="submitP" v-if="minCourseNum&&maxCourseNum&&this.hotType == 'DISCOUNT'">
  247. 该活动最小课时数:<span style="color: red">{{ minCourseNum }}</span
  248. >节 最大课时数:<span style="color: red">{{ maxCourseNum }}</span
  249. >节
  250. </p>
  251. <el-form
  252. :inline="true"
  253. :model="centerForm"
  254. label-width="100px"
  255. :label-position="labelPosition"
  256. >
  257. <el-form-item v-if="leftForm.courseStart" label="最早排课时间">
  258. <el-date-picker
  259. v-model.trim="leftForm.courseStart"
  260. disabled
  261. type="date"
  262. value-format="yyyy-MM-dd HH:mm:ss"
  263. placeholder="请选择时间"
  264. />
  265. </el-form-item>
  266. <el-form-item v-if="leftForm.courseEnd" label="最晚排课时间">
  267. <el-date-picker
  268. v-model.trim="leftForm.courseEnd"
  269. disabled
  270. type="date"
  271. value-format="yyyy-MM-dd HH:mm:ss"
  272. placeholder="请选择时间"
  273. />
  274. </el-form-item>
  275. <el-form-item v-if="hasOnline" label="线上课数">
  276. <el-input
  277. v-model.trim="centerForm.onlineCourseNum"
  278. @mousewheel.native.prevent
  279. @input="onCourseNumChange('online')"
  280. type="number"
  281. >
  282. <template slot="append">节</template>
  283. </el-input>
  284. </el-form-item>
  285. <el-form-item v-if="hasOffline" label="线下课数">
  286. <el-input
  287. v-model.trim="centerForm.offlineCourseNum"
  288. @mousewheel.native.prevent
  289. @input="onCourseNumChange('offline')"
  290. type="number"
  291. >
  292. <template slot="append">节</template>
  293. </el-input>
  294. </el-form-item>
  295. <el-form-item label="待排课数">
  296. <el-input v-model.trim="allCourseCount" disabled>
  297. <template slot="append">节</template>
  298. </el-input>
  299. </el-form-item>
  300. <el-form-item
  301. v-if="hotType == 'GIVE_CLASS' && isGiveClass"
  302. label="赠课课程类型"
  303. >
  304. <el-radio v-model.trim="centerForm.radio" label="ONLINE"
  305. >线上课</el-radio
  306. >
  307. <el-radio v-model.trim="centerForm.radio" label="OFFLINE"
  308. >线下课</el-radio
  309. >
  310. </el-form-item>
  311. <el-form-item label="">
  312. <el-button type="danger" @click="setCourse">点击排课</el-button>
  313. </el-form-item>
  314. </el-form>
  315. <!-- 排课列表开始 planList-->
  316. <div class="">
  317. <!-- <div class="planTop">
  318. <p>已排课程</p>
  319. <el-button type="text" @click="setCourse">{{
  320. id ? "新增排课" : "点击排课"
  321. }}</el-button>
  322. </div> -->
  323. <!-- <div class="planCore"> -->
  324. <el-table
  325. style="width: 100%"
  326. :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
  327. :data="timeTable"
  328. >
  329. <el-table-column align="center" prop="studentId" label="课程时间">
  330. <template slot-scope="scope">
  331. <div>{{ scope.row.classDate | formatTimer }}</div>
  332. </template>
  333. </el-table-column>
  334. <el-table-column
  335. align="center"
  336. prop="studentId"
  337. label="课程开始时间"
  338. >
  339. <template slot-scope="scope">
  340. <div>{{ scope.row.startClassTimeStr }}</div>
  341. </template>
  342. </el-table-column>
  343. <el-table-column
  344. align="center"
  345. prop="studentId"
  346. label="课程结束时间"
  347. >
  348. <template slot-scope="scope">
  349. <div>{{ scope.row.endClassTimeStr }}</div>
  350. </template>
  351. </el-table-column>
  352. <el-table-column align="center" prop="studentId" label="课程类型">
  353. <template slot-scope="scope">
  354. <div>{{ scope.row.teachMode | teachMode }}</div>
  355. </template>
  356. </el-table-column>
  357. </el-table>
  358. <!-- <div class="row">
  359. <div class="name">时间</div>
  360. <div class="week">开始时间</div>
  361. <div class="time">结束时间</div>
  362. <div class="time">课程类型</div>
  363. </div> -->
  364. <!-- <div
  365. v-for="(item, index) in this.timeTable"
  366. :key="index"
  367. class="row"
  368. >
  369. <div class="name">{{ item.classDate | formatTimer }}</div>
  370. <div class="week">{{ item.startClassTimeStr }}</div>
  371. <div class="time">{{ item.endClassTimeStr }}</div>
  372. <div class="time">{{ item.teachMode | teachMode }}</div>
  373. </div> -->
  374. <!-- </div> -->
  375. </div>
  376. </div>
  377. <div class="right">
  378. <el-alert
  379. title="课酬&缴费设置"
  380. type="info"
  381. :closable="false"
  382. class="vipMsg"
  383. ></el-alert>
  384. <el-form
  385. :model="rightForm"
  386. label-width="100px"
  387. :label-position="labelPosition"
  388. :inline="true"
  389. >
  390. <el-form-item v-if="hasOnline" label="线上课课酬">
  391. <el-input v-model.trim="rightForm.onlineCourse" :disabled="true">
  392. <template slot="append" v-if="!isMusicTheory">元/节</template>
  393. <template slot="append" v-else>元/人</template>
  394. </el-input>
  395. <!-- || onlineSalary!='TEACHER_DEFAULT' salaryReadonlyFlag==0 -->
  396. </el-form-item>
  397. <el-form-item v-if="hasOffline" label="线下课课酬">
  398. <el-input v-model.trim="rightForm.offlineCourse" :disabled="true">
  399. <template slot="append" v-if="!isMusicTheory">元/节</template>
  400. <template slot="append" v-else>元/人</template>
  401. </el-input>
  402. <!-- || offlineSalary!='TEACHER_DEFAULT' salaryReadonlyFlag==0 -->
  403. </el-form-item>
  404. <!-- <el-form-item v-if="hasOnline" label="线上课单价">
  405. <el-input
  406. v-model.trim="rightForm.onlinePrice"
  407. :disabled="paymentReadonlyFlag == 0"
  408. />
  409. </el-form-item>
  410. <el-form-item v-if="hasOffline" label="线下课单价">
  411. <el-input
  412. v-model.trim="rightForm.offlinePrice"
  413. :disabled="paymentReadonlyFlag == 0"
  414. />
  415. </el-form-item> -->
  416. <!-- <el-form-item label="课程总价">
  417. <el-input v-model.trim="rightForm.allPrice" disabled />
  418. </el-form-item> -->
  419. </el-form>
  420. <div style="width: 700px; clear: both">
  421. <el-table
  422. :header-cell-style="{ background: '#EDEEF0', color: '#444' }"
  423. :data="activeStudentList"
  424. >
  425. <el-table-column align="center" prop="studentId" label="学员编号">
  426. </el-table-column>
  427. <el-table-column align="center" prop="userName" label="学员名称">
  428. </el-table-column>
  429. <el-table-column
  430. align="center"
  431. prop="studentId"
  432. v-if="hasOnline"
  433. label="线上课单价"
  434. >
  435. <template slot-scope="scope">
  436. <el-input-number
  437. :disabled="!isMusicTheory"
  438. size="mini"
  439. @change="changeStudentMoney"
  440. style="width: 90% !important"
  441. class="number-input"
  442. v-model="scope.row.onlineClassesUnitPrice"
  443. :controls="false"
  444. :min="0"
  445. placeholder="线上课单价"
  446. />
  447. </template>
  448. </el-table-column>
  449. <el-table-column
  450. align="center"
  451. prop="studentId"
  452. v-if="hasOffline"
  453. label="线下课单价"
  454. >
  455. <template slot-scope="scope">
  456. <el-input-number
  457. @change="changeStudentMoney"
  458. size="mini"
  459. style="width: 90% !important"
  460. class="number-input"
  461. :disabled="!isMusicTheory"
  462. v-model="scope.row.offlineClassesUnitPrice"
  463. :controls="false"
  464. :min="0"
  465. placeholder="线下课单价"
  466. />
  467. </template>
  468. </el-table-column>
  469. <el-table-column align="center" prop="studentId" label="缴费总额">
  470. <template slot-scope="scope">
  471. <el-input-number
  472. size="mini"
  473. style="width: 90% !important"
  474. class="number-input"
  475. v-model="scope.row.paymentPrice"
  476. :controls="false"
  477. :min="0"
  478. :disabled="true"
  479. placeholder="缴费总额"
  480. />
  481. </template>
  482. </el-table-column>
  483. </el-table>
  484. <!-- class="computeMoney" -->
  485. <div style="overflow: hidden">
  486. <el-button
  487. type="primary"
  488. class="computeMoney"
  489. @click="computational"
  490. >计算</el-button
  491. >
  492. </div>
  493. </div>
  494. </div>
  495. </div>
  496. <!-- 弹窗 -->
  497. <el-dialog
  498. title="VIP排课"
  499. ref="maskForm"
  500. width="500px"
  501. destroy-on-close
  502. :visible.sync="dialogFormVisible"
  503. >
  504. <el-form :model="maskForm" label-position="right" label-width="150px">
  505. <el-form-item label="开课时间">
  506. <el-date-picker
  507. v-model.trim="maskForm.courseStartOnline"
  508. type="date"
  509. :picker-options="courseOption"
  510. placeholder="请选择开课时间"
  511. />
  512. </el-form-item>
  513. <!-- <el-form-item label="线下课开课时间">
  514. <el-date-picker
  515. v-model.trim="maskForm.courseStartOffline"
  516. type="date"
  517. :picker-options="courseOption"
  518. placeholder="请选择开课时间"
  519. />
  520. </el-form-item> -->
  521. <div
  522. class="line"
  523. style="height: 1px; background: #ccc; margin: 0 25px"
  524. ></div>
  525. <el-form-item label="课程类型" prop="type">
  526. <el-radio v-if="hasOnline" v-model.trim="maskForm.type" label="ONLINE"
  527. >线上课</el-radio
  528. >
  529. <el-radio
  530. v-if="hasOffline"
  531. v-model.trim="maskForm.type"
  532. label="OFFLINE"
  533. >线下课</el-radio
  534. >
  535. </el-form-item>
  536. <el-form-item label="循环周次" prop="week">
  537. <el-select
  538. v-model.trim="maskForm.week"
  539. style="width: 220px !important"
  540. >
  541. <el-option label="星期日" value="0" />
  542. <el-option label="星期一" value="1" />
  543. <el-option label="星期二" value="2" />
  544. <el-option label="星期三" value="3" />
  545. <el-option label="星期四" value="4" />
  546. <el-option label="星期五" value="5" />
  547. <el-option label="星期六" value="6" />
  548. </el-select>
  549. </el-form-item>
  550. <el-form-item label="上课时间" prop="startTime">
  551. <el-time-picker
  552. v-model.trim="maskForm.startTime"
  553. @change="getStartTime"
  554. format="HH:mm"
  555. value-format="HH:mm"
  556. placeholder="选择时间"
  557. />
  558. </el-form-item>
  559. <el-form-item label="下课时间" prop="endTime">
  560. <el-time-picker
  561. v-model.trim="maskForm.endTime"
  562. disabled
  563. format="HH:mm"
  564. value-format="HH:mm"
  565. :picker-options="{
  566. start: '04:30',
  567. step: '00:05',
  568. end: '23:30',
  569. }"
  570. placeholder="选择时间"
  571. />
  572. </el-form-item>
  573. </el-form>
  574. <div class="btnWrap">
  575. <div class="okBtn" @click="addWeek">确认</div>
  576. </div>
  577. <div class="planList">
  578. <div class="planTop">
  579. <p>已排课程</p>
  580. </div>
  581. <div class="planCore">
  582. <div v-for="(item, index) in this.lookList" class="row" :key="index">
  583. <div class="name">{{ item.type }}</div>
  584. <div class="week">{{ item.week }}</div>
  585. <div class="time">{{ item.time }}</div>
  586. <div class="operation">
  587. <el-button type="text" @click="removeWeekCourse(item.id)"
  588. >删除</el-button
  589. >
  590. </div>
  591. </div>
  592. </div>
  593. <div slot="footer" style="margin-top: 20px" class="dialog-footer">
  594. <el-button @click="dialogFormVisible = false">取 消</el-button>
  595. <el-button type="primary" @click="setTimeTable">确 定</el-button>
  596. </div>
  597. </div>
  598. </el-dialog>
  599. <el-row>
  600. <el-col>
  601. <div class="okBtn" @click="submitInfo">{{ id ? "修改" : "确定" }}</div>
  602. </el-col>
  603. </el-row>
  604. <!-- <div class="btnWrap"> -->
  605. <!-- <div class="closeBtn">
  606. 取消
  607. </div>-->
  608. <!-- </div> -->
  609. </div>
  610. </template>
  611. <script>
  612. import {
  613. findTeacherByOrganId,
  614. getSubject,
  615. findEducationUsers,
  616. } from "@/api/buildTeam";
  617. import {
  618. vipGroupCategory,
  619. vipGroupActivityFind,
  620. getVipGroupCostCount,
  621. createVip,
  622. updateVipBaseInfo,
  623. } from "@/api/vipSeting";
  624. import { getTeachSchool, getTeacherBySubject } from "@/api/teacherManager";
  625. import axios from "axios";
  626. import { getToken } from "@/utils/auth";
  627. import { diffTimerFormMinute, addTimerFormMinute } from "@/utils/date";
  628. import dayjs from "dayjs";
  629. export default {
  630. name: "buildVip",
  631. data() {
  632. return {
  633. dialogFormVisible: false,
  634. labelPosition: "right",
  635. leftForm: {
  636. // name: "",
  637. teacher: "",
  638. subject: "",
  639. courseType: "",
  640. activeType: "",
  641. classNum: "",
  642. classTime: "",
  643. // signTimer:[],
  644. signUpStart: "",
  645. signUpEnd: "",
  646. courseStartOnline: "",
  647. courseStartOffline: "",
  648. section: "",
  649. courseStart: "",
  650. courseEnd: "",
  651. educationalTeacherId: "",
  652. students: [],
  653. classOrganId: "", // 课程分部
  654. },
  655. activeStudentList: [],
  656. studentLimit: 0,
  657. classTimeList: [],
  658. centerForm: {
  659. allCourseNum: "",
  660. onlineCourseNum: 0,
  661. offlineCourseNum: 0,
  662. radio: "",
  663. },
  664. maskForm: {
  665. type: "",
  666. week: "",
  667. startTime: "",
  668. endTime: "",
  669. },
  670. rightForm: {
  671. onlineCourse: "",
  672. offlineCourse: "",
  673. onlinePrice: "",
  674. offlinePrice: "",
  675. allPrice: "",
  676. },
  677. remoteLoading: false,
  678. computationalBtn: false,
  679. subjectList: [], // 科目列表
  680. teacherList: [], // 老师列表
  681. educationList: [], // 教务
  682. // classOrganList: [], // 公用分部
  683. courseTypeList: [], // 课程类型集合
  684. activeList: [], //活动集合
  685. hasOnline: true,
  686. hasOffline: true,
  687. onlineSalary: "", // 线上课课酬结算方式
  688. offlineSalary: "", // 线下课课酬结算方式
  689. hotType: "",
  690. attribute1: "",
  691. attribute2: "",
  692. attribute3: "",
  693. maxCourseNum: 0,
  694. minCourseNum: 0,
  695. salaryReadonlyFlag: "", // 老师课酬是否可配
  696. paymentReadonlyFlag: "", // 课程单价是否可配
  697. lookList: [],
  698. onlinelookList: [], // 展示课表线上
  699. offlineLookList: [], // 展示课表线下
  700. timeTable: [], // 真正的课表
  701. giveNum: "",
  702. weekDay: [
  703. "星期日",
  704. "星期一",
  705. "星期二",
  706. "星期三",
  707. "星期四",
  708. "星期五",
  709. "星期六",
  710. ],
  711. scetionList: [],
  712. isGiveClass: false,
  713. activeStartTime: null,
  714. courseOption: null,
  715. pickerOptions: null,
  716. pickerOptions1: null,
  717. leftFormRules: {
  718. /**?
  719. * teacher: '',
  720. subject: '',
  721. courseType: '',
  722. activeType: '',
  723. */
  724. name: [
  725. {
  726. required: true,
  727. message: "请输入名称",
  728. trigger: "blur",
  729. },
  730. ],
  731. teacher: [
  732. {
  733. required: true,
  734. message: "请选择老师",
  735. trigger: "change",
  736. },
  737. ],
  738. educationalTeacherId: [
  739. {
  740. required: true,
  741. message: "请选择教务",
  742. trigger: "change",
  743. },
  744. ],
  745. classOrganId: [
  746. {
  747. required: true,
  748. message: "请选择课程分部",
  749. trigger: "change",
  750. },
  751. ],
  752. subject: [
  753. {
  754. required: true,
  755. message: "请选择科目",
  756. trigger: "change",
  757. },
  758. ],
  759. courseType: [
  760. {
  761. required: true,
  762. message: "请选择课程类型",
  763. trigger: "change",
  764. },
  765. ],
  766. students: [
  767. {
  768. required: true,
  769. message: "请选择上课学生",
  770. trigger: "change",
  771. },
  772. ],
  773. // activeType: [
  774. // {
  775. // required: true,
  776. // message: "请选择活动",
  777. // trigger: "change",
  778. // },
  779. // ],
  780. signUpStart: [
  781. {
  782. required: true,
  783. message: "请选择报名开始时间",
  784. trigger: "change",
  785. },
  786. ],
  787. signUpEnd: [
  788. {
  789. required: true,
  790. message: "请选择报名结束时间",
  791. trigger: "change",
  792. },
  793. ],
  794. },
  795. id: "",
  796. studentList: [],
  797. courseTimeList: [],
  798. isMusicTheory: false,
  799. };
  800. },
  801. computed: {
  802. allCourseCount() {
  803. let online, offline;
  804. this.centerForm.onlineCourseNum
  805. ? (online = this.centerForm.onlineCourseNum)
  806. : (online = 0);
  807. this.centerForm.offlineCourseNum
  808. ? (offline = this.centerForm.offlineCourseNum)
  809. : (offline = 0);
  810. let giveNum;
  811. if (this.hotType == "GIVE_CLASS") {
  812. // this.attribute1 从多少节开始送
  813. // this.attribute2 送多少节
  814. giveNum = parseInt(
  815. parseInt(offline) + parseInt(online) - this.attribute1 >= 0
  816. ? (giveNum = this.attribute2)
  817. : (giveNum = 0)
  818. );
  819. if (giveNum) {
  820. // 有赠送课时
  821. this.isGiveClass = true;
  822. }
  823. this.giveNum = giveNum || 0;
  824. return parseInt(offline) + parseInt(online) + "+" + giveNum || "";
  825. }
  826. return parseInt(offline) + parseInt(online) || "";
  827. },
  828. },
  829. created() {
  830. // this.init();
  831. },
  832. mounted() {
  833. // 获取所有老师的接口 根据声部id获取老师
  834. // 获取课程类型的接口
  835. // 获取学生列表
  836. Object.assign(this.$data, this.$options.data());
  837. setTimeout(() => {
  838. this.$refs["leftForm"].resetFields();
  839. }, 100);
  840. this.init();
  841. },
  842. activated() {
  843. // Object.assign(this.$data, this.$options.data());
  844. // setTimeout(() => {
  845. // this.$refs["leftForm"].resetFields();
  846. // }, 100);
  847. // this.init();
  848. },
  849. methods: {
  850. async init() {
  851. if (this.$route.query.rules) {
  852. this.rules = this.$route.query.rules;
  853. }
  854. if (this.$route.query.searchForm) {
  855. this.searchForm = this.$route.query.searchForm;
  856. }
  857. // 获取所有科目的接口
  858. await this.$store.dispatch("setBranchs");
  859. getSubject({
  860. tenantId: 1,
  861. }).then((res) => {
  862. if (res.code == 200) {
  863. this.subjectList = res.data;
  864. }
  865. });
  866. // 获取乐团主管
  867. this.pickerOptions = this.beginDate();
  868. this.pickerOptions1 = this.processDate();
  869. this.courseOption = this.coursesDate();
  870. },
  871. onCourseNumChange(type) {
  872. // 折扣类型,并且设置的排课数有值
  873. let centerForm = this.centerForm;
  874. if (
  875. this.hotType == "DISCOUNT" &&
  876. this.maxCourseNum &&
  877. this.minCourseNum
  878. ) {
  879. // 判断线上或线下总和大于排课次数
  880. let onlineNum = centerForm.onlineCourseNum || 0;
  881. let offlineNum = centerForm.offlineCourseNum || 0;
  882. let allNUm = parseInt(onlineNum) + parseInt(offlineNum);
  883. if (allNUm > this.maxCourseNum || allNUm < this.minCourseNum) {
  884. this.$message.error("待排课数不可超过该活动限制");
  885. return;
  886. }
  887. }
  888. },
  889. coursesDate() {
  890. let self = this;
  891. return {
  892. firstDayOfWeek: 1,
  893. disabledDate: (time) => {
  894. if (self.leftForm.courseStart) {
  895. let date = new Date(self.leftForm.courseStart.replace(/-/, "/"));
  896. return time.getTime() < date.getTime();
  897. }
  898. return;
  899. },
  900. };
  901. },
  902. beginDate() {
  903. let self = this;
  904. return {
  905. firstDayOfWeek: 1,
  906. disabledDate(time) {
  907. return time.getTime() + 86400000 <= new Date().getTime(); //开始时间不选时,结束时间最大值小于等于当天
  908. },
  909. };
  910. },
  911. processDate() {
  912. //提出结束时间必须大于提出开始时间
  913. let self = this;
  914. return {
  915. firstDayOfWeek: 1,
  916. disabledDate(time) {
  917. if (self.leftForm.signUpStart) {
  918. return (
  919. new Date(self.leftForm.signUpStart).getTime() > time.getTime()
  920. );
  921. } else {
  922. return time.getTime() > Date.now();
  923. //开始时间不选时,结束时间最大值小于等于当天
  924. }
  925. },
  926. };
  927. },
  928. changeSubject(val) {
  929. this.leftForm.teacher = "";
  930. this.leftForm.section = "";
  931. // 根据科目id获取相应的老师
  932. findTeacherByOrganId({
  933. subjectIds: val,
  934. organId: this.leftForm.classOrganId,
  935. }).then((res) => {
  936. if (res.code == 200) {
  937. this.teacherList = res.data;
  938. }
  939. });
  940. // getTeacherBySubject({ subjecId: val }).then(res => {
  941. // if (res.code == 200) {
  942. // this.teacherList = res.data;
  943. // }
  944. // })
  945. },
  946. // 选择课程类型
  947. changeType(val) {
  948. // 在这里清空默认课酬
  949. this.rightForm.offlineCourse = "";
  950. this.rightForm.onlineCourse = "";
  951. this.leftForm.activeType = "";
  952. this.leftForm.students = []; // 重置所选学生
  953. for (let i in this.courseTypeList) {
  954. if (this.courseTypeList[i].id == val) {
  955. // 学生人数
  956. this.leftForm.classNum = this.courseTypeList[i].studentNum;
  957. this.studentLimit = this.courseTypeList[i].studentNum;
  958. // 每课时长
  959. this.classTimeList = this.courseTypeList[i].singleClassMinutes.split(
  960. ","
  961. );
  962. // this.leftForm.classTime = this.courseTypeList[i].singleClassMinutes;
  963. this.leftForm.classTime = this.classTimeList[0];
  964. // 线上课单节价格
  965. this.rightForm.onlinePrice = this.courseTypeList[
  966. i
  967. ].onlineClassesUnitPrice;
  968. // 线下课单节价格
  969. this.rightForm.offlinePrice = this.courseTypeList[
  970. i
  971. ].offlineClassesUnitPrice;
  972. this.isMusicTheory = this.courseTypeList[i].musicTheory;
  973. }
  974. }
  975. // teacherId
  976. if (this.leftForm.courseType && this.leftForm.teacher) {
  977. // 根据课程类型获取活动方案
  978. vipGroupActivityFind({
  979. categoryId: this.leftForm.courseType,
  980. teacherId: this.leftForm.teacher,
  981. }).then((res) => {
  982. if (res.code == 200) {
  983. this.activeList = res.data;
  984. }
  985. });
  986. }
  987. },
  988. // 选择活动方案
  989. chioseActive(val) {
  990. console.log(val)
  991. this.rightForm.offlineCourse = "";
  992. this.rightForm.onlineCourse = "";
  993. // this.rightForm.onlinePrice = '';
  994. // this.rightForm.offlinePrice = '';
  995. this.lookList = [];
  996. this.timeTable = [];
  997. this.attribute1 = "";
  998. this.attribute2 = "";
  999. this.attribute3 = "";
  1000. this.giveNum = 0;
  1001. this.isGiveClass = false;
  1002. this.leftForm.courseStart = "";
  1003. this.leftForm.courseEnd = "";
  1004. this.hasOnline = true;
  1005. this.hasOffline = true;
  1006. if (val) {
  1007. for (let i in this.courseTypeList) {
  1008. if (this.courseTypeList[i].id == this.leftForm.courseType) {
  1009. // 学生人数
  1010. this.leftForm.classNum = this.courseTypeList[i].studentNum;
  1011. // 每课时长
  1012. this.classTimeList = this.courseTypeList[
  1013. i
  1014. ].singleClassMinutes.split(",");
  1015. // this.leftForm.classTime = this.courseTypeList[i].singleClassMinutes;
  1016. this.leftForm.classTime = this.classTimeList[0];
  1017. // 线上课单节价格
  1018. this.rightForm.onlinePrice = this.courseTypeList[
  1019. i
  1020. ].onlineClassesUnitPrice;
  1021. // 线下课单节价格
  1022. this.rightForm.offlinePrice = this.courseTypeList[
  1023. i
  1024. ].offlineClassesUnitPrice;
  1025. }
  1026. }
  1027. // 根须活动id获取 相应的值
  1028. for (let i in this.activeList) {
  1029. if (this.activeList[i].id == val) {
  1030. // 如果是买赠就必须选择赠课类型
  1031. // 报名开始 报名结束 课程开始 课程结束 // 判断是否有线上,线下课 并同步状态
  1032. // this.leftForm.signUpStart = this.activeList[i].startTime;
  1033. // this.leftForm.signUpEnd = this.activeList[i].endTime;
  1034. this.maxCourseNum = this.activeList[i].maxCourseNum || 0;
  1035. this.minCourseNum = this.activeList[i].minCourseNum || 0;
  1036. this.leftForm.courseStart = this.activeList[i].coursesStartTime;
  1037. this.leftForm.courseEnd = this.activeList[i].coursesEndTime;
  1038. // 获取活动种类并保存
  1039. this.hotType = this.activeList[i].type;
  1040. // 获取买赠必要参数
  1041. this.attribute1 = this.activeList[i].attribute1;
  1042. this.attribute2 = this.activeList[i].attribute2;
  1043. this.attribute3 = this.activeList[i].attribute3;
  1044. // 存储课酬是否可配置
  1045. this.salaryReadonlyFlag = this.activeList[i].salaryReadonlyFlag;
  1046. this.paymentReadonlyFlag = this.activeList[i].paymentReadonlyFlag;
  1047. // hasOnline: false, hasOffline: false 还需要判断type类型 根据活动id获取
  1048. if (this.activeList[i].salarySettlementJson) {
  1049. let obj = JSON.parse(this.activeList[i].salarySettlementJson);
  1050. if (obj && obj.onlineSalarySettlement) {
  1051. // 有线上课
  1052. this.hasOnline = true;
  1053. this.onlineSalary =
  1054. obj.onlineSalarySettlement.salarySettlementType;
  1055. // console.log('线上:' + this.onlineSalary)
  1056. } else {
  1057. this.hasOnline = false;
  1058. }
  1059. if (obj && obj.offlineSalarySettlement) {
  1060. // 有线下课
  1061. this.hasOffline = true;
  1062. this.offlineSalary =
  1063. obj.offlineSalarySettlement.salarySettlementType;
  1064. // console.log('线下:' + this.offlineSalary)
  1065. } else {
  1066. this.hasOffline = false;
  1067. }
  1068. }
  1069. }
  1070. }
  1071. }
  1072. // 重置课程单价
  1073. },
  1074. // 点击确插入课表
  1075. addWeek() {
  1076. let courseType = this.maskForm.type;
  1077. // let week = ;this.maskForm.week
  1078. let startTime = this.maskForm.startTime;
  1079. if (!courseType || !this.maskForm.week || !startTime) {
  1080. this.$message.error("请填写完成信息");
  1081. return;
  1082. }
  1083. // 拿到相应的值插入数组
  1084. let endTime = this.MinutesTest(startTime, this.leftForm.classTime);
  1085. let str;
  1086. switch (courseType) {
  1087. case "ONLINE": {
  1088. str = "线上课";
  1089. break;
  1090. }
  1091. case "OFFLINE": {
  1092. str = "线下课";
  1093. break;
  1094. }
  1095. }
  1096. let flag = false;
  1097. for (let i in this.lookList) {
  1098. if (this.lookList[i].weekDay == this.maskForm.week) {
  1099. flag = true;
  1100. }
  1101. }
  1102. // true=> 说明有这一周 那么循环找到这一周 在判断时间
  1103. // flase=> 说明没有这一周的时间 直接添加
  1104. if (flag) {
  1105. // 有相同的周日
  1106. let arr = [];
  1107. for (let i in this.lookList) {
  1108. if (this.lookList[i].weekDay == this.maskForm.week) {
  1109. // 找到这一天的所有元素
  1110. // && !this.timeIsrange(this.lookList[i].startTime, this.lookList[i].endTime, startTime) && !this.timeIsrange(this.lookList[i].startTime, this.lookList[i].endTime, endTime)
  1111. let isStartTime = this.timeIsrange(
  1112. startTime,
  1113. endTime,
  1114. this.lookList[i].startTime
  1115. );
  1116. let isEndTime = this.timeIsrange(
  1117. startTime,
  1118. endTime,
  1119. this.lookList[i].endTime
  1120. );
  1121. arr.push(!isEndTime && !isStartTime);
  1122. }
  1123. }
  1124. let isAdd = true;
  1125. for (let j = 0; j < arr.length; j++) {
  1126. isAdd = isAdd && arr[j];
  1127. }
  1128. if (isAdd) {
  1129. this.lookList.push({
  1130. type: str,
  1131. week: this.weekDay[this.maskForm.week],
  1132. weekDay: this.maskForm.week,
  1133. startTime: startTime,
  1134. endTime: endTime,
  1135. time: startTime + "-" + endTime,
  1136. id: Date.now(),
  1137. });
  1138. } else {
  1139. this.$message.error("该时间段已排课请重选时间");
  1140. return;
  1141. }
  1142. } else {
  1143. this.lookList.push({
  1144. type: str,
  1145. week: this.weekDay[this.maskForm.week],
  1146. weekDay: this.maskForm.week,
  1147. startTime: startTime,
  1148. endTime: endTime,
  1149. time: startTime + "-" + endTime,
  1150. id: Date.now(),
  1151. });
  1152. }
  1153. console.log(this.lookList)
  1154. // let courseType = this.maskForm.type;
  1155. // // let week = ;this.maskForm.week
  1156. // let startTime = this.maskForm.startTime;
  1157. // 根据时间排序
  1158. this.maskForm.type = "";
  1159. this.maskForm.week = "";
  1160. this.maskForm.startTime = "";
  1161. this.maskForm.endTime = "";
  1162. },
  1163. // 分钟小时相加减
  1164. MinutesTest(str, interval) {
  1165. let houer = str.split(":")[0];
  1166. let min = str.split(":")[1];
  1167. let sdate1 = new Date(1900, 1, 1, houer, min);
  1168. sdate1.setMinutes(sdate1.getMinutes() + parseInt(interval));
  1169. let H = sdate1.getHours();
  1170. let M = sdate1.getMinutes();
  1171. if (H < 10) H = "0" + H;
  1172. if (M < 10) M = "0" + M;
  1173. return H + ":" + M;
  1174. },
  1175. // 判断时间是否在时间段内
  1176. timeIsrange(beginTime, endTime, nowTime) {
  1177. var strb = beginTime.split(":");
  1178. if (strb.length != 2) {
  1179. return false;
  1180. }
  1181. var stre = endTime.split(":");
  1182. if (stre.length != 2) {
  1183. return false;
  1184. }
  1185. var strn = nowTime.split(":");
  1186. if (stre.length != 2) {
  1187. return false;
  1188. }
  1189. var b = new Date();
  1190. var e = new Date();
  1191. var n = new Date();
  1192. b.setHours(strb[0]);
  1193. b.setMinutes(strb[1]);
  1194. e.setHours(stre[0]);
  1195. e.setMinutes(stre[1]);
  1196. n.setHours(strn[0]);
  1197. n.setMinutes(strn[1]);
  1198. if (n.getTime() - b.getTime() >= 0 && n.getTime() - e.getTime() <= 0) {
  1199. // 在时间范围内
  1200. return true;
  1201. } else {
  1202. // 不在时间范围内
  1203. return false;
  1204. }
  1205. },
  1206. removeWeekCourse(id) {
  1207. for (let i in this.lookList) {
  1208. if (this.lookList[i].id == id) {
  1209. this.lookList.splice(i, 1);
  1210. }
  1211. }
  1212. },
  1213. setTimeTable() {
  1214. // 拿到线上课数与线下课数 以及
  1215. this.timeTable = [];
  1216. let online = parseInt(this.centerForm.onlineCourseNum) || 0;
  1217. let offline = parseInt(this.centerForm.offlineCourseNum) || 0;
  1218. let giveNum = this.giveNum;
  1219. let giveClassType = this.centerForm.radio;
  1220. if (giveClassType == "ONLINE") {
  1221. // 线上
  1222. online += giveNum;
  1223. } else if (giveClassType == "OFFLINE") {
  1224. offline += giveNum;
  1225. }
  1226. if( !this.maskForm.courseStartOnline){
  1227. this.$message.error("请选择课程开始时间");
  1228. return;
  1229. }
  1230. // 这里判断是否选择了排课开始时间
  1231. // if (online && !this.maskForm.courseStartOnline) {
  1232. // this.$message.error("选择了线上课 但没有线上课开始时间");
  1233. // return;
  1234. // }
  1235. // if (offline && !this.maskForm.courseStartOffline) {
  1236. // this.$message.error("选择了线下课 但没有线下课开始时间");
  1237. // return;
  1238. // }
  1239. let date, date1;
  1240. date = new Date(this.maskForm.courseStartOnline.getTime());
  1241. date1 = new Date(this.maskForm.courseStartOnline.getTime());
  1242. // if (this.maskForm.courseStartOnline) {
  1243. // date = new Date(this.maskForm.courseStartOnline.getTime());
  1244. // }
  1245. // if (this.maskForm.courseStartOffline) {
  1246. // date1 = new Date(this.maskForm.courseStartOffline.getTime());
  1247. // }
  1248. // let startWeekday = this.maskForm.courseStart.getDay();
  1249. let onlineList = []; // 装线上课的数组
  1250. let offlineList = []; //装线下课的数组
  1251. if (this.lookList.length <= 0) {
  1252. this.$message.error("请先排课后再点击确认按钮");
  1253. return;
  1254. }
  1255. for (let i in this.lookList) {
  1256. if (this.lookList[i].type == "线上课") {
  1257. onlineList.push({
  1258. week: this.lookList[i].weekDay,
  1259. date: this.lookList[i],
  1260. });
  1261. }
  1262. if (this.lookList[i].type == "线下课") {
  1263. offlineList.push({
  1264. week: this.lookList[i].weekDay,
  1265. date: this.lookList[i],
  1266. });
  1267. }
  1268. }
  1269. // console.log(onlineList + '----------------------------------------------------------------------------------');
  1270. // console.log(offlineList);
  1271. if (online > 0 && onlineList.length <= 0) {
  1272. this.$message.error("选择了线上课但未排线上课");
  1273. this.timeTable = [];
  1274. return;
  1275. }
  1276. if (offline > 0 && offlineList.length <= 0) {
  1277. this.$message.error("选择了线下课但未排线下课");
  1278. this.timeTable = [];
  1279. return;
  1280. }
  1281. // 获取要排课的总数 获取每周要排多少次
  1282. while (online && online > 0) {
  1283. // 排线上课g
  1284. for (let i in onlineList) {
  1285. let num;
  1286. onlineList[i].week - date.getDay() >= 0
  1287. ? (num = onlineList[i].week - date.getDay())
  1288. : (num = onlineList[i].week - date.getDay() + 7); // +差值的天数://差值的天数+7
  1289. // console.log(num);
  1290. let dataStr = this.getThinkDate(date, num);
  1291. this.timeTable.push({
  1292. classDate: dataStr + " 00:00:00",
  1293. actualTeacherId: this.leftForm.teacher,
  1294. startClassTimeStr: onlineList[i].date.startTime,
  1295. endClassTimeStr: onlineList[i].date.endTime,
  1296. teachMode: "ONLINE",
  1297. });
  1298. online--;
  1299. if (online == 0) break;
  1300. }
  1301. if (onlineList.length == 1 || this.isAllEqual(onlineList)) {
  1302. date.setDate(date.getDate() + 7);
  1303. }
  1304. // 加一周
  1305. }
  1306. // console.log(date1)
  1307. while (offline && offline > 0) {
  1308. // 排线下课
  1309. for (let i in offlineList) {
  1310. let num;
  1311. offlineList[i].week - date1.getDay() >= 0
  1312. ? (num = offlineList[i].week - date1.getDay())
  1313. : (num = offlineList[i].week - date1.getDay() + 7); // +差值的天数://差值的天数+7
  1314. let dataStr = this.getThinkDate(date1, num);
  1315. this.timeTable.push({
  1316. classDate: dataStr + " 00:00:00",
  1317. actualTeacherId: this.leftForm.teacher,
  1318. startClassTimeStr: offlineList[i].date.startTime,
  1319. endClassTimeStr: offlineList[i].date.endTime,
  1320. teachMode: "OFFLINE",
  1321. });
  1322. offline--;
  1323. if (offline == 0) break;
  1324. }
  1325. // 加一周
  1326. if (offlineList.length == 1 || this.isAllEqual(offlineList)) {
  1327. date1.setDate(date1.getDate() + 7);
  1328. }
  1329. }
  1330. // console.log(this.timeTable);
  1331. this.timeTable.sort((a,b)=>{
  1332. let aStr = dayjs(dayjs(a.classDate).format('YYYY-MM-DD')+' '+a.startClassTimeStr+':00').valueOf()
  1333. let bStr = dayjs(dayjs(b.classDate).format('YYYY-MM-DD')+' '+b.startClassTimeStr+':00').valueOf()
  1334. return aStr-bStr
  1335. })
  1336. this.dialogFormVisible = false;
  1337. },
  1338. getThinkDate(date, num) {
  1339. let Stamp = date;
  1340. Stamp.setDate(date.getDate() + num); // 获取当前月数的第几天
  1341. // console.log(date.getMonth() + 1)
  1342. // console.log(Stamp.getMonth() + 1)
  1343. var year = Stamp.getFullYear(); //获取完整的年份(4位,1970-????)
  1344. var month = Stamp.getMonth() + 1; //获取当前月份(0-11,0代表1月)
  1345. var mvar = "";
  1346. if (month < 10) {
  1347. mvar = "0" + month;
  1348. } else {
  1349. mvar = month + "";
  1350. }
  1351. var day = Stamp.getDate();
  1352. var dvar = "";
  1353. if (day < 10) {
  1354. dvar = "0" + day;
  1355. } else {
  1356. dvar = day + "";
  1357. }
  1358. // console.log(year + "-" + mvar + '-' + dvar);
  1359. return year + "-" + mvar + "-" + dvar;
  1360. },
  1361. // 计算课酬
  1362. computational() {
  1363. console.log("lai");
  1364. this.computationalBtn = true;
  1365. let userId = this.leftForm.teacher || null;
  1366. let giveTeachMode = this.centerForm.radio || null;
  1367. let vipGroupCategoryId = this.leftForm.courseType || null;
  1368. let vipGroupActivityId = this.leftForm.activeType || null;
  1369. let onlineClassesUnitPrice = this.rightForm.onlinePrice || null;
  1370. let offlineClassesUnitPrice = this.rightForm.offlinePrice || null;
  1371. let onlineClassesNum = this.centerForm.onlineCourseNum || 0;
  1372. let offlineClassesNum = this.centerForm.offlineCourseNum || 0;
  1373. let singleClassMinutes = this.leftForm.classTime;
  1374. if (this.hotType == "GIVE_CLASS") {
  1375. if (this.centerForm.radio == "ONLINE") {
  1376. onlineClassesNum =
  1377. parseInt(onlineClassesNum) + parseInt(this.giveNum);
  1378. } else if (this.centerForm.radio == "OFFLINE") {
  1379. offlineClassesNum =
  1380. parseInt(offlineClassesNum) + parseInt(this.giveNum);
  1381. }
  1382. }
  1383. let onlineTeacherSalary = this.rightForm.onlineCourse || null;
  1384. let offlineTeacherSalary = this.rightForm.offlineCourse || null;
  1385. getVipGroupCostCount({
  1386. vipGroupActivityId,
  1387. onlineClassesUnitPrice,
  1388. onlineTeacherSalary,
  1389. offlineTeacherSalary,
  1390. vipGroupCategoryId,
  1391. offlineClassesUnitPrice,
  1392. onlineClassesNum,
  1393. offlineClassesNum,
  1394. userId,
  1395. giveTeachMode,
  1396. singleClassMinutes,
  1397. vipGroupStudentCoursePrices: this.activeStudentList,
  1398. }).then((res) => {
  1399. if (res.code == 200) {
  1400. this.rightForm.onlineCourse = res.data.onlineTeacherSalary;
  1401. this.rightForm.offlineCourse = res.data.offlineTeacherSalary;
  1402. this.rightForm.allPrice = res.data.totalPrice;
  1403. this.activeStudentList.forEach((stu) => {
  1404. if (res.data.hasOwnProperty(stu.studentId)) {
  1405. stu.paymentPrice = res.data[stu.studentId];
  1406. }
  1407. });
  1408. }
  1409. });
  1410. },
  1411. isAllEqual(array) {
  1412. if (array.length > 0) {
  1413. return !array.some((val, index) => {
  1414. return val.week != array[0].week;
  1415. });
  1416. } else {
  1417. return true;
  1418. }
  1419. },
  1420. submitInfo() {
  1421. if (!this.computationalBtn) {
  1422. this.$message.error("请点击计算按钮计算课酬");
  1423. return;
  1424. }
  1425. // let activeCourseType;
  1426. let flag = false;
  1427. // console.log(this.courseTypeList,)
  1428. // this.courseTypeList.forEach((courseType) => {
  1429. // if (courseType.id == this.leftForm.courseType) {
  1430. // activeCourseType = courseType;
  1431. // }
  1432. // });
  1433. // console.log(activeCourseType)
  1434. if (this.isMusicTheory) {
  1435. if (
  1436. this.leftForm.students.length > this.studentLimit ||
  1437. this.leftForm.students.length < 3
  1438. ) {
  1439. this.$message.error(`请选择上课学生为3-${this.studentLimit}人`);
  1440. flag = true;
  1441. }
  1442. } else {
  1443. if (this.leftForm.students.length !== this.studentLimit) {
  1444. this.$message.error(`请选择上课学生为${this.studentLimit}人`);
  1445. flag = true;
  1446. }
  1447. }
  1448. if (flag) return;
  1449. // 获取活动方案
  1450. // 判断线上课课酬和线下课课酬
  1451. let online = parseInt(this.centerForm.onlineCourseNum);
  1452. let offline = parseInt(this.centerForm.offlineCourseNum);
  1453. let giveNum = this.giveNum;
  1454. let giveClassType = this.centerForm.radio;
  1455. if (giveClassType == "ONLINE") {
  1456. // 线上
  1457. online += giveNum;
  1458. } else if (giveClassType == "OFFLINE") {
  1459. offline += giveNum;
  1460. }
  1461. let obj = {};
  1462. obj.courseSchedules = this.timeTable;
  1463. /**
  1464. *
  1465. * teacher: '',
  1466. subject: '',
  1467. courseType: '',
  1468. activeType: '',
  1469. classNum: '',
  1470. classTime: '',
  1471. signUpStart: '',
  1472. signUpEnd: '',
  1473. courseStart: '',
  1474. courseEnd: ''
  1475. */
  1476. let studentIdList = this.leftForm.students.join(",") || null;
  1477. obj.vipGroupApplyBaseInfo = {
  1478. studentIdList, // 这个不要了
  1479. vipGroupStudentCoursePrices: this.activeStudentList,
  1480. coursesExpireDate: this.leftForm.courseEnd,
  1481. teacherSchoolId: this.leftForm.section,
  1482. // name: this.leftForm.name,
  1483. offlineClassesNum: offline || 0,
  1484. onlineClassesNum: online || 0,
  1485. offlineClassesUnitPrice: this.rightForm.offlinePrice || 0,
  1486. onlineClassesUnitPrice: this.rightForm.onlinePrice || 0,
  1487. paymentExpireDate: this.leftForm.signUpEnd,
  1488. registrationStartTime: this.leftForm.signUpStart,
  1489. singleClassMinutes: this.leftForm.classTime,
  1490. studentNum: this.leftForm.classNum,
  1491. userId: this.leftForm.teacher,
  1492. vipGroupActivityId: this.leftForm.activeType,
  1493. vipGroupCategoryId: this.leftForm.courseType,
  1494. onlineTeacherSalary: this.rightForm.onlineCourse || 0,
  1495. offlineTeacherSalary: this.rightForm.offlineCourse || 0,
  1496. giveTeachMode: this.centerForm.radio,
  1497. subjectIdList: this.leftForm.subject,
  1498. educationalTeacherId: this.leftForm.educationalTeacherId,
  1499. organId: this.leftForm.classOrganId,
  1500. };
  1501. // 调接前判断是新增还是修改
  1502. if (!this.id) {
  1503. // 新增
  1504. createVip(obj).then((res) => {
  1505. if (res.code == 200) {
  1506. if (res.data == "ING") {
  1507. this.$confirm(
  1508. "课程提交成功,已提交运营主管审批,审批通过后,课程创建成功!",
  1509. "提示",
  1510. {
  1511. confirmButtonText: "确定",
  1512. type: "warning",
  1513. }
  1514. ).then(() => {
  1515. // this.$message({
  1516. // type: 'success',
  1517. // message: '提交成功!'
  1518. // });
  1519. this.$message.success("提交成功");
  1520. this.$store.dispatch("delVisitedViews", this.$route);
  1521. this.$router.push({
  1522. path: "/vipManager/vipList",
  1523. query: {
  1524. rules: this.rules,
  1525. searchForm: this.searchForm,
  1526. },
  1527. });
  1528. });
  1529. } else {
  1530. this.$message.success("恭喜您创建成功");
  1531. this.$store.dispatch("delVisitedViews", this.$route);
  1532. this.$router.push({
  1533. path: "/vipManager/vipList",
  1534. query: {
  1535. rules: this.rules,
  1536. searchForm: this.searchForm,
  1537. },
  1538. });
  1539. }
  1540. }
  1541. });
  1542. } else {
  1543. // 修改
  1544. obj.vipGroupApplyBaseInfo.id = this.id;
  1545. updateVipBaseInfo(obj.vipGroupApplyBaseInfo).then((res) => {});
  1546. }
  1547. },
  1548. setSection(val) {
  1549. this.leftForm.section = "";
  1550. this.rightForm.offlineCourse = "";
  1551. this.rightForm.onlineCourse = "";
  1552. // this.leftForm.courseType = "";
  1553. if (val) {
  1554. getTeachSchool({
  1555. userId: val,
  1556. }).then((res) => {
  1557. if (res.code == 200) {
  1558. this.scetionList = res.data;
  1559. }
  1560. });
  1561. }
  1562. // for (let i in this.teacherList) {
  1563. // if (this.teacherList[i].id == val) {
  1564. // // 根据分部id去获取课程形式
  1565. // vipGroupCategory({ organId: this.teacherList[i].organId }).then(
  1566. // res => {
  1567. // if (res.code == 200) {
  1568. // this.courseTypeList = res.data;
  1569. // }
  1570. // }
  1571. // );
  1572. // }
  1573. // }
  1574. // this.getClassOrgan(); // 获取公用部分
  1575. },
  1576. // getClassOrgan() {
  1577. // // 获取公用分部
  1578. // const leftForm = this.leftForm;
  1579. // let teacher = leftForm.teacher ? leftForm.teacher : null;
  1580. // let educationalTeacherId = leftForm.educationalTeacherId
  1581. // ? leftForm.educationalTeacherId
  1582. // : null;
  1583. // leftForm.classOrganId = null; // 重置课程分部数据
  1584. // this.classOrganList = [];
  1585. // // 初始化上课学生
  1586. // this.studentList = [];
  1587. // this.leftForm.students = [];
  1588. // if (!teacher || !educationalTeacherId) {
  1589. // // 如果没有选择指导老师和乐团主管则不请求
  1590. // return;
  1591. // }
  1592. // getPublicOrgans({
  1593. // teacherId: teacher,
  1594. // eduTeacherId: educationalTeacherId,
  1595. // }).then((res) => {
  1596. // if (res.code == 200) {
  1597. // let result = res.data ? res.data : [];
  1598. // this.classOrganList = result;
  1599. // }
  1600. // });
  1601. // },
  1602. onClassChange(val) {
  1603. // 课程分部改变时
  1604. // 老师 乐团主管 都要重置
  1605. this.studentList = [];
  1606. this.$set(this.leftForm, "students", []);
  1607. this.$set(this.leftForm, "teacher", "");
  1608. this.$set(this.leftForm, "educationalTeacherId", "");
  1609. this.$set(this.leftForm, "section", "");
  1610. this.$set(this.leftForm, "activeType", "");
  1611. this.$set(this.leftForm, "classTime", "");
  1612. this.$set(this.leftForm, "subject", "");
  1613. // this.leftForm.students = [];
  1614. // this.leftForm.teacherId = "";
  1615. // this.leftForm.educationalTeacherId = "";
  1616. this.courseTypeList = [];
  1617. if (this.leftForm.courseType) {
  1618. this.$set(this.leftForm, "courseType", null);
  1619. }
  1620. // this.leftForm.courseType = null;
  1621. if (val) {
  1622. vipGroupCategory({
  1623. organId: val,
  1624. }).then((res) => {
  1625. if (res.code == 200) {
  1626. this.courseTypeList = res.data;
  1627. }
  1628. });
  1629. // 获取老师
  1630. // 获取乐团主管
  1631. findEducationUsers({ organId: val }).then((res) => {
  1632. if (res.code == 200) {
  1633. this.educationList = res.data;
  1634. }
  1635. });
  1636. }
  1637. },
  1638. onCancel() {
  1639. this.$store.dispatch("delVisitedViews", this.$route);
  1640. this.$router.push({
  1641. path: "/vipManager/vipList",
  1642. query: {
  1643. rules: this.rules,
  1644. searchForm: this.searchForm,
  1645. },
  1646. });
  1647. },
  1648. setCourse() {
  1649. if (
  1650. this.hotType == "GIVE_CLASS" &&
  1651. this.isGiveClass &&
  1652. !this.centerForm.radio
  1653. ) {
  1654. this.$message.error("您还未选择赠课类型");
  1655. return;
  1656. }
  1657. this.$refs["leftForm"].validate((vali) => {
  1658. if (vali) {
  1659. let centerForm = this.centerForm;
  1660. if (
  1661. this.hotType == "DISCOUNT" &&
  1662. this.maxCourseNum &&
  1663. this.minCourseNum
  1664. ) {
  1665. // 判断线上或线下总和大于排课次数
  1666. let onlineNum = centerForm.onlineCourseNum || 0;
  1667. let offlineNum = centerForm.offlineCourseNum || 0;
  1668. let allNUm = parseInt(onlineNum) + parseInt(offlineNum);
  1669. if (allNUm > this.maxCourseNum || allNUm < this.minCourseNum) {
  1670. this.$message.error("待排课数不可超过该活动限制");
  1671. return;
  1672. }
  1673. }
  1674. this.dialogFormVisible = true;
  1675. }
  1676. });
  1677. },
  1678. setVipInfo(data) {
  1679. // this.leftForm.name = data.name;
  1680. this.leftForm.subject = parseInt(data.subjectIdList);
  1681. // 激活声部下的所有老师
  1682. this.changeSubject(parseInt(data.subjectIdList));
  1683. // 设置老师
  1684. this.leftForm.teacher = data.userId;
  1685. this.setSection(data.userId);
  1686. // 课程形式
  1687. this.leftForm.courseType = data.vipGroupCategoryId;
  1688. // 获取课程形式下的活动方案
  1689. this.changeType(this.leftForm.courseType);
  1690. // 根据课程形式获取活动方案
  1691. this.leftForm.activeType = data.vipGroupActivityId;
  1692. setTimeout((res) => {
  1693. this.chioseActive(data.vipGroupActivityId);
  1694. }, 1000);
  1695. this.leftForm.section = data.teacherSchoolId;
  1696. this.leftForm.classNum = data.studentNum;
  1697. this.leftForm.classTime = data.singleClassMinutes;
  1698. this.leftForm.signUpStart = data.registrationStartTime;
  1699. this.leftForm.signUpEnd = data.paymentExpireDate;
  1700. this.centerForm.onlineCourseNum = data.onlineClassesNum;
  1701. this.centerForm.offlineCourseNum = data.offlineCourseNum;
  1702. /**
  1703. * rightForm: {
  1704. onlineCourse: '',
  1705. offlineCourse: '',
  1706. onlinePrice: '',
  1707. offlinePrice: '',
  1708. allPrice: ''
  1709. },
  1710. *
  1711. */
  1712. this.rightForm.onlineCourse = data.onlineTeacherSalary;
  1713. this.rightForm.onlinePrice = data.onlineClassesUnitPrice;
  1714. this.rightForm.offlineCourse = data.offlineTeacherSalary;
  1715. this.rightForm.offlinePrice = data.offlineClassesUnitPrice;
  1716. this.rightForm.allPrice = data.totalPrice;
  1717. //subjectIdList
  1718. },
  1719. remoteMethod(query) {
  1720. if (query !== "") {
  1721. this.remoteLoading = true;
  1722. // 发请求搜索
  1723. const url = "/api-web/studentManage/queryOrganStudentList";
  1724. const options = {
  1725. method: "get",
  1726. headers: {
  1727. Authorization: getToken(),
  1728. },
  1729. params: {
  1730. rows: 9999,
  1731. search: query,
  1732. organId: this.leftForm.classOrganId,
  1733. },
  1734. url,
  1735. };
  1736. this.remoteLoading = true;
  1737. // this.studentList = []
  1738. axios(options).then((res) => {
  1739. this.remoteLoading = false;
  1740. let result = res.data;
  1741. if (result.code == 200) {
  1742. // Array.prototype.splice.apply(this.studentList, result.data.rows);
  1743. if (result.data.rows && result.data.rows.length > 0) {
  1744. result.data.rows.forEach((item) => {
  1745. this.studentList.unshift(item);
  1746. });
  1747. this.studentList = this.deweight(this.studentList, "userId");
  1748. }
  1749. // this.studentList = this.studentList.concat(result.data.rows);
  1750. }
  1751. });
  1752. // queryStudentList({ rows: 100, search: query }).then(res => {
  1753. // if (res.code == 200) {
  1754. // this.remoteLoading = false;
  1755. // this.studentList = this.studentList.concat(res.data.rows);
  1756. // this.unique(this.studentList, "userId");
  1757. // }
  1758. // });
  1759. }
  1760. },
  1761. changeStudent(val) {
  1762. this.activeStudentList = [];
  1763. this.studentList.forEach((stu) => {
  1764. if (val.indexOf(stu.userId) != -1) {
  1765. this.activeStudentList.push({
  1766. studentId: stu.userId,
  1767. userName: stu.username,
  1768. onlineClassesUnitPrice: this.rightForm.onlinePrice,
  1769. offlineClassesUnitPrice: this.rightForm.offlinePrice,
  1770. paymentPrice: "",
  1771. });
  1772. }
  1773. });
  1774. },
  1775. // 制定属性去重
  1776. deweight(arr, key) {
  1777. let res = [];
  1778. arr.forEach((item) => {
  1779. let list = [];
  1780. res.forEach((resitem) => {
  1781. list.push(resitem[key]);
  1782. });
  1783. if (list.indexOf(item[key]) === -1) {
  1784. res.push(item);
  1785. }
  1786. });
  1787. return res;
  1788. },
  1789. getStartTime(val) {
  1790. if (val) {
  1791. let date = dayjs(new Date()).format("YYYY-MM-DD");
  1792. this.maskForm.endTime = addTimerFormMinute(
  1793. date,
  1794. val,
  1795. this.leftForm.classTime
  1796. );
  1797. } else {
  1798. this.maskForm.endTime = "";
  1799. }
  1800. if (!this.maskForm.endTime) {
  1801. this.maskForm.startTime = "";
  1802. }
  1803. },
  1804. changeStudentMoney(val) {
  1805. if (val) {
  1806. this.computationalBtn = false;
  1807. }
  1808. },
  1809. },
  1810. // watch: {
  1811. // rightForm: {
  1812. // handler (newName, oldName) {
  1813. // this.computationalBtn = false
  1814. // },
  1815. // deep: true
  1816. // }
  1817. // }
  1818. };
  1819. </script>
  1820. <style lang="scss" scoped>
  1821. .computeMoney {
  1822. margin-top: 10px;
  1823. float: right;
  1824. }
  1825. .m-core {
  1826. margin-top: 30px;
  1827. // display: flex;
  1828. // flex-direction: row;
  1829. // justify-content: space-around;
  1830. .el-input {
  1831. width: 180px;
  1832. }
  1833. h4 {
  1834. font-size: 16px;
  1835. background-color: #ccc;
  1836. color: #fff;
  1837. // text-align: center;
  1838. width: 100%;
  1839. height: 40px;
  1840. line-height: 40px;
  1841. margin-bottom: 20px;
  1842. padding: 0 20px;
  1843. }
  1844. // .vipLeft {
  1845. // width: 400px;
  1846. // // h4 {
  1847. // // font-size: 16px;
  1848. // // background-color: #ccc;
  1849. // // color: #fff;
  1850. // // text-align: center;
  1851. // // width: 100%;
  1852. // // height: 40px;
  1853. // // line-height: 40px;
  1854. // // margin-bottom: 20px;
  1855. // // }
  1856. // }
  1857. // .center {
  1858. // width: 400px;
  1859. // }
  1860. // .right {
  1861. // width: 400px;
  1862. // }
  1863. }
  1864. .vipMsg {
  1865. margin-bottom: 20px;
  1866. }
  1867. .planList {
  1868. padding: 0 25px;
  1869. .planTop {
  1870. height: 40px;
  1871. line-height: 40px;
  1872. display: flex;
  1873. flex-direction: row;
  1874. justify-content: space-between;
  1875. border-bottom: 1px solid #ccc;
  1876. margin-top: 20px;
  1877. > p {
  1878. font-size: 14px;
  1879. }
  1880. }
  1881. .planCore {
  1882. .row {
  1883. width: 100%;
  1884. display: flex;
  1885. flex-direction: row;
  1886. justify-content: space-between;
  1887. flex-wrap: nowrap;
  1888. height: 40px;
  1889. line-height: 40px;
  1890. font-size: 14px;
  1891. text-align: center;
  1892. div {
  1893. width: 87px;
  1894. }
  1895. // div {
  1896. // &:nth-child(1) {
  1897. // text-align: left;
  1898. // }
  1899. // }
  1900. }
  1901. }
  1902. }
  1903. .okBtn {
  1904. width: 120px;
  1905. height: 40px;
  1906. line-height: 40px;
  1907. text-align: center;
  1908. color: #fff;
  1909. border-radius: 4px;
  1910. margin-right: 20px;
  1911. cursor: pointer;
  1912. background-color: #f97215;
  1913. float: right;
  1914. }
  1915. .submitP {
  1916. margin-bottom: 20px;
  1917. font-size: 14px;
  1918. padding-left: 24px;
  1919. }
  1920. </style>