|
|
@@ -7,19 +7,37 @@
|
|
|
<div class="container-fluid" id="issue_import_div">
|
|
|
<div class="card col-md-8 offset-md-2">
|
|
|
<div class="card-body">
|
|
|
- <form action="{{url('order/issue/batchImport')}}" method="post" enctype="multipart/form-data" class="form" target="_blank">
|
|
|
- @csrf
|
|
|
+
|
|
|
+ <div class="form-group row text-center">
|
|
|
+ <div class="col-12 text-danger">
|
|
|
+ 注意:请保证表第一行有以下对应的字段名<br><span class="text-muted">(可不按顺序):</span><br>
|
|
|
+ 原始运单号,情况说明,问题类别<br>
|
|
|
+ <span class="text-muted" style="opacity:0.7"> 订单问题类别:('拦截', '快递异常', '信息更改', '联系不上', '其他', '错漏发', '仓库问题', '快递丢件', '破损', '撤销丢件', '二次加工', '全检问题', '系统问题', '延迟发货', '仓库丢件', )<br></span>
|
|
|
+ </div>
|
|
|
+ <div class="col-12 text-info ">
|
|
|
+ 导入时间随文件大小可能达数十分钟以上,请耐心等候
|
|
|
+ <hr>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ @can('订单管理-订单问题件生成-文本导入')
|
|
|
<div class="form-group row text-center">
|
|
|
<div class="col-12 text-danger">
|
|
|
- 注意:请保证表第一行有以下对应的字段名<br><span class="text-muted">(可不按顺序):</span><br>
|
|
|
- 原始运单号,情况说明,问题类别<br>
|
|
|
- <span class="text-muted" style="opacity:0.7"> 订单问题类别:('拦截', '快递异常', '信息更改', '联系不上', '其他', '错漏发', '仓库问题', '快递丢件', '破损', '撤销丢件', '二次加工', '全检问题', '系统问题', '延迟发货', '仓库丢件', )<br></span>
|
|
|
+ 订单问题类别:同Excel文件导入所要求的订单问题类别一致<br/>
|
|
|
+ 注意:文本导入的问题件只有全部符合条件的才能生成问题件<br/>
|
|
|
+ <span class="text-muted" style="opacity:0.7">
|
|
|
+ 如果在导入后出现部分数据导入失败,修改对应错误的数据继续导入即可
|
|
|
+ </span>
|
|
|
</div>
|
|
|
- <div class="col-12 text-info ">
|
|
|
- 导入时间随文件大小可能达数十分钟以上,请耐心等候
|
|
|
- <hr>
|
|
|
+ </div>
|
|
|
+ <div class="form-group row">
|
|
|
+ <div class="col-8 offset-2">
|
|
|
+ <button type="button" class="btn form-control btn-primary" @click="showPasteDataModal">文本导入</button>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <hr/>
|
|
|
+ @endcan
|
|
|
+ <form action="{{url('order/issue/batchImport')}}" method="post" enctype="multipart/form-data" class="form" target="_blank">
|
|
|
+ @csrf
|
|
|
<div class="form-group row">
|
|
|
<label for="sku" class="col-2 col-form-label text-right">选择EXCEL</label>
|
|
|
<div class="col-8">
|
|
|
@@ -42,10 +60,106 @@
|
|
|
</form>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <div class="modal fade" id="pasteData" role="dialog" tabindex="-1" aria-labelledby="pasteDataTetlie" aria-hidden="true">
|
|
|
+ <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
|
|
|
+ <div class="modal-content">
|
|
|
+ <div class="modal-header">
|
|
|
+ <div class="row modal-title font-weight-bold w-100 text-nowrap ml-1 noselect" id="pasteDataTitle">
|
|
|
+ <span v-for="(row,i) in rows" draggable="true"
|
|
|
+ @drop="drop($event,i)" @dragover="dragover($event)" @dragstart="dragstart($event,i)"
|
|
|
+ class="col-4 border" style="cursor: move"
|
|
|
+ :class="requiredRows.includes(row)?'text-danger':''">@{{ row }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="modal-body text-center">
|
|
|
+ <button type="button" id="popover" class="btn btn-danger" v-if="popoverContent"
|
|
|
+ data-container="body" data-toggle="popover" data-placement="bottom"
|
|
|
+ :data-content="popoverContent" data-html="true">
|
|
|
+ 部分数据导入失败
|
|
|
+ </button>
|
|
|
+ <textarea id="pasteDataText" class="w-100" style="height: 400px" v-model="pasteDataText"
|
|
|
+ @keydown.tab="forbidTab($event)" @keyup.tab="replaceSpacing()"
|
|
|
+ placeholder="内容可为EXCEL复制,也可手动输入使用“TAB”缩进符区分列,请注意表头顺序,可拖拽表头字段调整顺序,以该顺序为准"></textarea>
|
|
|
+ </div>
|
|
|
+ <div class="modal-footer">
|
|
|
+ <button class="btn btn-primary" @click="importPasteData">开始导入</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
@endsection
|
|
|
|
|
|
@section('lastScript')
|
|
|
+ <script>
|
|
|
+ let listVue = new Vue({
|
|
|
+ el:'#issue_import_div',
|
|
|
+ data:{
|
|
|
+ rows:['原始运单号','情况说明','问题类别'],
|
|
|
+ requiredRows:['原始运单号','情况说明','问题类别'],
|
|
|
+ popoverContent:'',
|
|
|
+ pasteDataText: '',
|
|
|
+ },
|
|
|
+ mounted:function(){
|
|
|
+ $('[data-toggle="popover"]').popover();
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ showPasteDataModal(){
|
|
|
+ $('#popover').attr('hidden','hidden')
|
|
|
+ $('#pasteData').modal('show')
|
|
|
+ },
|
|
|
+ drop(e,index){
|
|
|
+ e.preventDefault();
|
|
|
+ if (this.dom !== e.target.innerHTML){
|
|
|
+ this.dom.innerHTML = e.target.innerHTML;
|
|
|
+ let temp=JSON.parse(JSON.stringify(this.rows[index]));
|
|
|
+ this.$set(this.rows,index,this.rows[e.dataTransfer.getData('text/html')]);
|
|
|
+ this.$set(this.rows,Number(e.dataTransfer.getData('text/html')),temp);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ dragover(e){
|
|
|
+ e.preventDefault();
|
|
|
+ },
|
|
|
+ dragstart(e,index){
|
|
|
+ this.dom = e.target.innerHTML;
|
|
|
+ e.dataTransfer.setData("text/html",index);
|
|
|
+ },
|
|
|
+ importPasteData(){
|
|
|
+ if(!this.pasteDataText){
|
|
|
+ tempTip.setDuration(2000)
|
|
|
+ tempTip.show('导入文本不能为空')
|
|
|
+ }
|
|
|
+ let _this = this
|
|
|
+ let data = {rows:this.rows,pasteDataText:this.pasteDataText}
|
|
|
+ axios.post('{{url('apiLocal/order/issue/importPasteData')}}',data).then(function (response) {
|
|
|
+ if(response.data.success){
|
|
|
+ $('#pasteData').modal('hide')
|
|
|
+ tempTip.setDuration(2000)
|
|
|
+ tempTip.showSuccess('导入完毕')
|
|
|
+ }else{
|
|
|
+ let content = '';
|
|
|
+ for (const key in response.data.fail_info) {
|
|
|
+ content+=key+':'+response.data.fail_info[key] + "</br>"
|
|
|
+ }
|
|
|
+ _this.popoverContent = content
|
|
|
+ setTimeout(function () {
|
|
|
+ $("#popover").removeAttr('hidden').popover('show')
|
|
|
+ },1);
|
|
|
+ }
|
|
|
+ }).catch(function(error){
|
|
|
+ tempTip.setDuration(2000)
|
|
|
+ tempTip.show('导入失败'+error)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ forbidTab(e){
|
|
|
+ e.preventDefault();
|
|
|
+ },
|
|
|
+ replaceSpacing(){
|
|
|
+ this.pasteDataText += "\t";
|
|
|
+ },
|
|
|
|
|
|
+ }
|
|
|
+ });
|
|
|
+ </script>
|
|
|
@endsection
|
|
|
|