|
|
@@ -0,0 +1,352 @@
|
|
|
+<template>
|
|
|
+ <div id="tCooperativeOrganizationList">
|
|
|
+ <el-row>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-col :span="24" class="search">
|
|
|
+ <el-col :span="5">
|
|
|
+ <span>筛选条件：</span>
|
|
|
+ <el-select v-model="search.type" placeholder="请选择类型">
|
|
|
+ <el-option label="银行" value="1"></el-option>
|
|
|
+ <el-option label="担保" value="2"></el-option>
|
|
|
+ <el-option label="创投" value="3"></el-option>
|
|
|
+ <el-option label="协会" value="4"></el-option>
|
|
|
+ <el-option label="金融科技" value="5"></el-option>
|
|
|
+ <el-option label="非银行金融机构" value="6"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-col>
|
|
|
+ <!--<el-col :span="4">
|
|
|
+ <span>输入条件：</span>
|
|
|
+ <el-input v-model="search.title" :placeholder="placeholder" class="input"></el-input>
|
|
|
+ </el-col>-->
|
|
|
+ <!--<el-col :span="7">
|
|
|
+ <span>时间选择：</span>
|
|
|
+ <el-date-picker v-model="search.date" type="daterange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期"> </el-date-picker>
|
|
|
+ </el-col>-->
|
|
|
+ <el-col :span="8">
|
|
|
+ <el-button class="btnSearch" @click="toQuery">查询</el-button>
|
|
|
+ <el-button class="btnSearch qing" @click="toClear">清空</el-button>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="24">
|
|
|
+ <el-table
|
|
|
+ ref="tableData"
|
|
|
+ :data="tableData"
|
|
|
+ tooltip-effect="dark"
|
|
|
+ :default-sort="{ prop: 'date', order: 'descending' }"
|
|
|
+ style="width: 100%"
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
+ >
|
|
|
+ <!--<el-table-column type="selection" align="center"> </el-table-column>-->
|
|
|
+ <el-table-column type="index" label="序号" width="50" align="center"></el-table-column>
|
|
|
+ <el-table-column label="类型" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span>{{ getState(scope.row.type)}}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="图片" align="center">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span> <el-image v-if="scope.row.image" :src="scope.row.image" style="height:20px;width:20px "
|
|
|
+ @click="showImage(scope.row.image)"></el-image></span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" width="300px">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <!--<el-button size="mini" type="text" class="other" @click="updateState(scope.row,'-2')" v-if="scope.row.current_state === '0'">审核</el-button>
|
|
|
+ <el-button size="mini" type="text" class="other" @click="updateState(scope.row,'-1')">停用</el-button>-->
|
|
|
+ <el-button size="mini" type="text" class="edit" icon="el-icon-edit"
|
|
|
+ @click="$router.push({ path: '/tCooperativeOrganization/detail', query: { id: scope.row.id } })"></el-button>
|
|
|
+ <el-button size="mini" type="text" class="delete" icon="el-icon-delete"
|
|
|
+ @click.prevent="deleteRow(scope.row.id)"></el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <el-row>
|
|
|
+ <el-pagination
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page.sync="currentPage"
|
|
|
+ :page-sizes="[10, 20, 30, 40]"
|
|
|
+ :page-size.sync="limit"
|
|
|
+ background
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="total"
|
|
|
+ >
|
|
|
+ </el-pagination>
|
|
|
+ </el-row>
|
|
|
+ </el-col>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ <el-dialog
|
|
|
+ :visible.sync="dialogVisible"
|
|
|
+ width="30%"
|
|
|
+ >
|
|
|
+ <el-image :src="elImage" style="height:100%;width:100% "></el-image>
|
|
|
+ </el-dialog>
|
|
|
+ <el-dialog title="审核意见" :visible.sync="dialogFormVisible" width="30%" @open="openDialog">
|
|
|
+ <el-input v-model="input" autocomplete="off" placeholder="请输入审核意见"></el-input>
|
|
|
+ <div slot="footer" class="dialog-footer">
|
|
|
+ <el-button type="primary" @click="confirmClick">{{confirm}}</el-button>
|
|
|
+ <el-button @click="cancelClick">{{cancel}}</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+ export default {
|
|
|
+ name: 'tCooperativeOrganizationList',
|
|
|
+ props: {
|
|
|
+ tableData: null,
|
|
|
+ total: null,
|
|
|
+ },
|
|
|
+ components: {},
|
|
|
+ data: () => ({
|
|
|
+ placeholder: '请输入标题',
|
|
|
+ search: {},
|
|
|
+ currentPage: 1,
|
|
|
+ limit: 10,
|
|
|
+ dialogVisible: false,
|
|
|
+ elImage: '',
|
|
|
+ tempId:'',
|
|
|
+ tempState:'',
|
|
|
+ dialogFormVisible: false,
|
|
|
+ input:'',
|
|
|
+ confirm:'确定',
|
|
|
+ cancel:'取消',
|
|
|
+ }),
|
|
|
+ created() {
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ handleSelectionChange(val) {
|
|
|
+ this.multipleSelection = val;
|
|
|
+ },
|
|
|
+ deleteRow(id) {
|
|
|
+ this.$confirm('确定删除吗?', '提示', {
|
|
|
+ confirmButtonText: '确定',
|
|
|
+ cancelButtonText: '取消',
|
|
|
+ type: 'warning'
|
|
|
+ }).then(() => {
|
|
|
+ this.$set(this, `currentPage`, 1);
|
|
|
+ this.$emit('deleteRow', {id: id, skip: 0, limit: this.limit, ...this.search});
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message({
|
|
|
+ type: 'info',
|
|
|
+ message: '已取消删除'
|
|
|
+ });
|
|
|
+ });
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ this.$set(this, `currentPage`, 1);
|
|
|
+ this.$emit('select', {skip: 0, limit: val, ...this.search});
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ this.$emit('select', {skip: (val - 1) * this.limit, limit: this.limit, ...this.search});
|
|
|
+ },
|
|
|
+ toQuery() {
|
|
|
+ this.$set(this, `currentPage`, 1);
|
|
|
+ this.$emit('select', {skip: 0, limit: this.limit, ...this.search});
|
|
|
+ },
|
|
|
+ toClear() {
|
|
|
+ let keys = Object.keys(this.search);
|
|
|
+ for (const key of keys) {
|
|
|
+ this.$set(this.search, `${key}`, '');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ showImage(image) {
|
|
|
+ if(image){
|
|
|
+ this.$set(this, `elImage`, image);
|
|
|
+ this.$set(this, `dialogVisible`, true);
|
|
|
+ }else{
|
|
|
+ this.$set(this, `dialogVisible`, false);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getDate(val) {
|
|
|
+ if(val){
|
|
|
+ return this.format(new Date(Number(val)),'yyyy年MM月dd');
|
|
|
+ }
|
|
|
+ return '';
|
|
|
+ },
|
|
|
+ format(date,formatStr){
|
|
|
+ formatStr=formatStr.replace(/yyyy|YYYY/,date.getFullYear());
|
|
|
+ formatStr=formatStr.replace(/MM/,(date.getMonth()+1)>9?(date.getMonth()+1).toString():'0' + (date.getMonth()+1));
|
|
|
+ formatStr=formatStr.replace(/dd|DD/,date.getDate()>9?date.getDate().toString():'0' + date.getDate());
|
|
|
+ return formatStr;
|
|
|
+ },
|
|
|
+ publish(row){
|
|
|
+ if(row.publish_state === '1'){
|
|
|
+ this.$message.error('已发布');
|
|
|
+ return ;
|
|
|
+ }
|
|
|
+ this.$emit('publish', {row:row,skip: (this.currentPage - 1) * this.limit, limit: this.limit, ...this.search});
|
|
|
+ },
|
|
|
+ openDialog(){
|
|
|
+ this.$set(this, `input`, '');
|
|
|
+ },
|
|
|
+ confirmClick(){
|
|
|
+ this.$set(this, `dialogFormVisible`, false);
|
|
|
+ switch(this.tempState)
|
|
|
+ {
|
|
|
+ case '0':
|
|
|
+ break;
|
|
|
+ case '1':
|
|
|
+ break;
|
|
|
+ case '2':
|
|
|
+ break;
|
|
|
+ case '-1':
|
|
|
+ this.$emit('updateState', {id:this.tempId,state:this.tempState,result:this.input,skip: (this.currentPage - 1) * this.limit, limit: this.limit, ...this.search});
|
|
|
+ break;
|
|
|
+ case '-2':
|
|
|
+ this.$emit('updateState', {id:this.tempId,state:'1',result:this.input,skip: (this.currentPage - 1) * this.limit, limit: this.limit, ...this.search});
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ cancelClick(){
|
|
|
+ this.$set(this, `dialogFormVisible`, false);
|
|
|
+ switch(this.tempState)
|
|
|
+ {
|
|
|
+ case '0':
|
|
|
+ break;
|
|
|
+ case '1':
|
|
|
+ break;
|
|
|
+ case '2':
|
|
|
+ break;
|
|
|
+ case '-1':
|
|
|
+ break;
|
|
|
+ case '-2':
|
|
|
+ this.$emit('updateState', {id:this.tempId,state:'2',result:this.input,skip: (this.currentPage - 1) * this.limit, limit: this.limit, ...this.search});
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ updateState(row,state){
|
|
|
+ this.$set(this, `tempId`, row.id);
|
|
|
+ this.$set(this, `tempState`, state);
|
|
|
+ switch(state)
|
|
|
+ {
|
|
|
+ case '0':
|
|
|
+ break;
|
|
|
+ case '1':
|
|
|
+ break;
|
|
|
+ case '2':
|
|
|
+ break;
|
|
|
+ case '-1':
|
|
|
+ if(row.current_state === state){
|
|
|
+ this.$message.error('已停用');
|
|
|
+ }else{
|
|
|
+ this.$set(this, `confirm`, '停用');
|
|
|
+ this.$set(this, `cancel`, '取消');
|
|
|
+ this.$set(this, `dialogFormVisible`, true);
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case '-2':
|
|
|
+ this.$set(this, `confirm`, '审核通过');
|
|
|
+ this.$set(this, `cancel`, '审核拒绝');
|
|
|
+ this.$set(this, `dialogFormVisible`, true);
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getState(val) {
|
|
|
+ switch(val)
|
|
|
+ {
|
|
|
+ case '1':
|
|
|
+ return '银行';
|
|
|
+ case '2':
|
|
|
+ return '担保';
|
|
|
+ case '3':
|
|
|
+ return '创投';
|
|
|
+ case '4':
|
|
|
+ return '协会';
|
|
|
+ case '5':
|
|
|
+ return '金融科技';
|
|
|
+ case '6':
|
|
|
+ return '非银行金融机构';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ },
|
|
|
+ };
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="less" scoped>
|
|
|
+ /deep/ .el-checkbox__input.is-checked .el-checkbox__inner {
|
|
|
+ background-color: red;
|
|
|
+ border-color: red;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
|
|
+ background-color: red;
|
|
|
+ border-color: red;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-table th {
|
|
|
+ background-color: #f5f6fa;
|
|
|
+ padding: 8px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-table td {
|
|
|
+ padding: 11px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .other {
|
|
|
+ color: #f36302;
|
|
|
+ }
|
|
|
+
|
|
|
+ .view {
|
|
|
+ color: #f36302;
|
|
|
+ }
|
|
|
+
|
|
|
+ .edit {
|
|
|
+ color: #2ccc02;
|
|
|
+ }
|
|
|
+
|
|
|
+ .delete {
|
|
|
+ color: #e9021d;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-pagination {
|
|
|
+ padding: 26px 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-pagination.is-background .el-pager li:not(.disabled).active {
|
|
|
+ background-color: red;
|
|
|
+ }
|
|
|
+
|
|
|
+ .input {
|
|
|
+ width: 150px;
|
|
|
+ }
|
|
|
+
|
|
|
+ /deep/ .el-input__inner {
|
|
|
+ height: 35px;
|
|
|
+ line-height: 35px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .btnSearch {
|
|
|
+ width: 80px;
|
|
|
+ height: 34px;
|
|
|
+ background: rgba(233, 2, 29, 1);
|
|
|
+ border-radius: 4px;
|
|
|
+ padding: 0;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .qing {
|
|
|
+ background: rgba(185, 185, 185, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .top {
|
|
|
+ height: 50px;
|
|
|
+ margin: 0 0 10px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .search {
|
|
|
+ background: #ffffff;
|
|
|
+ width: 97%;
|
|
|
+ height: 35px;
|
|
|
+ margin: 20px;
|
|
|
+ margin-left: 0px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .list {
|
|
|
+ padding: 0 20px;
|
|
|
+ }
|
|
|
+</style>
|
