|
|
@@ -0,0 +1,347 @@
|
|
|
+@extends('layouts.app')
|
|
|
+
|
|
|
+@section('title','需求')
|
|
|
+
|
|
|
+@section('content')
|
|
|
+ <nav id="nav2">
|
|
|
+ @component('demand.menu')@endcomponent
|
|
|
+ @component('demand.search.menu')@endcomponent
|
|
|
+ </nav>
|
|
|
+
|
|
|
+ <div class="container-fluid d-none" id="list">
|
|
|
+ <div id="form_div"></div>
|
|
|
+
|
|
|
+ @include('demand.search._table')
|
|
|
+ @include('demand.search._uploadFile')
|
|
|
+
|
|
|
+ </div>
|
|
|
+@endsection
|
|
|
+
|
|
|
+@section('lastScript')
|
|
|
+ <script src="{{mix('js/queryForm/queryForm.js')}}"></script>
|
|
|
+
|
|
|
+ <script>
|
|
|
+ let demand_vue = new Vue({
|
|
|
+ el: '#list',
|
|
|
+ data: {
|
|
|
+ demands: {!! $demands->toJson() !!}['data'],
|
|
|
+ status: [
|
|
|
+ {name: 0, value: '未处理'}, {name: 1, value: '处理中'}, {name: 2, value: '已处理'},
|
|
|
+ ],
|
|
|
+ types: [
|
|
|
+ {name: 0, value: '需求'}, {name: 1, value: '问题'}
|
|
|
+ ],
|
|
|
+ selectTr: null,
|
|
|
+ uploadError: [],
|
|
|
+ selectDemand: null,
|
|
|
+ selectIndex: null,
|
|
|
+ imgs: [],
|
|
|
+ },
|
|
|
+ created() {
|
|
|
+ let that = this;
|
|
|
+ this.demands.forEach(function (item, index, self) {
|
|
|
+ that.initDemand(self[index]);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ this.imgs = Array.from(document.getElementById('list').querySelectorAll('img'));
|
|
|
+ this.lazy();
|
|
|
+ if (this.imgs && this.imgs.length > 0) {
|
|
|
+ window.addEventListener('scroll', this.lazy)
|
|
|
+ }
|
|
|
+ console.log(this.imgs);
|
|
|
+ $('#list').removeClass('d-none');
|
|
|
+ let data = [
|
|
|
+ [
|
|
|
+ {name: 'created_at_start', type: 'time', tip: '创建开始时间'},
|
|
|
+ {name: 'created_at_end', type: 'time', tip: '创建结束时间'},
|
|
|
+ {name: 'type', type: 'select', data: this.types, placeholder: '类型'},
|
|
|
+ ]
|
|
|
+ ];
|
|
|
+ let form = new query({
|
|
|
+ el: "#form_div",
|
|
|
+ condition: data,
|
|
|
+ });
|
|
|
+ form.init();
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ initDemand(demand) {
|
|
|
+ demand['status'] = this.status[demand['status']]['value'] ?? '';
|
|
|
+ demand['type'] = this.types[demand['type']]['value'] ?? '';
|
|
|
+ demand['showAddDiv']= false;
|
|
|
+ demand['showAddBtn']= false;
|
|
|
+ if (demand['upload_file']) this.setImgUrl(demand['upload_file']);
|
|
|
+ if (demand['processes']){
|
|
|
+ demand['processes'].forEach(function(item,index,self){
|
|
|
+ self[index]['status'] = false;
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ setImgUrl(uploadFile) {
|
|
|
+ let url = '{{url('/storage/')}}';
|
|
|
+ let urlPath = uploadFile['url'];
|
|
|
+ let type = uploadFile.type;
|
|
|
+ uploadFile['url'] = url + urlPath + '-thumbnail.' + type;
|
|
|
+ uploadFile['bulkyUrl'] = url + urlPath + '-bulky.' + type;
|
|
|
+ uploadFile['commonUrl'] = url + urlPath + '-common.' + type;
|
|
|
+ },
|
|
|
+ /** 完结需求 */
|
|
|
+ finishDemand(demand,index) {
|
|
|
+ let url = '{{url('apiLocal/demand/finish')}}';
|
|
|
+ window.tempTip.setDuration(3000);
|
|
|
+ window.axios.post(url, {id: demand['id']}).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ window.tempTip.showSuccess('需求完结成功');
|
|
|
+ demand.status = '已处理'
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ window.tempTip.show('需求完结失败' + res.data.data);
|
|
|
+ }).catch(err => {
|
|
|
+ window.tempTip.show('需求完结异常' + err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 删除 */
|
|
|
+ destroyDemand(demand, index) {
|
|
|
+ if (!confirm('确定要删除当前需求吗?')) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ let url = '{{url('apiLocal/demand/destroy?id=')}}' + demand['id'];
|
|
|
+
|
|
|
+ window.axios.delete(url).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ window.tempTip.showSuccess('删除成功!');
|
|
|
+ this.$delete(this.demands,index);
|
|
|
+ this.imgs = Array.from(document.getElementById('list').querySelectorAll('img'));
|
|
|
+ this.lazy();
|
|
|
+ this.$forceUpdate();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ window.tempTip.show(res.data.data);
|
|
|
+ }).catch(err => {
|
|
|
+ window.tempTip.show('删除出现异常' + err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 添加处理过程 */
|
|
|
+ addProcess(demand) {
|
|
|
+ window.tempTip.setDuration(3000);
|
|
|
+ let url = '{{url('apiLocal/demand/process/store')}}';
|
|
|
+ let process = $('#addProcess'+demand['id']).val();
|
|
|
+ let data = {'demand_id': demand['id'], 'explain': process};
|
|
|
+ if(process === null || process.length === 0){
|
|
|
+ window.tempTip.show('输入内容');
|
|
|
+ $('#addProcess'+demand['id']).focus();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ window.axios.post(url, data).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ if(!demand['processes'])demand['processes']= [res.data.data];
|
|
|
+ else demand['processes'].unshift(res.data.data);
|
|
|
+ this.$forceUpdate();
|
|
|
+ window.tempTip.showSuccess('添加处理过程成功');
|
|
|
+ $('#addProcess'+demand['id']).val();
|
|
|
+ this.toggleAddDiv(demand,demand['id']);
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ $('#addProcess'+demand['id']).focus();
|
|
|
+ window.tempTip.show('添加处理过程失败')
|
|
|
+ }).catch(err => {
|
|
|
+ $('#addProcess'+demand['id']).focus();
|
|
|
+ window.tempTip.show('添加处理过程异常:' + err);
|
|
|
+ });
|
|
|
+
|
|
|
+ },
|
|
|
+ /** 文件上传 */
|
|
|
+ uploadFile() {
|
|
|
+ let fileInput = document.querySelector('#upLoadFile-input');
|
|
|
+ let url = '{{url('apiLocal/demand/uploadFile')}}';
|
|
|
+
|
|
|
+ let formData = new FormData();
|
|
|
+ formData.append('id', this.selectDemand);
|
|
|
+ let file = fileInput.files[0];
|
|
|
+ formData.append('file', file);
|
|
|
+ tempTip.setDuration(9999)
|
|
|
+ tempTip.setIndex(1051)
|
|
|
+ tempTip.waitingTip('上传中......');
|
|
|
+
|
|
|
+ if(fileInput.files.length === 0){
|
|
|
+ tempTip.cancelWaitingTip();
|
|
|
+ this.uploadError = ['请选择上传文件'];
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ let that = this;
|
|
|
+ window.axios.post(url, formData, {
|
|
|
+ 'Content-Type': 'multipart/form-data'
|
|
|
+ }).then(res => {
|
|
|
+ tempTip.cancelWaitingTip()
|
|
|
+ tempTip.setDuration(2000)
|
|
|
+ if (res.data.success) {
|
|
|
+ this.initDemand(res.data.data);
|
|
|
+ this.$set(this.demands, this.selectIndex, res.data.data);
|
|
|
+ $('#uploadFile').modal('hide');
|
|
|
+ setTimeout(function(){
|
|
|
+ that.imgs.push(document.getElementById('img_'+res.data.data['id']));
|
|
|
+ that.lazy();
|
|
|
+ },1);
|
|
|
+ window.tempTip.showSuccess('文件上传成功');
|
|
|
+ this.$forceUpdate();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if(res.data.errors)this.uploadError = res.data.errors;
|
|
|
+ window.tempTip.show('文件上传失败');
|
|
|
+ }).catch(err => {
|
|
|
+ tempTip.cancelWaitingTip()
|
|
|
+ window.tempTip.show('文件上传异常:' + err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 修改需求描述 */
|
|
|
+ updateDemand(demand, column, $e) {
|
|
|
+ let url = '{{url('apiLocal/demand/update')}}';
|
|
|
+ let data = {'id': demand['id']};
|
|
|
+ let value = $($e.target).val();
|
|
|
+ data[column] = value;
|
|
|
+
|
|
|
+ window.tempTip.setDuration(3000);
|
|
|
+ window.axios.post(url, data).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ demand[column] = value;
|
|
|
+ this.$forceUpdate();
|
|
|
+ window.tempTip.showSuccess('修改需求成功');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ window.tempTip.show(res.data.data);
|
|
|
+ }).catch(err => {
|
|
|
+ window.tempTip.show('修改需求描述异常:' + err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ /** 问题认领 */
|
|
|
+ claimDemand(demand, index) {
|
|
|
+ console.log(demand);
|
|
|
+ let url = '{{url('apiLocal/demand/claim')}}';
|
|
|
+ window.tempTip.setDuration(3000);
|
|
|
+ window.axios.post(url, {id: demand['id']}).then(res => {
|
|
|
+ if (res.data.success) {
|
|
|
+ this.initDemand(res.data.data);
|
|
|
+ this.$set(this.demands, index, res.data.data);
|
|
|
+ window.tempTip.showSuccess('认领成功!');
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ if (res.data.errors) window.tempTip.show(res.data.errors);
|
|
|
+ else window.tempTip.show(res.data.data);
|
|
|
+ }).catch(err => {
|
|
|
+ window.tempTip.show('认领出现异常' + err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ showUploadDiv(demand, index) {
|
|
|
+ this.selectDemand = demand['id'];
|
|
|
+ this.selectIndex = index;
|
|
|
+ this.uploadError = [];
|
|
|
+ $('#uploadFile').modal('show');
|
|
|
+ },
|
|
|
+ lazy() {
|
|
|
+ //可视区域高度
|
|
|
+ let height = window.innerHeight;
|
|
|
+ //滚动区域高度
|
|
|
+ let scrollHeight = document.documentElement.scrollTop || document.body.scrollTop;
|
|
|
+ let _this = this;
|
|
|
+ this.imgs.forEach(function (img, i) {
|
|
|
+ if ((height + scrollHeight) > $('#' + img.getAttribute('id')).offset().top && img.getAttribute('data-src')) {
|
|
|
+ let temp = new Image();
|
|
|
+ temp.src = img.getAttribute('data-src');
|
|
|
+ temp.onload = function () {
|
|
|
+ img.src = img.getAttribute('data-src');
|
|
|
+ _this.$delete(_this.imgs, i);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ removeCommonImg(id) {
|
|
|
+ $('#' + id).remove();
|
|
|
+ },
|
|
|
+ commonImg(id, demand,index) {
|
|
|
+ if (!demand['upload_file']) return;
|
|
|
+ let bulkyUrl = demand['upload_file']['bulkyUrl'];
|
|
|
+ let commonUrl = demand['upload_file']['commonUrl'];
|
|
|
+ $('#' + id).after(
|
|
|
+ "<div id=\"imgBulky_" + demand['id'] + "\" style='position: absolute;padding-top: 2px;z-index: 99'>" +
|
|
|
+ "<div style='position:absolute'>" +
|
|
|
+ "<div >" +
|
|
|
+ "<a target='_blank' href='" + bulkyUrl + "'>" +
|
|
|
+ "<img src='" + commonUrl + "'" + "style='position: relative;left:-50px;' >" +
|
|
|
+ "</a>" +
|
|
|
+ "</div>" +
|
|
|
+ "<button type='button' class='btn btn-sm btn-danger' onclick='demand_vue.btnDeleteImg(this,"+index+")' value='" + id + "' style='position: relative;float: right;margin-right: 51px;margin-top: -30px;' >删除</button>" +
|
|
|
+ "</div>" +
|
|
|
+ "</div>");
|
|
|
+ },
|
|
|
+ btnDeleteImg(e,index) {
|
|
|
+ let idStr = $(e).val()
|
|
|
+ let id = idStr.substr(idStr.indexOf('_') + 1)
|
|
|
+ if (!confirm('确定要删除所选图片吗?')) return;
|
|
|
+ this.destroyImg(id,index);
|
|
|
+ },
|
|
|
+ destroyImg(id,index) {
|
|
|
+ let url = '{{url('apiLocal/demand/destroyFile/?id=')}}'+id;
|
|
|
+ window.tempTip.setDuration(3000);
|
|
|
+ window.axios.delete(url).then(res=>{
|
|
|
+ if(res.data.success){
|
|
|
+ window.tempTip.showSuccess('附件删除成功!');
|
|
|
+ this.$delete(this.demands[index],['upload_file']);
|
|
|
+ this.$forceUpdate();
|
|
|
+ return ;
|
|
|
+ }
|
|
|
+ window.tempTip.show('附件删除异常:'+res.data.data);
|
|
|
+ }).catch(err=>{
|
|
|
+ window.tempTip.show(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ toggleAddDiv(demand,id){
|
|
|
+ let div = $('#addDiv_'+id);
|
|
|
+ if(demand['showAddDiv']){
|
|
|
+ div.addClass('d-none');
|
|
|
+ }else{
|
|
|
+ div.removeClass('d-none');
|
|
|
+ }
|
|
|
+ demand['showAddDiv'] = !demand['showAddDiv'];
|
|
|
+ },
|
|
|
+ toggleDelBtn(demandId,process){
|
|
|
+ let btn = $('#demand-'+demandId+'process-'+process['id']);
|
|
|
+ if(process['status']){
|
|
|
+ btn.addClass('d-none');
|
|
|
+ }else{
|
|
|
+ btn.removeClass('d-none');
|
|
|
+ }
|
|
|
+ process['status'] = !process['status'];
|
|
|
+ },
|
|
|
+ showAddBtn(demand){
|
|
|
+ if(demand['showAddBtn']){
|
|
|
+ $("#addBtn_"+demand.id).addClass('d-none');
|
|
|
+ }else{
|
|
|
+ $("#addBtn_"+demand.id).removeClass('d-none');
|
|
|
+ }
|
|
|
+ demand['showAddBtn'] = !demand['showAddBtn'];
|
|
|
+ },
|
|
|
+ deleteProcess(demand,process,process_i,index){
|
|
|
+ if (!confirm('确定要删除当前描述吗?')) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+
|
|
|
+ let url = '{{url('apiLocal/demand/process/destroy/?id=')}}'+ process['id'];
|
|
|
+ window.tempTip.setDuration(3000);
|
|
|
+ window.axios.delete(url).then(res=>{
|
|
|
+ if(res.data.success){
|
|
|
+ this.$delete(this.demands[index]['processes'],process_i);
|
|
|
+ demand.processes.slice(process_i,0);
|
|
|
+ window.tempTip.showSuccess('描述删除成功!');
|
|
|
+ this.$forceUpdate();
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ window.tempTip.show('描述删除失败!'+res.data.data ? res.data.data : '' );
|
|
|
+ }).catch(err=>{
|
|
|
+ window.tempTip.show(err);
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+@endsection
|