7.20的代码

src/utils/Excel.js

@@ -0,0 +1,27 @@
+import * as XLSX from 'xlsx';
+// 对象，用于调用方法
+var dataConversionUtil = {};
+ 
+// 将数据转换成Excel，单个sheet保存
+//fileName文件名,tableHeader表头,dataList表数据,sheet="sheet1"工作表默认名字是sheet1
+dataConversionUtil.dataToExcel = function(fileName,tableHeader,dataList,sheet="sheet1"){
+  // excel的表头和数据
+  let aoa = [];
+  // aoa的数据格式：[[],[],[],[]]   数组的第一个子数组可以指定为表头  根据情况而定
+  aoa = tableHeader.concat(dataList);
+ 
+  let workSheet = XLSX.utils.aoa_to_sheet(aoa);
+  let workBook = XLSX.utils.book_new();
+ 
+  // 把数据写到工作簿中
+  XLSX.utils.book_append_sheet(workBook,workSheet,sheet)
+  //如果一个工作工作簿中有多个工作表，可以修改参数类型并遍历添加，期中workBook是同一个，workSheet和sheet根据自己的需求添加，
+  //比如在此处添加第二个工作表叫‘第二张表’，把数据封装好后，数据格式同上,假如数据叫workSheet2，执行下面代码，工作簿就会多一张工作表叫‘第二张表’
+  //XLSX.utils.book_append_sheet(workBook,workSheet2,'第二张表')
+ 
+  //保存
+  XLSX.writeFile(workBook, fileName + ".xlsx")
+ 
+}
+ 
+export { dataConversionUtil }

src/utils/request.js

@@ -5,9 +5,9 @@ import { getToken } from '@/utils/auth'
 
 // create an axios instance
 const service = axios.create({
-  baseURL: 'http://123.207.180.167:8700', // url = base url + request url
+  baseURL: 'https://ht.9026.com/', // url = base url + request url
   // withCredentials: true, // send cookies when cross-domain requests
-  timeout: 5000 ,// request timeout
+  timeout: 60000 ,// request timeout
 
 
 })

src/views/contracts/addcontract.vue

@@ -18,7 +18,7 @@
 					<span style="color: #D05C39;">*支持上传pdf、jpg/jpeg、png格式</span>
 				</div>
 				<div>
-					<el-upload action="#" list-type="picture-card" :auto-upload="false">
+					<el-upload action="https://ht.9026.com/api/File" list-type="picture-card" :auto-upload="false">
 						<i slot="default" class="el-icon-plus"></i>
 						<div slot="file" slot-scope="{file}">
 							<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
@@ -45,7 +45,7 @@
 					<span style="color: #D05C39;">*支持上传pdf、jpg/jpeg、png格式</span>
 				</div>
 				<div>
-					<el-upload action="#" list-type="picture-card" :auto-upload="false">
+					<el-upload action="https://ht.9026.com/api/File" list-type="picture-card" :auto-upload="false">
 						<i slot="default" class="el-icon-plus"></i>
 						<div slot="file" slot-scope="{file}">
 							<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
@@ -72,7 +72,7 @@
 					<span style="color: #D05C39;">*支持上传pdf、jpg/jpeg、png格式</span>
 				</div>
 				<div>
-					<el-upload action="#" list-type="picture-card" :auto-upload="false">
+					<el-upload action="https://ht.9026.com/api/File" list-type="picture-card" :auto-upload="false">
 						<i slot="default" class="el-icon-plus"></i>
 						<div slot="file" slot-scope="{file}">
 							<img class="el-upload-list__item-thumbnail" :src="file.url" alt="">
@@ -145,9 +145,16 @@
 
 						<el-form-item label="承兑人">
 							<el-input v-model="form.accepetper" placeholder="请选择承兑人" class="ipwidth">
-								<!-- <el-option label="区域一" value="shanghai"></el-option>
-								<el-option label="区域二" value="beijing"></el-option> -->
 							</el-input>
+							<!-- <el-dropdown>
+							 <el-input v-model="form.accepetper" placeholder="请选择承兑人" class="ipwidth">
+							 </el-input>
+							  <el-dropdown-menu slot="dropdown">
+							    <el-dropdown-item command="承兑人杜甫">承兑人杜甫</el-dropdown-item>
+								<el-dropdown-item command="承兑人李白">承兑人李白</el-dropdown-item>
+								<el-dropdown-item command="新增承兑人" divided>新增承兑人	</el-dropdown-item>
+							  </el-dropdown-menu>
+							</el-dropdown> -->
 						</el-form-item>
 						<el-form-item label="出票日期">
 							<el-date-picker v-model="value3" type="date" placeholder="选择日期" class="ipwidth">
@@ -164,8 +171,6 @@
 					<el-form ref="form" :model="form.drawper" label-width="85px">
 						<el-form-item label="出票人">
 							<el-input v-model="form.region" placeholder="请选择出票人" class="ipwidth">
-								<!-- <el-option label="区域一" value="shanghai"></el-option>
-								<el-option label="区域二" value="beijing"></el-option> -->
 							</el-input>
 						</el-form-item>
 						<el-form-item label="汇票到期日">
@@ -200,11 +205,13 @@
 					</div>
 				</el-col>
 			</el-row>
+			<div class="addnew">
+				<el-button type="primary" @click="deletedraft">删除汇票</el-button>
+			</div>
 		</el-card>
 		<div class="commit">
 			<div class="addnew">
 				<el-button type="primary" @click="adddraft">新增汇票</el-button>
-				<el-button type="primary" @click="deletedraft">删除汇票</el-button>
 			</div>
 			<div class="addall">
 				<el-button type="warning" style="width: 180px;height: 45px;font-size: 16px;" @click="onSubmit">确认上传
@@ -351,19 +358,6 @@
 					});
 				return url;
 			},
-			// handleRemove(file) {
-			//   console.log(file);
-			// },
-			// handlePictureCardPreview(file) {
-			//   this.dialogImageUrl = file.url;
-			//   this.dialogVisible = true;
-			// },
-			// handleDownload(file) {
-			//   console.log(file);
-			// },
-			// handleChange() {
-
-			// },
 			onSubmit() {
 				this.$message('submit!')
 

src/views/contracts/billDetail.vue

@@ -29,8 +29,9 @@
 			}
 		},
 		mounted() {
+			let id=this.$route.query.id
 			this.$request({
-				url:'/api/Contract/contractDraft/23',
+				url:'/api/Contract/contractDraft/'+id,
 				method:'get'
 			}).then((res)=>{
 				this.list.push(res.data)

src/views/contracts/detail.vue

@@ -1,313 +1,369 @@
 <template>
-  <div>
-    <el-card class="box-card">
-      <el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="12">
-        <div class="grid-content bg-purple " >
-          <span style="font-weight: 600;">合同基础信息</span>
-          <div class="titlein">
-            <span class="titlename">合同名称</span>
-            <span class="meatatitle">{{contract.name}}</span>
-          </div>
-          <div class="titlein">
-            <span class="titlename">合同编号</span>
-            <span class="meatatitle">{{contract.contractNo}}</span>
-          </div>
-          <div class="titlein">
-            <span class="titlename">合同附件</span>
-            <div style="display: flex;">
-              <div class="imgbox">
-                <el-image style="width: 100px; height: 100px" :src="url[0]" :preview-src-list="srcList[0]">
-                </el-image>
-              </div>
-              <div class="imgbox">
-                <el-image style="width: 100px; height: 100px" :src="url[1]" :preview-src-list="srcList[1]">
-                </el-image>
-              </div>
-            </div>
-          </div>
-          <div class="titlein">
-            <span class="titlename">发票附件</span>
-            <div style="display: flex;">
-              <div class="imgbox">
-                <el-image style="width: 100px; height: 100px" :src="url[1]" :preview-src-list="srcList[1]">
-                </el-image>
-              </div>
-              <div class="imgbox">
-                <el-image style="width: 100px; height: 100px" :src="url[1]" :preview-src-list="srcList[1]">
-                </el-image>
-              </div>
-            </div>
-          </div>
+	<div>
+		<el-card class="box-card">
+			<el-col :xs="24" :sm="24" :md="10" :lg="10" :xl="12">
+				<div class="grid-content bg-purple ">
+					<span style="font-weight: 600;">合同基础信息</span>
+					<div class="titlein">
+						<span class="titlename">合同名称</span>
+						<span class="meatatitle">{{contract.name}}</span>
+					</div>
+					<div class="titlein">
+						<span class="titlename">合同编号</span>
+						<span class="meatatitle">{{contract.contractNo}}</span>
+					</div>
+					<div class="titlein">
+						<span class="titlename">合同附件</span>
+						<div style="display: flex;">
+							<div class="imgbox">
+								<el-image style="width: 100px; height: 100px" :src="url[0]"
+									:preview-src-list="picList[0]">
+								</el-image>
+							</div>
+							<div class="imgbox">
+								<el-image style="width: 100px; height: 100px" :src="url[1]"
+									:preview-src-list="picList[1]">
+								</el-image>
+							</div>
+						</div>
+					</div>
+					<div class="titlein">
+						<span class="titlename">发票附件</span>
+						<div style="display: flex;">
+							<div class="imgbox">
+								<el-image style="width: 100px; height: 100px" :src="url[1]"
+									:preview-src-list="picList[1]">
+								</el-image>
+							</div>
+							<div class="imgbox">
+								<el-image style="width: 100px; height: 100px" :src="url[1]"
+									:preview-src-list="picList[1]">
+								</el-image>
+							</div>
+						</div>
+					</div>
 
-        </div>
-      </el-col>
-      <el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="12">
-        <div class="jas" >
-          <div class="titlein jas">
-            <span class="titlename">贸易合同</span>
-            <div style="display: flex;">
-              <div class="imgbox">
-                <el-image style="width: 100px; height: 100px" :src="url[0]" :preview-src-list="srcList[0]">
-                </el-image>
-              </div>
-              <div class="imgbox">
-                <el-image style="width: 100px; height: 100px" :src="url[1]" :preview-src-list="srcList[1]">
-                </el-image>
-              </div>
-            </div>
-          </div>
-          <div class="yusa jas" >
-            <!-- <el-tag type="warning" effect="dark">
+				</div>
+			</el-col>
+			<el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="12">
+				<div class="jas">
+					<div class="titlein jas">
+						<span class="titlename">贸易合同</span>
+						<div style="display: flex;">
+							<div class="imgbox">
+								<el-image style="width: 100px; height: 100px" :src="url[0]"
+									:preview-src-list="picList[0]">
+								</el-image>
+							</div>
+							<div class="imgbox">
+								<el-image style="width: 100px; height: 100px" :src="url[1]"
+									:preview-src-list="picList[1]">
+								</el-image>
+							</div>
+						</div>
+					</div>
+					<div class="yusa jas">
+						<!-- <el-tag type="warning" effect="dark">
               <span>合同状态：</span>
               <span style="color: #D05C39;">待审核</span>
             </el-tag> -->
-            <div class="boxas">
-              <span style="color: #fff;">合同状态：</span>
-              <span style="color: #D05C39;">{{contract.statusText}}</span>
-            </div>
-            <span class="aoiisp">审核结果：<p style="color: #D8AB5A;">审核通过</p></span>
-          </div>
-          <div class="yusa">
-            <el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="10" class="jas">
-              <el-form ref="form" :model="form" label-width="0px">
-                <span class="sah">审核反馈：</span>
-                <el-form-item label="">
-                  <el-input type="textarea" v-model="form.desc"></el-input>
-                </el-form-item>
+						<div class="boxas">
+							<span style="color: #fff;">合同状态：</span>
+							<span style="color: #D05C39;">{{contract.statusText}}</span>
+						</div>
+						<span class="aoiisp">审核结果：<p style="color: #D8AB5A;">审核通过</p></span>
+					</div>
+					<div class="yusa">
+						<el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="10" class="jas">
+							<el-form ref="form" :model="form" label-width="0px">
+								<span class="sah">审核反馈：</span>
+								<el-form-item label="">
+									<el-input type="textarea" v-model="form.desc"></el-input>
+								</el-form-item>
 
-              </el-form>
-            </el-col>
-            <el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="14" class="jas">
-              <span class="sah">审核截图：</span>
-              <div style="display: flex;justify-content: flex-end;">
-                <div class="imgbox">
-                  <el-image style="width: 100px; height: 100px" :src="url[0]" :preview-src-list="srcList">
-                  </el-image>
-                </div>
-                <div class="imgbox">
-                  <el-image style="width: 100px; height: 100px" :src="url[1]" :preview-src-list="srcList">
-                  </el-image>
-                </div>
-              </div>
-            </el-col>
-          </div>
-        </div>
-      </el-col>
-    </el-card>
-    <el-card class="box-card">
-      <div slot="" class="clearfix">
-		  
-         <el-button type="danger"  style="float: right; ">删除</el-button>
-          <el-button type="primary"  style="float: right;margin-right: 10px; " @click="addNewBill" v-if="checked==1">新增</el-button>
-          <el-button type="primary" style="float: right; ">导出</el-button>
-		  <el-button type="warning"  style="float: right; ">审核失败</el-button>
-		  <el-button type="success"  style="float: right; ">审核成功</el-button>
-      </div>
-    </el-card>
-    <el-card class="box-card">
-     <el-table v-loading="listLoading" :data="list" element-loading-text="Loading" border fit highlight-current-row @select="onSelet">
-     <el-table-column align="center" label="" width="55" type="selection">
-       
-     </el-table-column>
-     <el-table-column label="汇票名称"  align="center" prop="name">
-       <!-- <template slot-scope="scope">
+							</el-form>
+						</el-col>
+						<el-col :xs="24" :sm="24" :md="14" :lg="14" :xl="14" class="jas">
+							<span class="sah">审核截图：</span>
+							<div style="display: flex;justify-content: flex-end;">
+								<div class="imgbox">
+									<el-image style="width: 100px; height: 100px" :src="url[0]"
+										:preview-src-list="picList">
+									</el-image>
+								</div>
+								<div class="imgbox">
+									<el-image style="width: 100px; height: 100px" :src="url[1]"
+										:preview-src-list="picList">
+									</el-image>
+								</div>
+							</div>
+						</el-col>
+					</div>
+				</div>
+			</el-col>
+		</el-card>
+		<el-card class="box-card">
+			<div slot="" class="clearfix">
+
+				<el-button type="danger" style="float: right; ">删除</el-button>
+				<el-button type="primary" style="float: right;margin-right: 10px; " @click="addNewBill"
+					v-if="checked==1">新增</el-button>
+				<el-button type="primary" style="float: right; ">导出</el-button>
+				<el-button type="warning" style="float: right; ">审核失败</el-button>
+				<el-button type="success" style="float: right; ">审核成功</el-button>
+			</div>
+		</el-card>
+		<el-card class="box-card">
+			<el-table v-loading="listLoading" :data="temporaryList" element-loading-text="Loading" border fit
+				highlight-current-row>
+				<el-table-column align="center" label="" width="55" type="selection">
+
+				</el-table-column>
+				<el-table-column label="汇票名称" align="center" prop="name">
+					<!-- <template slot-scope="scope">
          汇票名称
        </template> -->
-     </el-table-column>
-     <el-table-column label="汇票编号"  align="center" prop="draftNo">
-      <!-- <template slot-scope="scope">
+				</el-table-column>
+				<el-table-column label="汇票编号" align="center" prop="draftNo">
+					<!-- <template slot-scope="scope">
          <span>合同编号</span>
        </template> -->
-     </el-table-column>
-     <el-table-column label="承兑人"  align="center" prop="acceptorName">
-       <!-- <template slot-scope="scope">
+				</el-table-column>
+				<el-table-column label="承兑人" align="center" prop="acceptorName">
+					<!-- <template slot-scope="scope">
          承兑人
        </template> -->
-     </el-table-column>
-     <el-table-column label="金额" width="170" align="center">
-       <template slot-scope="scope">
-         {{scope.row.money}}
-       </template>
-     </el-table-column>
-     <el-table-column label="服务费" width="180" align="center">
-       <template slot-scope="scope">
-         {{scope.row.serviceMoney}}
-       </template>
-     </el-table-column>
-     <el-table-column label="汇票状态" width="180" align="center" prop="status">
-     </el-table-column>
-     <el-table-column label="审核状态" align="center">
-       <template slot-scope="scope">
-         {{scope.row.statusText}}
-       </template>
-     </el-table-column>
-     <el-table-column align="center" prop="created_at" label="操作" width="380">
-       <template slot-scope="scope">
-         <el-tag type="primary" style="cursor: pointer;margin-right: 15px;" @click="tapDetail">查看详情</el-tag>
-        <el-tag type="success" style="margin-right: 15px;cursor: pointer;">复原</el-tag>
-         <el-tag type="danger" style="margin-right: 15px;cursor: pointer;">删除</el-tag>
-       </template>
-     </el-table-column>
-     </el-table>
-     <div class="pagesip">
-        <el-button type="primary" size="small" style="background-color:#D8AB5A ;border-color:#D8AB5A ;">首页</el-button>
-       <el-pagination
-         background
-         layout="prev, pager, next"
-         :total="200">
-       </el-pagination>
-        <el-button type="primary" size="small" style="background-color:#D8AB5A ;border-color:#D8AB5A ;">尾页</el-button>
-     </div>
-    </el-card>
-  </div>
+				</el-table-column>
+				<el-table-column label="金额" width="170" align="center">
+					<template slot-scope="scope">
+						{{scope.row.money}}
+					</template>
+				</el-table-column>
+				<el-table-column label="服务费" width="180" align="center">
+					<template slot-scope="scope">
+						{{scope.row.serviceMoney}}
+					</template>
+				</el-table-column>
+				<el-table-column label="汇票状态" width="180" align="center" prop="status">
+				</el-table-column>
+				<el-table-column label="审核状态" align="center">
+					<template slot-scope="scope">
+						{{scope.row.statusText}}
+					</template>
+				</el-table-column>
+				<el-table-column align="center" prop="created_at" label="操作" width="380">
+					<template slot-scope="scope">
+						<el-tag type="primary" style="cursor: pointer;margin-right: 15px;"
+							@click="tapDetail(scope.row.id)">查看详情</el-tag>
+						<el-tag type="success" style="margin-right: 15px;cursor: pointer;">恢复</el-tag>
+						<el-tag type="danger" style="margin-right: 15px;cursor: pointer;">删除</el-tag>
+					</template>
+				</el-table-column>
+			</el-table>
+			<div class="pagesip">
+			  <el-button
+			    type="primary"
+			    size="small"
+			    style="background-color: #d8ab5a; border-color: #d8ab5a; margin: 0 20px"
+			    @click="jumpFirstPage"
+			    >首页
+			  </el-button>
+			  <el-pagination
+			    background
+			    @current-change="handleCurrentChange"
+			    layout="prev, pager, next"
+			    :total="list.length"
+			    :page-size="10"
+			    prev-text="上一页"
+			    next-text="下一页"
+			    :hide-on-single-page="false"
+			    ref="pagination"
+			  >
+			  </el-pagination>
+			  <el-button
+			    type="primary"
+			    size="small"
+			    style="background-color: #d8ab5a; border-color: #d8ab5a; margin: 0 20px"
+			    @click="jumpLastPage"
+			    >尾页
+			  </el-button>
+			</div>
+		</el-card>
+	</div>
 
 </template>
 
 <script>
-  import {
-    getList
-  } from '@/api/table'
-  export default {
-    data() {
-      return {
-        list: [],
-		contract:{},
-        listLoading: false,
-		checked:'',
-        form: '',
-        // url: 'https://fuss10.elemecdn.com/e/5d/4a731a90594a4af544c0c25941171jpeg.jpeg',
-		url:[],
-        srcList: [
-          // 'https://fuss10.elemecdn.com/8/27/f01c15bb73e1ef3793e64e6b7bbccjpeg.jpeg',
-          // 'https://fuss10.elemecdn.com/1/8e/aeffeb4de74e2fde4bd74fc7b4486jpeg.jpeg'
-        ]
-      }
-    },
-    created() {
-      // this.fetchData()
-    },
-	mounted(){
-		this.checked=this.$store.state.user.checked
-		this.$request({
-			url:'/api/Contract/17',
-			method:'get'
-		}).then((res)=>{
-			this.contract=res.data
-			this.url=this.contract.invoicePicList
-			this.srcList=this.contract.picList
-			console.log(this.srcList)
-		})
-		this.$request({
-			url:'/api/Contract/contractDraft/23',
-			method:'get'
-		}).then((res)=>{
-			this.list.push(res.data)
-		})
-	},
-    methods: {
-      addNewBill(){
-        this.$router.push({path:'contracts/addnewbill'})
-      },
-      tapDetail(){
-		this.$router.push({path:'contracts/billDetail',query:{}})
-      },
-	  onSelet(){
-		  
-	  }
-      // fetchData() {
-      //   this.listLoading = true
-      //   getList().then(response => {
-      //     this.list = response.data.items
-      //     this.listLoading = false
-      //   })
-      // }
-    }
-  }
+	import {
+		getList
+	} from '@/api/table'
+	export default {
+		data() {
+			return {
+				srcList: [],
+				temporaryList: [],
+				list: [],
+				contract: {},
+				currentPage: 1,
+				pagesize: 11,
+				listLoading: false,
+				checked: '',
+				form: '',
+				url: [],
+				picList: []
+			}
+		},
+		created() {
+		},
+		mounted() {
+			this.checked = this.$store.state.user.checked
+			let id = this.$route.query.id
+			this.$request({
+				url: '/api/Contract/' + id,
+				method: 'get'
+			}).then((res) => {
+				this.contract = res.data
+				this.url = this.contract.invoicePicList
+				this.picList = this.contract.picList
+				this.list=res.data.contractDraft.result
+				this.getPageData()
+				// console.log(this.list)
+			})
+			// this.$request({
+			// 	url: '/api/Contract/contractDraft/' + id,
+			// 	method: 'get'
+			// }).then((res) => {
+			// 	this.list.push(res.data)
+			// })
+		},
+		methods: {
+			addNewBill() {
+				this.$router.push({
+					path: 'contracts/addnewbill'
+				})
+			},
+			tapDetail(id) {
+				this.$router.push({
+					path: 'contracts/billDetail',
+					query: {
+						id: id
+					}
+				})
+			},
+			handleCurrentChange(val) {
+			  this.currentPage = val;
+			  this.getPageData();
+			},
+			jumpFirstPage() {
+			  this.$refs.pagination.handleCurrentChange(1);
+			  this.$emit("handleCurrentChange", 1);
+			},
+			jumpLastPage() {
+			  let font = this.$refs.pagination;
+			  let cpage = Math.ceil(font.total / font.pageSize);
+			  font.handleCurrentChange(cpage);
+			},
+			getPageData() {
+			  let start = (this.currentPage - 1) * this.pagesize;
+			  let end = start + this.pagesize;
+			  this.srcList = this.list.slice(start, end);
+			  this.temporaryList = this.srcList;
+			},
+		}
+	}
 </script>
 
 <style lang="scss">
-  .box-card {
-    width: 98%;
-    margin: 0 auto;
-    margin-top: 10px;
-  }
+	.box-card {
+		width: 98%;
+		margin: 0 auto;
+		margin-top: 10px;
+	}
+
+	.el-textarea__inner {
+		padding: 30px 0;
+	}
+
+	.imgbox {
+		margin-left: 15px;
+	}
+
+	.titlein {
+		display: flex;
+		justify-content: space-between;
+		margin: 20px 0;
+
+
+
+		.titlename {
+			color: #BEBDBB;
+		}
+
+		.meatatitle {
+			color: #1F242A;
+		}
+	}
+
+	.yusa {
+		display: flex;
 
-  .el-textarea__inner {
-    padding: 30px 0;
-  }
-.imgbox {
-      margin-left: 15px;
-    }
-  .titlein {
-    display: flex;
-    justify-content: space-between;
-    margin: 20px 0;
 
+	}
 
+	.jas {
+		margin: 20px 20px;
+		margin-bottom: 0;
+	}
 
-    .titlename {
-      color: #BEBDBB;
-    }
+	.sah {
+		display: block;
+		color: #68625B;
+		padding-bottom: 10px;
+	}
 
-    .meatatitle {
-      color: #1F242A;
-    }
-  }
+	.el-tag {
+		// font-size: 18px;
+	}
 
-  .yusa {
-    display: flex;
+	.grid-content {
+		margin: 15px 20px;
+	}
 
+	.bors {
 
-  }
-  .jas{
-     margin: 20px 20px;
-     margin-bottom: 0;
-  }
- .sah {
-    display: block;
-    color: #68625B;
-    padding-bottom: 10px;
-  }
+		height: 100%;
+	}
 
-  .el-tag {
-    // font-size: 18px;
-  }
+	.aoiisp {
+		margin-left: 20px;
+		display: flex;
+		align-items: center;
+	}
 
-  .grid-content {
-    margin: 15px 20px;
-  }
+	.pagesip {
+		width: 100%;
+		margin: 20px auto;
+		display: flex;
+		// align-items: center;
+		justify-content: flex-end;
+	}
 
-  .bors {
+	.el-pagination.is-background .el-pager li:not(.disabled).active {
+		background-color: #D8AB5A;
+	}
 
-    height: 100%;
-  }
+	.el-col {
+		margin-bottom: 20px;
+	}
 
-  .aoiisp {
-    margin-left: 20px;
-    display: flex;
-    align-items: center;
-  }
-  .pagesip{
-    width: 100%;
-    margin: 20px auto;
-    display: flex;
-    // align-items: center;
-    justify-content: flex-end;
-  }
-  .el-pagination.is-background .el-pager li:not(.disabled).active{
-    background-color:#D8AB5A;
-  }
-  .el-col{
-    margin-bottom: 20px;
-  }
-  .boxas{
-    font-size: 18px;
-    width: 211px;
-    height: 40px;
-    background: linear-gradient(to right,#FFE1AD,#D8AB5A);
-    box-shadow: 0 10px 20px 1px rgba(179, 116, 5, 0.2000);
-    border-radius: 0 26px 26px 0;
-    line-height: 40px;
-    text-align: center;
-  }
+	.boxas {
+		font-size: 18px;
+		width: 211px;
+		height: 40px;
+		background: linear-gradient(to right, #FFE1AD, #D8AB5A);
+		box-shadow: 0 10px 20px 1px rgba(179, 116, 5, 0.2000);
+		border-radius: 0 26px 26px 0;
+		line-height: 40px;
+		text-align: center;
+	}
 </style>

src/views/contracts/index.vue

@@ -1,355 +1,363 @@
 <template>
-  <div class="app-container">
-    <el-row type="flex" justify="space-between" style="margin-bottom: 20px">
-      <div class="grid-content bg-purple">
-        <el-input
-          placeholder="合同名称/编号、承兑人名称或出票..."
-          v-model="search"
-          clearable
-          style="width: 100%"
-        >
-          <i slot="prefix" class="el-input__icon el-icon-search"></i>
-        </el-input>
-      </div>
-      <div class="grid-content bg-purple">
-        <el-dropdown @command="handleCommand">
-          <div class="pulldown">
-            <span class="el-dropdown-link" v-if="!status"> 合同状态 </span>
-            <span class="el-dropdown-link" v-if="status">
-              {{ status }}
-            </span>
-            <i class="el-icon-arrow-down el-icon--right"></i>
-          </div>
-          <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item command="合同状态">合同状态</el-dropdown-item>
-            <el-dropdown-item command="正常">正常</el-dropdown-item>
-            <el-dropdown-item command="删除">删除</el-dropdown-item>
-          </el-dropdown-menu>
-        </el-dropdown>
-      </div>
-      <div class="grid-content bg-purple">
-        <el-dropdown @command="handlehpCommand">
-          <div class="pulldown">
-            <span class="el-dropdown-link" v-if="!hpstatus"> 汇票状态 </span>
-            <span class="el-dropdown-link" v-if="hpstatus">
-              {{ hpstatus }}
-            </span>
-            <i class="el-icon-arrow-down el-icon--right"></i>
-          </div>
-          <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item command="汇票状态">汇票状态</el-dropdown-item>
-            <el-dropdown-item command="正常">正常</el-dropdown-item>
-            <el-dropdown-item command="删除">删除</el-dropdown-item>
-          </el-dropdown-menu>
-        </el-dropdown>
-      </div>
-      <div class="grid-content bg-purple">
-        <el-dropdown @command="handleCommandAuditstatus">
-          <div class="pulldown">
-            <span class="el-dropdown-link" v-if="!Auditstatus"> 审核状态 </span>
-            <span class="el-dropdown-link" v-if="Auditstatus">
-              {{ Auditstatus }}
-            </span>
-            <i class="el-icon-arrow-down el-icon--right"></i>
-          </div>
-          <el-dropdown-menu slot="dropdown">
-            <el-dropdown-item command="待审核">待审核</el-dropdown-item>
-            <el-dropdown-item command="成功">成功</el-dropdown-item>
-            <el-dropdown-item command="失败">失败</el-dropdown-item>
-          </el-dropdown-menu>
-        </el-dropdown>
-      </div>
-      <div class="grid-content bg-purple">
-        <div class="block">
-          <el-date-picker
-            v-model="value2"
-            type="daterange"
-            align="right"
-            unlink-panels
-            range-separator="至"
-            start-placeholder="开始日期"
-            end-placeholder="结束日期"
-            :picker-options="pickerOptions"
-          >
-          </el-date-picker>
-        </div>
-      </div>
-    </el-row>
-    <el-row type="flex" justify="space-between" style="margin-bottom: 20px">
-      <div
-        class="grid-content bg-purple"
-        style="display: flex; justify-content: flex-end"
-      >
-        <el-button type="primary" @click="addNewContract" v-if="checked == 1"
-          >上传合同</el-button
-        >
-        <el-button type="primary" v-if="checked == 0">审核失败</el-button>
-        <el-button type="primary" v-if="checked == 0">审核成功</el-button>
-        <el-button type="primary">导出</el-button>
-        <el-button type="success">复原</el-button>
-        <el-button type="danger">删除</el-button>
-      </div>
-    </el-row>
-    <el-table
-      v-loading="listLoading"
-      :data="srcList"
-      element-loading-text="Loading"
-      border
-      fit
-      highlight-current-row
-      @select="handleSelectionChange"
-    >
-      <el-table-column align="center" label="" width="55" type="selection">
-      </el-table-column>
-      <el-table-column label="合同名称" align="center" prop="name">
-      </el-table-column>
-      <el-table-column
-        label="合同编号"
-        align="center"
-        prop="contractNo"
-        width="155"
-      >
-      </el-table-column>
-      <el-table-column label="承兑人" align="center" prop="acceptorName">
-      </el-table-column>
-      <el-table-column label="出票人" align="center" prop="drawersName">
-      </el-table-column>
-      <el-table-column label="汇票状态" align="center">
-        <template slot-scope="scope"> 正常 </template>
-      </el-table-column>
-      <el-table-column label="合同状态" align="center">
-        <template slot-scope="scope"> 正常 </template>
-      </el-table-column>
-      <el-table-column
-        class-name="status-col"
-        label="审核状态"
-        align="center"
-        prop="statusText"
-      >
-      </el-table-column>
-      <el-table-column align="center" label="时间" prop="createdAt" width="155">
-      </el-table-column>
-      <el-table-column
-        align="center"
-        prop="created_at"
-        label="操作"
-        width="250"
-      >
-        <template slot-scope="scope">
-          <el-tag type="primary" style="cursor: pointer" @click="tapDetail"
-            >查看详情</el-tag
-          >
-          <el-tag
-            type="success"
-            style="cursor: pointer"
-            @click="successed(scope.row.id)"
-            v-if="checked == 0"
-            >审核成功</el-tag
-          >
-          <el-tag
-            type="danger"
-            style="cursor: pointer"
-            @click="failed(scope.row.id)"
-            v-if="checked == 0"
-            >审核失败</el-tag
-          >
-          <el-tag type="success" style="cursor: pointer" v-if="checked == 1"
-            >复用</el-tag
-          >
-          <el-tag type="danger" style="cursor: pointer" v-if="checked == 1"
-            >删除</el-tag
-          >
-        </template>
-      </el-table-column>
-    </el-table>
-    <div class="pagesip">
-      <el-button
-        type="primary"
-        size="small"
-        style="background-color: #d8ab5a; border-color: #d8ab5a; margin: 0 20px"
-        @click="jumpFirstPage"
-        >首页
-      </el-button>
-      <el-pagination
-        background
-        @current-change="handleCurrentChange"
-        layout="prev, pager, next"
-        :total="list.length"
-        :page-size="11"
-        prev-text="上一页"
-        next-text="下一页"
-        :hide-on-single-page="false"
-        ref="pagination"
-      >
-      </el-pagination>
-      <el-button
-        type="primary"
-        size="small"
-        style="background-color: #d8ab5a; border-color: #d8ab5a; margin: 0 20px"
-        @click="jumpLastPage"
-        >尾页
-      </el-button>
-    </div>
-  </div>
+	<div class="app-container">
+		<el-row type="flex" justify="space-between" style="margin-bottom: 20px">
+			<div class="grid-content bg-purple">
+				<el-input placeholder="合同名称/编号、承兑人名称或出票..." v-model="search" @change="Search" clearable
+					style="width: 100%">
+					<i slot="prefix" class="el-input__icon el-icon-search"></i>
+				</el-input>
+			</div>
+			<div class="grid-content bg-purple">
+				<el-dropdown @command="handleCommand">
+					<div class="pulldown">
+						<span class="el-dropdown-link" v-if="!status"> 合同状态 </span>
+						<span class="el-dropdown-link" v-if="status">
+							{{ status }}
+						</span>
+						<i class="el-icon-arrow-down el-icon--right"></i>
+					</div>
+					<el-dropdown-menu slot="dropdown">
+						<el-dropdown-item command="合同状态">合同状态</el-dropdown-item>
+						<el-dropdown-item command="正常">正常</el-dropdown-item>
+						<el-dropdown-item command="删除">删除</el-dropdown-item>
+					</el-dropdown-menu>
+				</el-dropdown>
+			</div>
+			<div class="grid-content bg-purple">
+				<el-dropdown @command="handlehpCommand">
+					<div class="pulldown">
+						<span class="el-dropdown-link" v-if="!hpstatus"> 汇票状态 </span>
+						<span class="el-dropdown-link" v-if="hpstatus">
+							{{ hpstatus }}
+						</span>
+						<i class="el-icon-arrow-down el-icon--right"></i>
+					</div>
+					<el-dropdown-menu slot="dropdown">
+						<el-dropdown-item command="汇票状态">汇票状态</el-dropdown-item>
+						<el-dropdown-item command="正常">正常</el-dropdown-item>
+						<el-dropdown-item command="删除">删除</el-dropdown-item>
+					</el-dropdown-menu>
+				</el-dropdown>
+			</div>
+			<div class="grid-content bg-purple">
+				<el-dropdown @command="handleCommandAuditstatus">
+					<div class="pulldown">
+						<span class="el-dropdown-link" v-if="!Auditstatus"> 审核状态 </span>
+						<span class="el-dropdown-link" v-if="Auditstatus">
+							{{ Auditstatus }}
+						</span>
+						<i class="el-icon-arrow-down el-icon--right"></i>
+					</div>
+					<el-dropdown-menu slot="dropdown">
+						<el-dropdown-item command="审核状态">审核状态</el-dropdown-item>
+						<el-dropdown-item command="待审核">待审核</el-dropdown-item>
+						<el-dropdown-item command="成功">成功</el-dropdown-item>
+						<el-dropdown-item command="失败">失败</el-dropdown-item>
+					</el-dropdown-menu>
+				</el-dropdown>
+			</div>
+			<div class="grid-content bg-purple">
+				<div class="block">
+					<el-date-picker v-model="value2" type="daterange" align="right" unlink-panels range-separator="至"
+						start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions">
+					</el-date-picker>
+				</div>
+			</div>
+		</el-row>
+		<el-row type="flex" justify="space-between" style="margin-bottom: 20px">
+			<div class="grid-content bg-purple" style="display: flex; justify-content: flex-end">
+				<el-button type="primary" @click="addNewContract" v-if="checked == 1">上传合同</el-button>
+				<el-button type="primary" v-if="checked == 0">审核失败</el-button>
+				<el-button type="primary" v-if="checked == 0">审核成功</el-button>
+				<el-button type="primary" @click="Exports">批量导出</el-button>
+				<el-button type="success">恢复</el-button>
+				<el-button type="danger">删除</el-button>
+			</div>
+		</el-row>
+		<el-table v-loading="listLoading" :data="temporaryList" element-loading-text="Loading" border fit
+			highlight-current-row @select="handleSelectionChange">
+			<el-table-column align="center" label="" width="55" type="selection">
+			</el-table-column>
+			<el-table-column label="合同名称" align="center" prop="name">
+			</el-table-column>
+			<el-table-column label="合同编号" align="center" prop="contractNo" width="155">
+			</el-table-column>
+			<el-table-column label="承兑人" align="center" prop="acceptorName">
+			</el-table-column>
+			<el-table-column label="出票人" align="center" prop="drawersName">
+			</el-table-column>
+			<el-table-column label="汇票状态" align="center" prop="draftStatusText">
+			</el-table-column>
+			<el-table-column label="合同状态" align="center" prop="contractStatusText">
+			</el-table-column>
+			<el-table-column class-name="status-col" label="审核状态" align="center" prop="statusText">
+			</el-table-column>
+			<el-table-column align="center" label="时间" prop="createdAt" width="155">
+			</el-table-column>
+			<el-table-column align="center" prop="created_at" label="操作" width="250">
+				<template slot-scope="scope">
+					<el-tag type="primary" style="cursor: pointer" @click="tapDetail(scope.row.id)">查看详情</el-tag>
+					<el-tag type="success" style="cursor: pointer" @click="successed(scope.row.id)" v-if="checked == 0">
+						审核成功</el-tag>
+					<el-tag type="danger" style="cursor: pointer" @click="failed(scope.row.id)" v-if="checked == 0">审核失败
+					</el-tag>
+					<el-tag type="success" style="cursor: pointer" v-if="checked == 1" @click="recover(scope.row.id)">恢复
+					</el-tag>
+					<el-tag type="danger" style="cursor: pointer" v-if="checked == 1">删除</el-tag>
+				</template>
+			</el-table-column>
+		</el-table>
+		<div class="pagesip">
+			<el-button type="primary" size="small"
+				style="background-color: #d8ab5a; border-color: #d8ab5a; margin: 0 20px" @click="jumpFirstPage">首页
+			</el-button>
+			<el-pagination background @current-change="handleCurrentChange" layout="prev, pager, next"
+				:total="list.length" :page-size="10" prev-text="上一页" next-text="下一页" :hide-on-single-page="false"
+				ref="pagination">
+			</el-pagination>
+			<el-button type="primary" size="small"
+				style="background-color: #d8ab5a; border-color: #d8ab5a; margin: 0 20px" @click="jumpLastPage">尾页
+			</el-button>
+		</div>
+	</div>
 </template>
 
 <script>
-import { getList } from "@/api/table";
-
-export default {
-  filters: {
-    statusFilter(status) {
-      const statusMap = {
-        published: "success",
-        draft: "gray",
-        deleted: "danger",
-      };
-      return statusMap[status];
-    },
-  },
-  mounted() {
-    this.checked = this.$store.state.user.checked;
-    this.$request({
-      url: "/api/Contract/search",
-      method: "post",
-      data: {
-        pageIndex: 1,
-        pageSize: 10,
-      },
-    }).then((res) => {
-      console.log(res);
-      this.list = res.data.result;
-      this.getPageData();
-    });
-  },
-  data() {
-    return {
-      srcList: [],
-      list: [],
-      listLoading: false,
-      status: "",
-      hpstatus: "",
-      Auditstatus: "",
-      search: "",
-      currentPage: 1,
-      pagesize: 11,
-      checked: "",
-      pickerOptions: {
-        shortcuts: [
-          {
-            text: "最近一周",
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-              picker.$emit("pick", [start, end]);
-            },
-          },
-          {
-            text: "最近一个月",
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-              picker.$emit("pick", [start, end]);
-            },
-          },
-          {
-            text: "最近三个月",
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
-              picker.$emit("pick", [start, end]);
-            },
-          },
-        ],
-      },
-      value2: "",
-    };
-  },
-  created() {},
-  methods: {
-    addNewContract() {
-      this.$router.push({
-        path: "contracts/addcontract",
-      });
-    },
-    tapDetail() {
-      this.$router.push({
-        path: "/detail",
-      });
-    },
-	successed(id){
-		let successed=this.list.filter(item=>item.id==id)
-		successed[0].statusText="成功"
-	},
-	failed(id){
-		let failed=this.list.filter(item=>item.id==id)
-		failed[0].statusText='失败'
-	},
-    handleCommand(command) {
-      this.status = command;
-    },
-    handlehpCommand(command) {
-      this.hpstatus = command;
-    },
-    handleCommandAuditstatus(command) {
-      this.Auditstatus = command;
-    },
-    handleSelectionChange(data) {
-      this.multipleSelection = data;
-      console.log(this.multipleSelection);
-    },
-    handleCurrentChange(val) {
-      this.currentPage = val;
-      this.getPageData();
-    },
-    jumpFirstPage() {
-      this.$refs.pagination.handleCurrentChange(1);
-      this.$emit("handleCurrentChange", 1);
-    },
-    jumpLastPage() {
-      let font = this.$refs.pagination;
-      let cpage = Math.ceil(font.total / font.pageSize);
-      font.handleCurrentChange(cpage);
-    },
-    getPageData() {
-      let start = (this.currentPage - 1) * this.pagesize;
-      let end = start + this.pagesize;
-      this.srcList = this.list.slice(start, end);
-    },
-  },
-};
+	import {
+		getList
+	} from "@/api/table";
+	import {
+		dataConversionUtil
+	} from '../../utils/Excel.js'
+	export default {
+		filters: {
+			statusFilter(status) {
+				const statusMap = {
+					published: "success",
+					draft: "gray",
+					deleted: "danger",
+				};
+				return statusMap[status];
+			},
+		},
+		mounted() {
+			this.checked = this.$store.state.user.checked;
+			this.$request({
+				url: "/api/Contract/search",
+				method: "post",
+				data: {
+					pageIndex: 1,
+					pageSize: 100,
+				},
+			}).then((res) => {
+				console.log(res);
+				this.list = res.data.result.reverse();
+				this.getPageData();
+			});
+		},
+		data() {
+			return {
+				srcList: [],
+				list: [],
+				temporaryList: [],
+				listLoading: false,
+				status: "",
+				hpstatus: "",
+				Auditstatus: "",
+				search: "",
+				currentPage: 1,
+				pagesize: 10,
+				checked: "",
+				pickerOptions: {
+					shortcuts: [{
+							text: "最近一周",
+							onClick(picker) {
+								const end = new Date();
+								const start = new Date();
+								start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+								picker.$emit("pick", [start, end]);
+							},
+						},
+						{
+							text: "最近一个月",
+							onClick(picker) {
+								const end = new Date();
+								const start = new Date();
+								start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+								picker.$emit("pick", [start, end]);
+							},
+						},
+						{
+							text: "最近三个月",
+							onClick(picker) {
+								const end = new Date();
+								const start = new Date();
+								start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+								picker.$emit("pick", [start, end]);
+							},
+						},
+					],
+				},
+				value2: "",
+			};
+		},
+		created() {},
+		methods: {
+			addNewContract() {
+				this.$router.push({
+					path: "contracts/addcontract",
+				});
+			},
+			tapDetail(id) {
+				console.log(id)
+				this.$router.push({
+					path: "/detail",
+					query: {
+						id: id
+					}
+				});
+			},
+			successed(id) {
+				let successed = this.list.filter(item => item.id == id)
+				// this.$request({
+				// 	url: '/api/Supplier/manage',
+				// 	method: 'post',
+				// 	data: {
+				// 		ids: [successed[0].id],
+				// 		operateType: 3
+				// 	}
+				// }).then((res) => {
+				// 	console.log(res)
+				// })
+				successed[0].statusText = "成功"
+			},
+			failed(id) {
+				let failed = this.list.filter(item => item.id == id)
+				// this.$request({
+				// 	url: '/api/Supplier/manage',
+				// 	method: 'post',
+				// 	data: {
+				// 		ids: [failed[0].id],
+				// 		operateType: 4
+				// 	}
+				// }).then((res) => {
+				// 	console.log(res)
+				// })
+				failed[0].statusText = '失败'
+			},
+			handleCommand(command) {
+				this.status = command;
+				if (this.status == "正常" || this.status == "删除") {
+					this.temporaryList = this.srcList.filter(item => item.contractStatusText == this.status)
+				} else {
+					this.temporaryList = this.srcList
+				}
+			},
+			handlehpCommand(command) {
+				this.hpstatus = command;
+				if (this.hpstatus == "正常" || this.hpstatus == "删除") {
+					this.temporaryList = this.srcList.filter(item => item.draftStatusText == this.hpstatus)
+				} else {
+					this.temporaryList = this.srcList
+				}
+			},
+			handleCommandAuditstatus(command) {
+				this.Auditstatus = command;
+				if (this.Auditstatus == "成功" || this.Auditstatus == "失败" || this.Auditstatus == "待审核") {
+					this.temporaryList = this.srcList.filter(item => item.statusText == this.Auditstatus)
+				} else {
+					this.temporaryList = this.srcList
+				}
+			},
+			handleSelectionChange(data) {
+				this.multipleSelection = data;
+				console.log(this.multipleSelection);
+			},
+			handleCurrentChange(val) {
+				this.currentPage = val;
+				this.getPageData();
+			},
+			jumpFirstPage() {
+				this.$refs.pagination.handleCurrentChange(1);
+				this.$emit("handleCurrentChange", 1);
+			},
+			jumpLastPage() {
+				let font = this.$refs.pagination;
+				let cpage = Math.ceil(font.total / font.pageSize);
+				font.handleCurrentChange(cpage);
+			},
+			getPageData() {
+				let start = (this.currentPage - 1) * this.pagesize;
+				let end = start + this.pagesize;
+				this.srcList = this.list.slice(start, end);
+				this.temporaryList = this.srcList
+			},
+			Search() {
+				if (this.search == "") {
+					this.temporaryList = this.srcList
+				} else {
+					this.temporaryList = this.list.filter(item => item.name == this.search || item.contractNo == this
+						.search || item.acceptorName == this.search || item.drawersName == this.search)
+				}
+			},
+			Exports() {
+				var tableHeader = [
+					['序号', '合同名称', '合同编号', '承兑人', '出票人', '汇票状态', '合同状态', '审核状态', '时间'],
+				]
+				var dataList = []
+				this.multipleSelection.forEach((item, index) => {
+					dataList.push([index + 1, item.name, item.contractNo, item.acceptorName, item.drawersName, item
+						.draftStatusText, item.contractStatusText, item.statusText, item.createdAt
+					]);
+				})
+				dataConversionUtil.dataToExcel('合同列表', tableHeader, dataList)
+				this.$message.success('导出成功!');
+			},
+			recover(id) {
+				let recovered = this.list.filter(item => item.id == id)
+				console.log(recovered[0].id)
+				// this.$request({
+				// 	url: '/api/Supplier/manage',
+				// 	method: 'post',
+				// 	data: {
+				// 		ids: [recovered[0].id],
+				// 		operateType: 2
+				// 	}
+				// }).then((res) => {
+				// 	console.log(res)
+				// })
+			}
+		},
+	};
 </script>
 <style lang="scss">
-.pulldown {
-  width: 185px;
-  height: 40px;
-  border: 1px solid #e8e8e8;
-  border-radius: 10px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  justify-content: space-between;
-  padding: 0 20px;
-  color: #999999;
-}
+	.pulldown {
+		width: 185px;
+		height: 40px;
+		border: 1px solid #e8e8e8;
+		border-radius: 10px;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		justify-content: space-between;
+		padding: 0 20px;
+		color: #999999;
+	}
 
-.pagesip {
-  width: 100%;
-  margin: 20px auto;
-  padding-right: 50px;
-  display: flex;
-  // align-items: center;
-  justify-content: flex-end;
-}
+	.pagesip {
+		width: 100%;
+		margin: 20px auto;
+		padding-right: 50px;
+		display: flex;
+		// align-items: center;
+		justify-content: flex-end;
+	}
 
-.el-pagination.is-background .el-pager li:not(.disabled).active {
-  background-color: #d8ab5a;
-}
+	.el-pagination.is-background .el-pager li:not(.disabled).active {
+		background-color: #d8ab5a;
+	}
 
-.el-col {
-  margin-bottom: 20px;
-}
+	.el-col {
+		margin-bottom: 20px;
+	}
 </style>

src/views/delivery/index.vue

@@ -53,10 +53,10 @@
 		</el-row>
 		<el-row  type="flex" justify="end" style="margin-bottom:20px">
 			<div class="grid-content bg-purple" style="display: flex;justify-content: flex-end;">
-					<el-button type="primary">审核失败</el-button>
-					<el-button type="primary">审核成功</el-button>
-					<el-button type="primary">导出</el-button>
-					<el-button type="success">复原</el-button>
+					<el-button type="primary" @click="failed">审核失败</el-button>
+					<el-button type="primary" @click="success">审核成功</el-button>
+					<el-button type="primary" @click="Exports">导出</el-button>
+					<el-button type="success">恢复</el-button>
 					<el-button type="danger">禁用</el-button>
 				</div>
 		</el-row>
@@ -65,49 +65,34 @@
 			<el-table-column   type="selection">
 			</el-table-column>
 			<el-table-column label="供应商名称" align="center" prop="name" width="200">
-				<!-- <template slot-scope="scope">
-          {{scope.name}}
-        </template> -->
 			</el-table-column>
 			<el-table-column label="社会统一信用代码" width="200" align="center" prop="socialCode">
-				<!-- <template slot-scope="scope">
-          {{scope.socialCode}}
-        </template> -->
+
 			</el-table-column>
 			<el-table-column label="账号" width="150" align="center" prop="account">
-				<!-- <template slot-scope="scope">
-          {{scope.account}}
-        </template> -->
+
 			</el-table-column>
 			<el-table-column label="法人名称" width="180" align="center" prop="legalPerson">
-				<!-- <template slot-scope="scope">
-          {{scope.legalPerson}}
-        </template> -->
+	
 			</el-table-column>
 			<el-table-column label="联系人" width="180" align="center" prop="contacts">
-				<!-- <template slot-scope="scope">
-          {{scope.contacts}}
-        </template> -->
+	
 			</el-table-column>
 
 			<el-table-column label="电话" width="180" align="center" prop="contactsMobile">
-				<!-- <template slot-scope="scope">
-          {{scope.contactsMobile}}
-        </template> -->
+	
 			</el-table-column>
 			<el-table-column label="审核状态"  align="center" prop="statusText">
-				<!-- <template slot-scope="scope">
-          {{scope.statusText}}
-        </template> -->
+		
 			</el-table-column>
 			<el-table-column align="center" prop="createdAt" label="时间" width="180">
 			</el-table-column>
 			<el-table-column align="center" prop="created_at" label="操作" width="250">
 				<template slot-scope="scope">
-					<el-tag type="success" style="cursor: pointer;margin-right: 15px;" @click="toedit(scope.row.id)">编辑
+					<el-tag type="primary" style="cursor: pointer;margin-right: 15px;" @click="toedit(scope.row.id)">编辑
 					</el-tag>
-					<el-tag type="warning" style="margin-right: 15px;cursor: pointer;">复原</el-tag>
-					<el-tag type="info">禁用</el-tag>
+					<el-tag type="success" style="margin-right: 15px;cursor: pointer;">恢复</el-tag>
+					<el-tag type="danger">禁用</el-tag>
 				</template>
 			</el-table-column>
 		</el-table>
@@ -130,7 +115,9 @@
 	import {
 		getList
 	} from '@/api/table'
-
+		import {
+			dataConversionUtil
+		} from '../../utils/Excel.js'
 	export default {
 		filters: {
 			statusFilter(status) {
@@ -151,6 +138,7 @@
 				providerStatus: '',
 				AuditStatus: '',
 				search: '',
+				multipleSelection:[],
 				currentPage: 1,
 				pagesize: 9,
 				checked: false,
@@ -186,7 +174,6 @@
 			}
 		},
 		created() {
-			// this.fetchData()
 		},
 		mounted() {
 			this.$request({
@@ -194,15 +181,19 @@
 				method: 'post',
 				data: {
 					pageIndex: 1,
-					pageSize: 30,
+					pageSize:100,
 				}
 			}).then((res) => {
-				this.list = res.data.result
+				this.list = res.data.result.reverse()
 				this.getPageData();
 				console.log(this.list)
 			})
 		},
 		methods: {
+			handleSelectionChange(data){
+				this.multipleSelection = data;
+				console.log(this.multipleSelection);
+			},
 			PhandleCommand(command) {
 				this.providerStatus = command
 				if(this.providerStatus=="正常"||this.providerStatus=="删除"){
@@ -210,7 +201,8 @@
 				}else {
 					this.temporaryList=this.srcList
 				}				
-
+				this.AuditStatus='',
+				this.search=''
 			},
 			AhandleCommand(command) {
 				this.AuditStatus = command
@@ -218,7 +210,9 @@
 					this.temporaryList=this.srcList.filter(item=>item.statusText==this.AuditStatus)
 				}else {
 					this.temporaryList=this.srcList
-				}	
+				}
+				this.providerStatus="",
+				this.search=''
 			},
 			toedit(id) {
 				this.$router.push({
@@ -253,6 +247,33 @@
 				} else {
 					this.temporaryList = this.list.filter(item => item.name == this.search)
 				}
+				this.providerStatus=""
+				this.AuditStatus=""
+			},
+			failed(){
+				let idlist=Array.from(this.multipleSelection,({id})=>id)
+				console.log(idlist)
+				this.$request({
+					url:'/api/Supplier/manage',
+					method:'post',
+					data:{
+						ids:idlist,
+						operateType:4
+					}
+				})
+			},
+			Exports(){
+				var tableHeader = [
+					['序号','供应商名称','社会统一信用码', '账号', '法人名称', '联系人', '电话', '审核状态', '时间'],
+				]
+				var dataList = []
+				this.multipleSelection.forEach((item, index) => {
+					dataList.push([index + 1, item.name, item.socialCode, item.account, item.legalPerson, item
+						.contacts,item.contactsMobile, item.statusText, item.createdAt
+					]);
+				})
+				dataConversionUtil.dataToExcel('供应商列表', tableHeader, dataList)
+				this.$message.success('导出成功!');
 			},
 		}
 	}

src/views/form/addTicketdrawer.vue

@@ -1,63 +1,66 @@
 <template>
-  <div class="form">
-    <el-form ref="form" :model="form" label-width="100px" >
-      <el-form-item label="出票人名称" style="width: 500px;" prop="name">
-        <el-input v-model="form.name"></el-input>
-      </el-form-item>
-      <el-form-item label="账号" style="width: 500px;" prop="bankAccount">
-        <el-input v-model="form.bankAccount"></el-input>
-      </el-form-item>
-      <el-form-item label="开户行名称" style="width: 500px;" prop="bankName">
-        <el-input v-model="form.bankName"></el-input>
-      </el-form-item>
-            <el-form-item>
-              <el-button type="primary" @click="onSubmit">立即提交</el-button>
-							<el-button type="primary" @click="resetForm('form')">重置</el-button>
-            </el-form-item>
-        </el-form>
-  </div>
+	<div class="form">
+		<el-form ref="form" :model="form" label-width="100px">
+			<el-form-item label="出票人名称" style="width: 500px;" prop="name">
+				<el-input v-model="form.name"></el-input>
+			</el-form-item>
+			<el-form-item label="账号" style="width: 500px;" prop="bankAccount">
+				<el-input v-model="form.bankAccount"></el-input>
+			</el-form-item>
+			<el-form-item label="开户行名称" style="width: 500px;" prop="bankName">
+				<el-input v-model="form.bankName"></el-input>
+			</el-form-item>
+			<el-form-item>
+				<el-button type="primary" @click="onSubmit">立即提交</el-button>
+				<el-button type="primary" @click="resetForm('form')">重置</el-button>
+			</el-form-item>
+		</el-form>
+	</div>
 </template>
 
 <script>
- export default {
-   data(){
-     return {
-      form:{
-        name:'',
-        bankAccount:'',
-        bankName:'',
-      }
-     }
-   },
-   mounted() {
-   	
-   },
-   methods:{
-      onSubmit(){
-       this.$request({
-         url:'/api/Drawer',
-         method:'post',
-         data:this.form
-       }).then((res)=>{
-         this.$message("添加成功!")
-		 this.$router.push({path:'index'})
-       })
-      },
+	export default {
+		data() {
+			return {
+				form: {
+					name: '',
+					bankAccount: '',
+					bankName: '',
+				}
+			}
+		},
+		mounted() {
+
+		},
+		methods: {
+			onSubmit() {
+				this.$request({
+					url: '/api/Drawer',
+					method: 'post',
+					data: this.form
+				}).then((res) => {
+					this.$message("添加成功!")
+					this.$router.push({
+						path: 'index'
+					})
+				})
+			},
 			resetForm(form) {
-			    this.$refs[form].resetFields();
+				this.$refs[form].resetFields();
 			}
-   },
-   }
+		},
+	}
 </script>
 
 <style lang="scss">
-	.form{
+	.form {
 		margin-top: 100px;
 		display: flex;
 		align-items: center;
 		justify-content: center;
 	}
-	.el-form-item:last-child{
+
+	.el-form-item:last-child {
 		display: flex;
 		justify-content: space-between;
 	}

src/views/form/index.vue

@@ -52,7 +52,7 @@
         <el-button type="primary" @click="addTicketdrawer"
           >新增出票人</el-button
         >
-        <el-button type="primary">导出</el-button>
+        <el-button type="primary" @click="Exports">批量导出</el-button>
         <!--         <el-button type="success">复原</el-button>
           <el-button type="danger">删除</el-button> -->
       </div>
@@ -151,7 +151,9 @@
 
 <script>
 import { getList } from "@/api/table";
-
+	import {
+		dataConversionUtil
+	} from '../../utils/Excel.js'
 export default {
   filters: {
     statusFilter(status) {
@@ -167,7 +169,7 @@ export default {
     return {
       request: {
         pageIndex: 1,
-        pageSize: 50,
+        pageSize: 100,
         // startTime:'',
         // endTime:'',
         // name:'',
@@ -228,7 +230,7 @@ export default {
       data: this.request,
     }).then((res) => {
       console.log(res.data.result);
-      this.list = res.data.result;
+      this.list = res.data.result.reverse();
       this.getPageData();
     });
   },
@@ -301,6 +303,19 @@ export default {
         );
       }
     },
+		Exports(){
+			var tableHeader = [
+					['序号','出票人名称', '账号', '开户行名称',  '状态', '时间'],
+				]
+				var dataList = []
+				this.multipleSelection.forEach((item, index) => {
+					dataList.push([index + 1, item.name, item.bankAccount, item.bankName,  item.statusText, item.createdAt
+					]);
+				})
+				dataConversionUtil.dataToExcel('出票人列表', tableHeader, dataList)
+				this.$message.success('导出成功!');
+			
+		}
   },
 };
 </script>

src/views/management/detail.vue

@@ -0,0 +1,8 @@
+<template>
+</template>
+
+<script>
+</script>
+
+<style>
+</style>

src/views/management/index.vue

@@ -53,40 +53,28 @@
 			<el-table-column align="center" label="" width="55" type="selection">
 			</el-table-column>
 			<el-table-column label="业务管理员姓名" align="center" width="180" prop="realName">
-				<!-- <template slot-scope="scope">
-          成都韩晶供应商公司
-        </template> -->
+				
 			</el-table-column>
 			<el-table-column label="账号" align="center" prop="account">
-				<!-- <template slot-scope="scope">
-          <span>合同编号</span>
-        </template> -->
+				
 			</el-table-column>
 			<el-table-column label="联系电话" width="180" align="center" prop="mobile">
-				<!-- <template slot-scope="scope">
-          承兑人
-        </template> -->
+				
 			</el-table-column>
 			<el-table-column label="业务管理员状态"  align="center" prop="statusText">
-				<!-- <template slot-scope="scope">
-          出票人
-        </template> -->
+				
 			</el-table-column>
 			<el-table-column label="审核状态"  align="center" prop="approveStatusText">
-				<!-- <template slot-scope="scope">
-          汇票状态
-        </template> -->
+				
 			</el-table-column>
 			<el-table-column label="时间" width="180" align="center">
-				<!-- <template slot-scope="scope">
-          正常
-        </template> -->
+				
 			</el-table-column>
 			<el-table-column align="center" prop="created_at" label="操作" width="200">
 				<template slot-scope="scope">
-					<el-tag type="primary" style="cursor: pointer; margin:0 5px;" @click="tapDetail">编辑</el-tag>
-					<el-tag type="warning" style="cursor: pointer; margin:0 5px;" @click="tapDetail">禁用</el-tag>
-					<el-tag type="success" style="cursor: pointer; margin:0 5px;" @click="tapDetail">复原</el-tag>
+					<el-tag type="primary" style="cursor: pointer; margin:0 5px;" @click="">编辑</el-tag>
+					<el-tag type="success" style="cursor: pointer; margin:0 5px;" @click="recover(scope.row.id)">恢复</el-tag>
+					<el-tag type="warning" style="cursor: pointer; margin:0 5px;" @click="deleted(scope.row.id)">删除</el-tag>
 				</template>
 			</el-table-column>
 		</el-table>
@@ -94,7 +82,7 @@
 			<el-button type="primary" size="small"
 				style="background-color:#D8AB5A ;border-color:#D8AB5A ; margin: 0 20px;" @click="jumpFirstPage">首页
 			</el-button>
-			<el-pagination background @current-change="handleCurrentChange" layout="prev, pager, next" :total="list.length" :page-size="11" prev-text="上一页" next-text="下一页"
+			<el-pagination background @current-change="handleCurrentChange" layout="prev, pager, next"  :total="list.length" :page-size="11" prev-text="上一页" next-text="下一页"
 				:hide-on-single-page="false" ref="pagination">
 			</el-pagination>
 			<el-button type="primary" size="small"
@@ -166,19 +154,26 @@
 		},
 		mounted() {
 			this.$request({
-				url: '/api/Account',
-				method: 'get',
+				url: '/api/Account/search',
+				method: 'post',
+				data:{
+					pageIndex:0,
+					pageSize: 30,
+				}
 			}).then((res) => {
-				this.list.push(res.data)
+				this.list=res.data.result
+				console.log(res.data.result)
 				this.getPageData()
-				console.log(this.list)
 			})
 		},
 		methods: {
-			tapDetail() {
+			toDetail() {
 				this.$router.push({
 					path: '/detail'
 				})
+			},
+			handleSelectionChange(){
+				
 			},
 			handleCommand(command) {
 				this.status = command
@@ -206,7 +201,15 @@
 				let end = start + this.pagesize;
 				this.srcList = this.list.slice(start, end);
 			},
-
+			recover(id){
+				let recoverd=this.list.filter(item=>item.id==id)
+				// console.log(recoverd[0].statusText)
+				recoverd[0].statusText="正常"
+			},
+			deleted(id){
+				let deleted=this.list.filter(item=>item.id==id)
+				deleted[0].statusText="删除"
+			}
 		}
 	}
 </script>

src/views/register/index.vue

@@ -297,8 +297,8 @@
                     drag
                     :multiple="false"
                     :show-file-list="false"
-                    action="#"
-                    :auto-upload="false"
+                    action="https://ht.9026.com/api/File"
+                    :auto-upload="true"
                     :on-success="handleAvatarSuccess"
                     list-type="picture"
                     style="margin-top: 15px"
@@ -331,9 +331,9 @@
                     drag
                     :multiple="false"
                     :show-file-list="false"
-                    action="http://123.207.180.167:8700/api/File"
-                    :auto-upload="false"
-                    :on-success="handleAvatarSuccess"
+                    action="https://ht.9026.com/api/File"
+                    :auto-upload="true"
+                    :on-success="handleSuccess"
                     list-type="picture"
                     style="margin-top: 15px"
                   >
@@ -508,8 +508,12 @@ export default {
     },
     handleAvatarSuccess(res, file) {
       console.log(file.raw, 88);
-      this.imageUrl = URL.createObjectURL(file.raw);
+      this.upself = URL.createObjectURL(file.raw);
     },
+	handleSuccess(res, file) {
+	  console.log(file.raw, 88);
+	  this.upweituo = URL.createObjectURL(file.raw);
+	},
     handlePictureCardPreview(file) {
       console.log(file, 88);
       this.imageUrl = file.url;

src/views/shipments/index.vue

@@ -1,33 +1,33 @@
 <template>
-  <div class="app-container">
-   <el-row type="flex" justify="space-between" style="margin-bottom:20px">
-       <div class="grid-content bg-purple">
-         <el-dropdown @command="handleCommand">
-           <div class="pulldown">
-             <span class="el-dropdown-link" v-if="!status">
-              月
-             </span>
-             <span class="el-dropdown-link" v-if="status">
-               {{status}}
-             </span>
-             <i class="el-icon-arrow-down el-icon--right"></i>
-           </div>
-           <el-dropdown-menu slot="dropdown">
-             <el-dropdown-item command="1">1月</el-dropdown-item>
-           </el-dropdown-menu>
-         </el-dropdown>
-       </div>
-
-
-       <div class="grid-content bg-purple">
-         <div class="block">
-           <el-date-picker v-model="value2" type="daterange" align="right" unlink-panels range-separator="至"
-             start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions">
-           </el-date-picker>
-         </div>
-
-       </div>
-  <!-- <el-col :xs="24" :sm="10" :md="8" :lg="5" :xl="5">
+	<div class="app-container">
+		<el-row type="flex" justify="space-between" style="margin-bottom:20px">
+			<div class="grid-content bg-purple">
+				<el-dropdown @command="handleCommand">
+					<div class="pulldown">
+						<span class="el-dropdown-link" v-if="!status">
+							月
+						</span>
+						<span class="el-dropdown-link" v-if="status">
+							{{status}}
+						</span>
+						<i class="el-icon-arrow-down el-icon--right"></i>
+					</div>
+					<el-dropdown-menu slot="dropdown">
+						<el-dropdown-item command="1">1月</el-dropdown-item>
+					</el-dropdown-menu>
+				</el-dropdown>
+			</div>
+
+
+			<div class="grid-content bg-purple">
+				<div class="block">
+					<el-date-picker v-model="value2" type="daterange" align="right" unlink-panels range-separator="至"
+						start-placeholder="开始日期" end-placeholder="结束日期" :picker-options="pickerOptions">
+					</el-date-picker>
+				</div>
+
+			</div>
+			<!-- <el-col :xs="24" :sm="10" :md="8" :lg="5" :xl="5">
      <div class="grid-content bg-purple">
        <div class="grid-content bg-purple" style="margin-left: 30px;">
          <el-input
@@ -38,207 +38,213 @@
        </div>
      </div>
      </el-col> -->
-       <div class="grid-content bg-purple" style="display: flex;justify-content: flex-end;">
-         <el-button type="primary" disabled>承兑人分类报表</el-button>
-         <el-button type="primary" @click="shipments1">出票人分类报表</el-button>
-         <el-button type="primary" @click="shipments2">合同统计列表</el-button>
-         <el-button type="primary" @click="shipments3">供应商统计列表</el-button>
-        <el-button type="primary" @click="Export">导出</el-button>
-       </div>
+			<div class="grid-content bg-purple" style="display: flex;justify-content: flex-end;">
+				<el-button type="primary" disabled>承兑人分类报表</el-button>
+				<el-button type="primary" @click="shipments1">出票人分类报表</el-button>
+				<el-button type="primary" @click="shipments2">合同统计列表</el-button>
+				<el-button type="primary" @click="shipments3">供应商统计列表</el-button>
+				<el-button type="primary" @click="Export">导出</el-button>
+			</div>
 
-   </el-row>
-    <el-table v-loading="listLoading" :data="srcList" element-loading-text="Loading" border fit highlight-current-row>
-      <el-table-column align="center" label="" width="55">
-        <template slot-scope="scope">
-         <el-checkbox v-model="checked"></el-checkbox>
-        </template>
-      </el-table-column>
-      <el-table-column label="承兑人姓名"  align="center" prop="acceptorName">
+		</el-row>
+		<el-table v-loading="listLoading" :data="srcList" element-loading-text="Loading" border fit
+			@select="handleSelectionChange" highlight-current-row>
+			<el-table-column align="center" label="" width="55" type="selection">
+
+			</el-table-column>
+			<el-table-column label="承兑人姓名" align="center" prop="acceptorName">
 
-      </el-table-column>
-      <el-table-column label="统计周期(按照承兑日)" width="180" align="center" prop="period">
+			</el-table-column>
+			<el-table-column label="统计周期(按照承兑日)" width="180" align="center" prop="period">
 
-      </el-table-column>
-      <el-table-column label="汇票笔数"  align="center" prop="count">
+			</el-table-column>
+			<el-table-column label="汇票笔数" align="center" prop="count">
 
-      </el-table-column>
-     <el-table-column label="汇票金额"  align="center" prop="money">
+			</el-table-column>
+			<el-table-column label="汇票金额" align="center" prop="money">
 
-     </el-table-column>
-     <el-table-column label="服务费"  align="center" prop="serviceMoney">
+			</el-table-column>
+			<el-table-column label="服务费" align="center" prop="serviceMoney">
 
-     </el-table-column>
-     <el-table-column label="利息"  align="center" prop="interest">
+			</el-table-column>
+			<el-table-column label="利息" align="center" prop="interest">
 
-     </el-table-column>
+			</el-table-column>
 
-     <!-- <el-table-column align="center" prop="created_at" label="操作" width="250">
+			<!-- <el-table-column align="center" prop="created_at" label="操作" width="250">
         <template slot-scope="scope">
           <el-tag type="success" style="cursor: pointer;margin-right: 15px;">恢复</el-tag>
          <el-tag type="warning" style="margin-right: 15px;cursor: pointer;">下载</el-tag>
           <el-tag type="danger" style="cursor: pointer;">删除</el-tag>
         </template>
       </el-table-column> -->
-    </el-table>
-   <div class="pagesip">
-   	<el-button type="primary" size="small"
-   		style="background-color:#D8AB5A ;border-color:#D8AB5A ; margin: 0 20px;" @click="jumpFirstPage">首页
-   	</el-button>
-   	<el-pagination background @current-change="handleCurrentChange" layout="prev, pager, next"
-   		:total="list.length" :page-size="10" prev-text="上一页" next-text="下一页" :hide-on-single-page="false"
-   		ref="pagination">
-   	</el-pagination>
-   	<el-button type="primary" size="small"
-   		style="background-color:#D8AB5A ;border-color:#D8AB5A ;margin: 0 20px;" @click="jumpLastPage">尾页
-   	</el-button>
-   </div>
-  </div>
+		</el-table>
+		<div class="pagesip">
+			<el-button type="primary" size="small"
+				style="background-color:#D8AB5A ;border-color:#D8AB5A ; margin: 0 20px;" @click="jumpFirstPage">首页
+			</el-button>
+			<el-pagination background @current-change="handleCurrentChange" layout="prev, pager, next"
+				:total="list.length" :page-size="10" prev-text="上一页" next-text="下一页" :hide-on-single-page="false"
+				ref="pagination">
+			</el-pagination>
+			<el-button type="primary" size="small"
+				style="background-color:#D8AB5A ;border-color:#D8AB5A ;margin: 0 20px;" @click="jumpLastPage">尾页
+			</el-button>
+		</div>
+	</div>
 </template>
 
 <script>
-  import {
-    getList
-  } from '@/api/table'
-
-  export default {
-    filters: {
-      statusFilter(status) {
-        const statusMap = {
-          published: 'success',
-          draft: 'gray',
-          deleted: 'danger'
-        }
-        return statusMap[status]
-      }
-    },
-    data() {
-      return {
-        list: [],
-        listLoading: false,
-        status: '',
-        hpstatus:'',
-				srcList:[],
+	import {
+		getList
+	} from '@/api/table'
+
+	export default {
+		filters: {
+			statusFilter(status) {
+				const statusMap = {
+					published: 'success',
+					draft: 'gray',
+					deleted: 'danger'
+				}
+				return statusMap[status]
+			}
+		},
+		data() {
+			return {
+				list: [],
+				listLoading: false,
+				status: '',
+				hpstatus: '',
+				multipleSelection:[],
+				srcList: [],
 				currentPage: 1,
 				pagesize: 11,
-        input4:'',
-         checked:false,
-        pickerOptions: {
-          shortcuts: [{
-            text: '最近一周',
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
-              picker.$emit('pick', [start, end]);
-            }
-          }, {
-            text: '最近一个月',
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
-              picker.$emit('pick', [start, end]);
-            }
-          }, {
-            text: '最近三个月',
-            onClick(picker) {
-              const end = new Date();
-              const start = new Date();
-              start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
-              picker.$emit('pick', [start, end]);
-            }
-          }]
-        },
-        value1: '',
-        value2: ''
-      }
-    },
-    created() {
-      // this.fetchData()
-    },
-    mounted() {
-      this.$request({
-        url:'/api/Report/acceptorClassification?frequency=1&startDate=2020-10-12&endDate=2023-12-23',
-        method:'get',
-      }).then((res)=>{
-        this.list=res.data
+				input4: '',
+				checked: false,
+				pickerOptions: {
+					shortcuts: [{
+						text: '最近一周',
+						onClick(picker) {
+							const end = new Date();
+							const start = new Date();
+							start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
+							picker.$emit('pick', [start, end]);
+						}
+					}, {
+						text: '最近一个月',
+						onClick(picker) {
+							const end = new Date();
+							const start = new Date();
+							start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
+							picker.$emit('pick', [start, end]);
+						}
+					}, {
+						text: '最近三个月',
+						onClick(picker) {
+							const end = new Date();
+							const start = new Date();
+							start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
+							picker.$emit('pick', [start, end]);
+						}
+					}]
+				},
+				value1: '',
+				value2: ''
+			}
+		},
+		created() {
+			// this.fetchData()
+		},
+		mounted() {
+			this.$request({
+				url: '/api/Report/acceptorClassification?frequency=1&startDate=2020-10-12&endDate=2023-12-23',
+				method: 'get',
+			}).then((res) => {
+				this.list = res.data
 				this.getPageData()
-      })
-    },
-    methods: {
-      handleCommand(command) {
-        this.status = command
-
-      },
-      handlehpCommand(command) {
-        this.hpstatus = command
-
-      },
-      // fetchData() {
-      //   this.listLoading = true
-      //   getList().then(response => {
-      //     this.list = response.data.items
-      //     this.listLoading = false
-      //   })
-      // },
-      shipments1(){
-        this.$router.push({path:"/shipments1"})
-      },
-      shipments2(){
-        this.$router.push({path:"/shipments2"})
-      },
-      shipments3(){
-        this.$router.push({path:"/shipments3"})
-      },
-      Export(){
-				window.open('http://123.207.180.167:8700/api/Report/export/acceptorClassification?frequency=1&startDate=&endDate=')
-      },
+			})
+		},
+		methods: {
+			handleSelectionChange(data) {
+			  this.multipleSelection = data;
+			  console.log(this.multipleSelection);
+			},
+			handleCommand(command) {
+				this.status = command
+
+			},
+			handlehpCommand(command) {
+				this.hpstatus = command
+
+			},
+			shipments1() {
+				this.$router.push({
+					path: "/shipments1"
+				})
+			},
+			shipments2() {
+				this.$router.push({
+					path: "/shipments2"
+				})
+			},
+			shipments3() {
+				this.$router.push({
+					path: "/shipments3"
+				})
+			},
+			Export() {
+				window.open('https://ht.9026.com/api/Report/export/acceptorClassification?frequency=1&startDate=&endDate=')
+			},
 			handleCurrentChange(val) {
 				this.currentPage = val;
 				this.getPageData();
 			},
-			jumpFirstPage () {
-			    this.$refs.pagination.handleCurrentChange(1);
-			    this.$emit('handleCurrentChange', 1);
+			jumpFirstPage() {
+				this.$refs.pagination.handleCurrentChange(1);
+				this.$emit('handleCurrentChange', 1);
 			},
-			jumpLastPage () {
-			    let font = this.$refs.pagination
-			    let cpage = Math.ceil(font.total / font.pageSize);
-			    font.handleCurrentChange(cpage);
+			jumpLastPage() {
+				let font = this.$refs.pagination
+				let cpage = Math.ceil(font.total / font.pageSize);
+				font.handleCurrentChange(cpage);
 			},
 			getPageData() {
 				let start = (this.currentPage - 1) * this.pagesize;
 				let end = start + this.pagesize;
 				this.srcList = this.list.slice(start, end);
 			},
-    }
-  }
+		}
+	}
 </script>
 <style lang="scss">
-  .pulldown {
-    width: 185px;
-    height: 40px;
-    border: 1px solid #E8E8E8;
-    border-radius: 10px;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    justify-content: space-between;
-    padding: 0 20px;
-    color: #999999;
-  }
-  .pagesip{
-
-    width: 100%;
-    margin: 20px auto;
-    display: flex;
-    // align-items: center;
-    justify-content: flex-end;
-  }
-  .el-pagination.is-background .el-pager li:not(.disabled).active{
-    background-color:#D8AB5A;
-  }
-  .el-col{
-    margin-bottom: 20px;
-  }
+	.pulldown {
+		width: 185px;
+		height: 40px;
+		border: 1px solid #E8E8E8;
+		border-radius: 10px;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		justify-content: space-between;
+		padding: 0 20px;
+		color: #999999;
+	}
+
+	.pagesip {
+
+		width: 100%;
+		margin: 20px auto;
+		display: flex;
+		// align-items: center;
+		justify-content: flex-end;
+	}
+
+	.el-pagination.is-background .el-pager li:not(.disabled).active {
+		background-color: #D8AB5A;
+	}
+
+	.el-col {
+		margin-bottom: 20px;
+	}
 </style>

src/views/table/addAcceptor.vue

@@ -1,76 +1,80 @@
 <template>
-  <div class="form">
-    <el-form ref="form" :model="form" label-width="100px" >
-      <el-form-item label="承兑人名称" prop="name">
-        <el-input v-model="form.name" style="width: 500px;" placeholder="请输入承兑人名称"></el-input>
-      </el-form-item>
-      <el-form-item label="账号" prop="bankAccount">
-        <el-input v-model="form.bankAccount" style="width: 500px;" placeholder="请输入账号"></el-input>
-      </el-form-item>
-      <el-form-item label="开户行名称" prop="bankName" >
-        <el-input v-model="form.bankName" style="width: 500px;" placeholder="请输入开户行名称"></el-input>
-      </el-form-item>
-      <el-form-item label="服务费率" prop="serviceRate">
-        <el-input v-model="form.serviceRate" placeholder="请输入服务费率" style="width: 500px;" >
-			<i slot="suffix" style="font-style:normal;margin-right: 10px;">%</i>
-        </el-input>
-        </el-form-item>
-        <el-form-item label="利率" prop="interest">
-          <el-input v-model="form.interest" placeholder="请输入利率" style="width: 500px;">
-			  <i slot="suffix" style="font-style:normal;margin-right: 10px;">%</i>
-          </el-input>
-          </el-form-item>
-           <el-form-item>
-              <el-button type="primary" @click="onsubmit">立即提交</el-button>
-			  <el-button type="primary" @click="resetForm('form')">重置</el-button>
-            </el-form-item>
-        </el-form>
-  </div>
+	<div class="form">
+		<el-form ref="form" :model="form" label-width="100px">
+			<el-form-item label="承兑人名称" prop="name">
+				<el-input v-model="form.name" style="width: 500px;" placeholder="请输入承兑人名称"></el-input>
+			</el-form-item>
+			<el-form-item label="账号" prop="bankAccount">
+				<el-input v-model="form.bankAccount" style="width: 500px;" placeholder="请输入账号"></el-input>
+			</el-form-item>
+			<el-form-item label="开户行名称" prop="bankName">
+				<el-input v-model="form.bankName" style="width: 500px;" placeholder="请输入开户行名称"></el-input>
+			</el-form-item>
+			<el-form-item label="服务费率" prop="serviceRate">
+				<el-input v-model="form.serviceRate" placeholder="请输入服务费率" style="width: 500px;">
+					<i slot="suffix" style="font-style:normal;margin-right: 10px;">%</i>
+				</el-input>
+			</el-form-item>
+			<el-form-item label="利率" prop="interest">
+				<el-input v-model="form.interest" placeholder="请输入利率" style="width: 500px;">
+					<i slot="suffix" style="font-style:normal;margin-right: 10px;">%</i>
+				</el-input>
+			</el-form-item>
+			<el-form-item>
+				<el-button type="primary" @click="onsubmit">立即提交</el-button>
+				<el-button type="primary" @click="resetForm('form')">重置</el-button>
+			</el-form-item>
+		</el-form>
+	</div>
 </template>
 
 <script>
-  import axios from 'axios'
- export default {
-   data(){
-     return {
-      form:{
-        name:'',
-        bankAccount:'',
-        bankName:'',
-        serviceRate:'',
-        interest:''
-      }
-     }
-   },
-   mounted() {
-   
-   },
-   methods:{
-    onsubmit(){
-      this.$request({
-        url:'/api/Acceptor',
-        method:'post',
-        data:this.form
-      }).then((res)=>{
-					this.$message("注册成功")
-					// this.$router.push({path:'table'})
-      })
-    },
-	resetForm(form) {
-	    this.$refs[form].resetFields();
-	    }
-   },
-   }
+	import axios from 'axios'
+	export default {
+		data() {
+			return {
+				form: {
+					name: '',
+					bankAccount: '',
+					bankName: '',
+					serviceRate: '',
+					interest: ''
+				}
+			}
+		},
+		mounted() {
+
+		},
+		methods: {
+			onsubmit() {
+				this.$request({
+					url: '/api/Acceptor',
+					method: 'post',
+					data: this.form
+				}).then((res) => {
+					this.$message("提交成功")
+					// this.$router.push({
+					// 	path: '/table'
+					// })
+					this.$router.go (-1)
+				})
+			},
+			resetForm(form) {
+				this.$refs[form].resetFields();
+			}
+		},
+	}
 </script>
 
 <style lang="scss">
-	.form{
+	.form {
 		margin-top: 100px;
 		display: flex;
 		align-items: center;
 		justify-content: center;
 	}
-	.el-form-item:last-child{
+
+	.el-form-item:last-child {
 		display: flex;
 		justify-content: space-between;
 	}

src/views/table/detail.vue

@@ -1,30 +1,30 @@
 <template>
-<el-descriptions title="详情信息">
-    <el-descriptions-item label="姓名">{{tableData.name}}</el-descriptions-item>
-    <el-descriptions-item label="服务费率">{{tableData.serviceRate}}%</el-descriptions-item>
-    <el-descriptions-item label="利率">{{tableData.interest}}%</el-descriptions-item>
-    <el-descriptions-item label="银行账户">{{tableData.bankAccount}}</el-descriptions-item>
-    <el-descriptions-item label="银行名称">{{tableData.bankName}}</el-descriptions-item>
-</el-descriptions>
+	<el-descriptions title="详情信息">
+		<el-descriptions-item label="姓名">{{tableData.name}}</el-descriptions-item>
+		<el-descriptions-item label="服务费率">{{tableData.serviceRate}}%</el-descriptions-item>
+		<el-descriptions-item label="利率">{{tableData.interest}}%</el-descriptions-item>
+		<el-descriptions-item label="银行账户">{{tableData.bankAccount}}</el-descriptions-item>
+		<el-descriptions-item label="银行名称">{{tableData.bankName}}</el-descriptions-item>
+	</el-descriptions>
 </template>
 
 <script>
-   export default {
-        data() {
-          return {
-            tableData:{},
-          }
-        },
-        mounted() {
-		let id=this.$route.query.id
-          this.$request({
-			url:'/api/Acceptor/'+id,
-            method:'get',
-          }).then((res)=>{
-            this.tableData=res.data
-          })
-        }
-      }
+	export default {
+		data() {
+			return {
+				tableData: {},
+			}
+		},
+		mounted() {
+			let id = this.$route.query.id
+			this.$request({
+				url: '/api/Acceptor/' + id,
+				method: 'get',
+			}).then((res) => {
+				this.tableData = res.data
+			})
+		}
+	}
 </script>
 
 <style>

src/views/table/index.vue

@@ -2,41 +2,41 @@
 	<div class="app-container">
 		<el-row type="flex" justify="space-between" style="margin-bottom:20px">
 			<!-- <el-col :xs="24" :sm="7" :md="6" :lg="4" :xl="3"> -->
-				<div class="grid-content bg-purple">
-					<el-dropdown @command="handleCommand">
-						<div class="pulldown">
-							<span class="el-dropdown-link" v-if="!status">
-								承兑人状态
-							</span>
-							<span class="el-dropdown-link" v-if="status">
-								{{status}}
-							</span>
-							<i class="el-icon-arrow-down el-icon--right"></i>
-						</div>
-						<el-dropdown-menu slot="dropdown">
-							<el-dropdown-item command="承兑人状态">承兑人状态</el-dropdown-item>
-							<el-dropdown-item command="正常">正常</el-dropdown-item>
-							<el-dropdown-item command="删除">删除</el-dropdown-item>
-						</el-dropdown-menu>
-					</el-dropdown>
-				</div>
+			<div class="grid-content bg-purple">
+				<el-dropdown @command="handleCommand">
+					<div class="pulldown">
+						<span class="el-dropdown-link" v-if="!status">
+							承兑人状态
+						</span>
+						<span class="el-dropdown-link" v-if="status">
+							{{status}}
+						</span>
+						<i class="el-icon-arrow-down el-icon--right"></i>
+					</div>
+					<el-dropdown-menu slot="dropdown">
+						<el-dropdown-item command="承兑人状态">承兑人状态</el-dropdown-item>
+						<el-dropdown-item command="正常">正常</el-dropdown-item>
+						<el-dropdown-item command="删除">删除</el-dropdown-item>
+					</el-dropdown-menu>
+				</el-dropdown>
+			</div>
 			<!-- </el-col> -->
 			<!-- <el-col :xs="24" :sm="10" :md="8" :lg="5" :xl="5"> -->
+			<div class="grid-content bg-purple">
 				<div class="grid-content bg-purple">
-					<div class="grid-content bg-purple" >
-						<el-input placeholder="请输入承兑人名称" v-model="search" @change="Search" clearable style="width: 100%;">
-							<i slot="prefix" class="el-input__icon el-icon-search"></i>
-						</el-input>
-					</div>
+					<el-input placeholder="请输入承兑人名称" v-model="search" @change="Search" clearable style="width: 100%;">
+						<i slot="prefix" class="el-input__icon el-icon-search"></i>
+					</el-input>
 				</div>
+			</div>
 			<!-- </el-col> -->
 
 			<!-- <el-col :xs="24" :sm="7" :md="6" :lg="8" :xl="16"> -->
-				<div class="grid-content bg-purple" style="display: flex;justify-content: flex-end;">
-					<el-button type="primary" @click="addAcceptor">新增承兑人</el-button>
-					<el-button type="primary" @click="Exports()">导出</el-button>
+			<div class="grid-content bg-purple" style="display: flex;justify-content: flex-end;">
+				<el-button type="primary" @click="addAcceptor">新增承兑人</el-button>
+				<el-button type="primary" @click="Exports">批量导出</el-button>
 
-				</div>
+			</div>
 			<!-- </el-col> -->
 
 		</el-row>
@@ -74,7 +74,8 @@
 				<template slot-scope="scope">
 					<el-tag type="primary" style="cursor: pointer;margin-right: 15px;" @click="toDetail(scope.row.id)">
 						详情</el-tag>
-					<el-tag type="success" style="cursor: pointer;margin-right: 15px;" @click="recover(scope.row.id)">复原</el-tag>
+					<el-tag type="success" style="cursor: pointer;margin-right: 15px;" @click="recover(scope.row.id)">复原
+					</el-tag>
 					<el-tag type="danger" style="cursor: pointer;margin-right: 15px;"
 						@click="deleteStatus(scope.row.id)">删除</el-tag>
 
@@ -100,7 +101,9 @@
 	import {
 		getList
 	} from '@/api/table'
-
+	import {
+		dataConversionUtil
+	} from '../../utils/Excel.js'
 	export default {
 		filters: {
 			statusFilter(status) {
@@ -118,8 +121,8 @@
 				list: [],
 				listLoading: false,
 				status: '',
-				search:'',
-				temporaryList:[],
+				search: '',
+				temporaryList: [],
 				currentPage: 1,
 				pagesize: 11,
 				multipleSelection: [],
@@ -163,23 +166,23 @@
 				method: 'post',
 				data: {
 					pageIndex: 1,
-					pageSize: 15,
+					pageSize: 100,
 				}
 			}).then((res) => {
 				console.log(res.data.result);
-				this.list = res.data.result;
+				this.list = res.data.result.reverse();
 				this.getPageData();
 			})
 		},
 		methods: {
 			handleCommand(command) {
 				this.status = command
-				if(this.status=="正常"||this.status=="删除"){
-					this.temporaryList=this.srcList.filter(item=>item.statusText==this.status)
-				}else {
-					this.temporaryList=this.srcList
-				}				
-				console.log(this.srcList,"command")
+				if (this.status == "正常" || this.status == "删除") {
+					this.temporaryList = this.srcList.filter(item => item.statusText == this.status)
+				} else {
+					this.temporaryList = this.srcList
+				}
+				console.log(this.srcList, "command")
 			},
 			handlehpCommand(command) {
 				this.hpstatus = command
@@ -188,11 +191,11 @@
 				this.multipleSelection = data
 				console.log(this.multipleSelection)
 			},
-			Search(){
-				if(this.search==""){
-					this.temporaryList=this.srcList
-				}else{
-					this.temporaryList=this.list.filter(item=>item.name==this.search)
+			Search() {
+				if (this.search == "") {
+					this.temporaryList = this.srcList
+				} else {
+					this.temporaryList = this.list.filter(item => item.name == this.search)
 				}
 			},
 			addAcceptor() {
@@ -214,13 +217,13 @@
 					}
 				})
 			},
-			recover(id){
-				let recovered=this.list.filter(item=>item.id==id)
-				recovered[0].statusText="正常"
+			recover(id) {
+				let recovered = this.list.filter(item => item.id == id)
+				recovered[0].statusText = "正常"
 			},
 			deleteStatus(id) {
-				let deleted=this.list.filter(item=>item.id==id)
-				deleted[0].statusText="删除"
+				let deleted = this.list.filter(item => item.id == id)
+				deleted[0].statusText = "删除"
 			},
 
 			handleCurrentChange(val) {
@@ -240,8 +243,21 @@
 				let start = (this.currentPage - 1) * this.pagesize;
 				let end = start + this.pagesize;
 				this.srcList = this.list.slice(start, end);
-				this.temporaryList=this.srcList
+				this.temporaryList = this.srcList
 			},
+			Exports() {
+				var tableHeader = [
+					['序号','承兑人名称', '账号', '开户行名称', '服务费率', '利率', '状态', '时间'],
+				]
+				var dataList = []
+				this.multipleSelection.forEach((item, index) => {
+					dataList.push([index + 1, item.name, item.bankAccount, item.bankName, item.serviceRate, item
+						.interest, item.statusText, item.createdAt
+					]);
+				})
+				dataConversionUtil.dataToExcel('承兑人列表', tableHeader, dataList)
+				this.$message.success('导出成功!');
+			}
 		},
 	}
 </script>