Update.vue 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397
  1. <style lang="scss">
  2. .apply{
  3. .filter{
  4. background: #fff;
  5. padding: 20px 20px 10px;
  6. border:1px solid #EDEDED;
  7. border-radius:2px;
  8. margin-bottom: 10px;
  9. margin-top: 10px;
  10. .el-form-item{
  11. margin-bottom: 10px;
  12. }
  13. .el-input,.el-select{
  14. width: 150px;
  15. }
  16. }
  17. .el-divider--horizontal{
  18. margin: 10px 0 20px;
  19. }
  20. .divider{
  21. // margin-bottom: 15px;
  22. background: #fff;
  23. padding: 10px;
  24. }
  25. thead{
  26. th{
  27. background: #eee;
  28. }
  29. }
  30. }
  31. .table{
  32. button{
  33. padding:6px;
  34. }
  35. }
  36. </style>
  37. <template>
  38. <section class="apply">
  39. <p>报名信息 > 复审</p>
  40. <div class="filter">
  41. <el-form label-width="80px" :inline="true">
  42. <!-- <el-divider></el-divider> -->
  43. <el-form-item label="姓名">
  44. <el-input placeholder="姓名" v-model="form.name"></el-input>
  45. </el-form-item>
  46. <el-form-item label="联系电话">
  47. <el-input placeholder="联系电话" v-model="form.phone"></el-input>
  48. </el-form-item>
  49. <el-form-item label="报名时间">
  50. <el-date-picker clearable
  51. v-model="form.signup_time"
  52. type="date" value-format="yyyy-MM-dd"
  53. placeholder="选择日期">
  54. </el-date-picker>
  55. </el-form-item>
  56. <el-form-item label="发票类型">
  57. <el-select v-model="form.bill_type" placeholder="请选择" clearable>
  58. <el-option label="不需要发票" :value="0"></el-option>
  59. <el-option label="个人发票" :value="1"></el-option>
  60. <el-option label="公司发票" :value="2"></el-option>
  61. </el-select>
  62. </el-form-item>
  63. <el-form-item label="领证方式" clearable>
  64. <el-select v-model="form.a" placeholder="请选择">
  65. <el-option label="邮寄" :value="1"></el-option>
  66. <el-option label="自取" :value="0"></el-option>
  67. </el-select>
  68. </el-form-item>
  69. <el-form-item label="考试设置">
  70. <el-select v-model="form.a" placeholder="请选择" clearable>
  71. <el-option label="已设置考试时间" :value="1"></el-option>
  72. <el-option label="未设置考试时间" :value="0"></el-option>
  73. </el-select>
  74. </el-form-item>
  75. <el-form-item label="考试时间" >
  76. <el-date-picker clearable
  77. v-model="form.exam_time" value-format="yyyy-MM-dd"
  78. type="date"
  79. placeholder="选择日期">
  80. </el-date-picker>
  81. </el-form-item>
  82. <!-- <el-form-item label="培训班级">
  83. <el-select v-model="form.a" placeholder="请选择">
  84. <el-option label="不需要发票" :value="0"></el-option>
  85. <el-option label="纸质发票" :value="0"></el-option>
  86. </el-select>
  87. </el-form-item> -->
  88. <el-form-item label="公司名称">
  89. <el-input placeholder="公司名称" v-model="form.company"></el-input>
  90. </el-form-item>
  91. <el-form-item label="培训时间">
  92. <el-date-picker clearable
  93. v-model="form.train_time"
  94. type="daterange" value-format="yyyy-MM-dd"
  95. range-separator="至"
  96. start-placeholder="开始日期"
  97. end-placeholder="结束日期">
  98. </el-date-picker>
  99. </el-form-item>
  100. <el-form-item>
  101. <el-form-item label="类别">
  102. <Subject @subChange='subChange'/>
  103. </el-form-item>
  104. <el-button @click="list=[],getData()" type="primary" icon="el-icon-search">搜索</el-button>
  105. </el-form-item>
  106. <el-divider></el-divider>
  107. </el-form>
  108. <el-tabs v-model="order_status" @tab-click="tabClick">
  109. <el-tab-pane name="-3" label="全部"></el-tab-pane>
  110. <el-tab-pane name="0" label="待审核"></el-tab-pane>
  111. <el-tab-pane name="2" label="已支付待培训"></el-tab-pane>
  112. <el-tab-pane name="-2" label="审核未通过"></el-tab-pane>
  113. <el-tab-pane name="1" label="待付款"></el-tab-pane>
  114. <el-tab-pane name="-1" label="待上传资料"></el-tab-pane>
  115. <!-- <el-tab-pane name="7" label="已培训待考试"></el-tab-pane> -->
  116. <el-tab-pane name="3" label="考试完成"></el-tab-pane>
  117. <!-- <el-tab-pane name="9" label="已取消"></el-tab-pane> -->
  118. </el-tabs>
  119. </div>
  120. <div class="divider">
  121. <el-button @click="setStatus(1,'审核通过')" size="small" type="success" >审核通过</el-button>
  122. <el-button @click="setStatus(-2,'审核不通过')" size="small" type="info" >审核不通过</el-button>
  123. <el-button @click="setStatus(2,'已付款')" size="small" type="primary" >已付款</el-button>
  124. <el-button @click="setStatus(3,'已培训')" size="small" type="danger" >已培训</el-button>
  125. <el-button @click="setStatus(4,'考试完成')" size="small" type="success" >考试完成</el-button>
  126. <el-button @click="setTime(1)" size="small" type="primary" >设置培训时间</el-button>
  127. <el-button @click="setTime(2)" size="small" type="primary" >设置考试时间</el-button>
  128. <el-divider direction="vertical"></el-divider>
  129. <el-button @click="download('exam')" size="small" type="warning" >导出考勤表与申报考试表</el-button>
  130. <el-button @click="download('apply')" size="small" type="warning" >导出学员申报资料</el-button>
  131. </div>
  132. <el-table
  133. class="table"
  134. :data="list"
  135. @selection-change="handleSelectionChange"
  136. border
  137. style="width: 100%">
  138. <el-table-column
  139. type="selection" fixed="left"
  140. width="40">
  141. </el-table-column>
  142. <el-table-column
  143. prop="name" width="100"
  144. label="姓名">
  145. </el-table-column>
  146. <el-table-column
  147. prop="phone"
  148. label="联系电话">
  149. </el-table-column>
  150. <el-table-column
  151. prop="order_status"
  152. label="状态">
  153. <template slot-scope="scope">
  154. <el-tag v-if='scope.row.order_status == -2' type="info">审核未通过</el-tag>
  155. <el-tag v-if='scope.row.order_status == -1' >待提交资料</el-tag>
  156. <el-tag v-if='scope.row.order_status == 0' type="warning">待审核</el-tag>
  157. <el-tag v-if='scope.row.order_status == 1' >已审核立即支付</el-tag>
  158. <el-tag v-if='scope.row.order_status == 2' type="warning">学习中</el-tag>
  159. <el-tag v-if='scope.row.order_status == 3' type="success">已培训</el-tag>
  160. <el-tag v-if='scope.row.order_status == 4' type="success">已完成</el-tag>
  161. <!-- -2:审核未通过,-1:待提交资料,0:待审核,1:已审核立即支付,2:学习中,3:已完成 -->
  162. </template>
  163. </el-table-column>
  164. <el-table-column
  165. prop="remark"
  166. label="管理员备注">
  167. </el-table-column>
  168. <el-table-column
  169. prop="subject_item0"
  170. label="报名类型">
  171. </el-table-column>
  172. <el-table-column
  173. prop="subject_item1"
  174. label="作业类别">
  175. </el-table-column>
  176. <el-table-column
  177. prop="subject_item2"
  178. label="准操项目">
  179. </el-table-column>
  180. <el-table-column
  181. prop="train_type"
  182. label="培训类型">
  183. </el-table-column>
  184. <el-table-column
  185. prop="zip" width="220" fixed="right"
  186. label="操作">
  187. <template slot-scope="scope">
  188. <el-button @click="mark(scope.row.id,scope.row.remark)" size="mini" type="primary">备注</el-button>
  189. <el-button @click="$router.push({path:'/sign/detail',query:{id:scope.row.id}})" size="mini" type="success">查看</el-button>
  190. <el-button @click="$router.push({path:'/sign/edit',query:{id:scope.row.id}})" size="mini" type="warning">编辑</el-button>
  191. <el-button @click="del(scope.row.id)" size="mini" type="danger">删除</el-button>
  192. </template>
  193. </el-table-column>
  194. </el-table>
  195. <Page ref="pageButton" :total='total' @pageChange='gopage'/>
  196. <el-dialog
  197. :title="text"
  198. :visible.sync="dialogVisible"
  199. width="30%">
  200. <el-date-picker
  201. v-model="time" v-if='date_type == 1'
  202. type="daterange" value-format="yyyy-MM-dd"
  203. range-separator="至"
  204. start-placeholder="开始日期"
  205. end-placeholder="结束日期">
  206. </el-date-picker>
  207. <el-date-picker
  208. v-model="time" v-else
  209. type="date" value-format="yyyy-MM-dd">
  210. </el-date-picker>
  211. <span slot="footer" class="dialog-footer">
  212. <el-button @click="dialogVisible = false">取 消</el-button>
  213. <el-button type="primary" @click="save">确 定</el-button>
  214. </span>
  215. </el-dialog>
  216. </section>
  217. </template>
  218. <script>
  219. import Page from '../../components/Page';
  220. import Subject from '../../components/Subject';
  221. // import { Base64 } from 'js-base64';
  222. export default {
  223. components:{
  224. Page,Subject
  225. },
  226. data(){
  227. return{
  228. text:'批量设置培训时间',
  229. date_type:1,
  230. time:'',
  231. form:{train_type:'复审',subject_item:'',order_status:'',page:1},
  232. activeName:"1",
  233. total:1,
  234. list:[],
  235. order_status:'-3',
  236. ids:[],
  237. dialogVisible:false,
  238. url:''
  239. }
  240. },
  241. methods:{
  242. gopage(){
  243. this.form.page=this.$refs.pageButton.page
  244. this.getData()
  245. },
  246. getData(){
  247. var parm=this.form;
  248. if(this.order_status != '-3'){parm.order_status=this.order_status}
  249. this.$api.getSignList(parm).then(res=>{
  250. this.list=res.data.data.list
  251. this.total=res.data.data.total
  252. })
  253. },
  254. subChange(data){
  255. this.form.subject_item=data.join('|')
  256. },
  257. tabClick(tab){
  258. this.form.order_status=tab.name
  259. this.list=[]
  260. this.getData()
  261. },
  262. del(id){
  263. this.$confirm('确定删除吗', '提示', {
  264. type: 'warning'
  265. }).then(() => {
  266. this.$api.deleteSign({id:id}).then((res)=>{
  267. this.$message({
  268. message: '删除成功',
  269. type: 'success'
  270. })
  271. this.getData()
  272. })
  273. })
  274. },
  275. mark(id,val){
  276. this.$prompt('', '管理员备注', {
  277. confirmButtonText: '确定',
  278. cancelButtonText: '取消',
  279. inputValue:val,
  280. }).then(({ value }) => {
  281. this.$api.updateSign({id:id,remark:value}).then(res=>{
  282. if(res.data.code==0){
  283. this.$message({message: '备注成功!',type: 'success'});
  284. this.getData()
  285. }else{
  286. this.$message.error(res.data.message);
  287. }
  288. })
  289. })
  290. },
  291. handleSelectionChange(val) {
  292. this.ids=val
  293. console.log(val)
  294. },
  295. setStatus(type,text){
  296. var ids=[],val=this.ids;
  297. for(let i=0;i<val.length;i++){
  298. ids.push(val[i].id)
  299. }
  300. var id = ids.join(',');
  301. if(val.length>0){
  302. this.$confirm('确定修改状态为'+text, '提示', {
  303. type: 'warning'
  304. }).then(() => {
  305. this.$api.updateSignStu({id:id,order_status:type}).then((res)=>{
  306. this.$message({
  307. message: '修改成功',
  308. type: 'success'
  309. })
  310. this.getData()
  311. })
  312. })
  313. }else{
  314. this.$message.error('请选择数据');
  315. }
  316. },
  317. setTime(type){
  318. var ids=[],val=this.ids;
  319. for(let i=0;i<val.length;i++){
  320. ids.push(val[i].id)
  321. }
  322. var id = ids.join(',');
  323. this.select_ids=id;
  324. if(val.length>0){
  325. this.date_type=type
  326. if(type == 1){
  327. this.text='批量设置培训时间'
  328. }else{
  329. this.text='批量设置考试时间'
  330. }
  331. this.dialogVisible=true;
  332. }else{
  333. this.$message.error('请选择数据');
  334. }
  335. },
  336. save(){
  337. var parm={id:this.select_ids}
  338. if(this.date_type == 1){
  339. parm.train_time=this.time.join(',')
  340. }else{
  341. parm.exam_time=this.time
  342. }
  343. this.$api.updateSign(parm).then((res)=>{
  344. if(res.data.code == 0){
  345. this.$message({
  346. message: '修改成功',
  347. type: 'success'
  348. })
  349. this.dialogVisible=false
  350. this.getData()
  351. }else{
  352. this.$message.error(res.data.message);
  353. }
  354. })
  355. },
  356. download(type){
  357. var ids=[],val=this.ids;
  358. for(let i=0;i<val.length;i++){
  359. ids.push(val[i].id)
  360. }
  361. var id = ids.join(',');
  362. var parm={
  363. id:id,
  364. type:type
  365. }
  366. if(val.length>0){
  367. this.$api.downloadzip(parm).then(res=>{
  368. if(res.data.code == 0){
  369. var elink = document.createElement('a');
  370. let blob=new Blob([res.data], {type: 'application/zip'});
  371. let objUrl=URL.createObjectURL(blob);
  372. let file_name=res.headers['content-disposition'].split('=')[1];
  373. elink.download = file_name;
  374. elink.style.display = 'none';
  375. elink.href = objUrl;
  376. document.body.appendChild(elink);
  377. elink.click();
  378. document.body.removeChild(elink);
  379. }else{
  380. this.$message.error(res.data.message);
  381. }
  382. })
  383. }else{
  384. this.$message.error('请选择数据');
  385. }
  386. }
  387. },
  388. created(){
  389. this.getData()
  390. }
  391. }
  392. </script>