<template><!-- vue的模板元素標籤 -->
<div class="execution">
<basic-container>
<avue-crud <!-- avue的表格標籤 -->
ref="crud" <!-- 在普通的 DOM 元素上使用,引用指向的就是 DOM 元素;如果用在子組件上,引用就指向組件 -->
:page="page" <!-- 表格分頁配置選項 -->
:data="tableData" <!-- 表格顯示的數據 -->
:permission="permissionList"
:table-loading="tableLoading" <!-- 表格等待框的控制-->
:option="tableOption" <!-- 表格配置屬性-->
@on-load="getList"
@selection-change="selectionChange" <!-- 當選擇項發生變化時會觸發該事件 -->
@search-change="searchChange" <!-- 點擊搜索後觸發該事件 -->
@refresh-change="refreshChange" <!-- 點擊刷新按鈕觸發該事件 -->
@row-update="handleUpdate" <!-- 編輯數據後確定觸發該事件 -->
@row-save="handleSave" <!-- 新增數據後點擊確定觸發該事件 -->
@row-del="rowDel"> <!-- 行數據刪除時觸發該事件 -->
<template slot="expand" slot-scope="scope"> <!-- 卡槽expand模板是:表格展開摺疊行佈局。要在tableOption對象的js中搭配expand:true使用;傳入的scope爲當前行的對象,可通過scope.row獲取 -->
聯繫電話:{{scope.row.lxdh}} ,產品費用:{{scope.row.cpfy}} ,產品銷售淨額:{{scope.row.xsje}}
</template>
<template slot="menuLeft" slot-scope="scope"> <!-- 卡槽menuLeft模板是:表格上方菜單欄按鈕。 -->
<el-button type="primary"
icon="el-icon-plus"
size="small"
@click.stop="rowAdd(scope.row)">添加交易</el-button>
<el-button type="primary"
icon="el-icon-upload2"
size="small"
plain
@click.stop="importExcelDialog">批量導入</el-button>
<el-button type="primary"
icon="el-icon-sell"
size="small"
plain
@click.stop="rowLotDialog(1,scope.row)">提交申請</el-button>
<el-button type="primary"
icon="el-icon-tickets"
size="small"
plain
@click.stop="rowLotDialog(2,scope.row)">我要複覈</el-button>
<el-button type="warning"
icon="el-icon-download"
size="small"
plain
@click.stop="exportExcel">導 出</el-button>
</template>
<template slot="menu" slot-scope="scope"> <!-- 卡槽menu模板是:表格內右側邊操作菜單欄按鈕。 -->
<el-button icon="el-icon-edit"
size="small" type="text"
@click.stop="rowUpdate(scope.row,scope.index)">編輯</el-button>
<el-button icon="el-icon-delete"
size="small" type="text"
@click.stop="rowDel(scope.row,scope.index)">刪除</el-button>
<el-button icon="el-icon-sell"
size="small" type="text"
@click.stop="rowDialog(1,scope.row,scope.index)">提交</el-button>
<el-button icon="el-icon-tickets"
size="small" type="text"
@click.stop="rowDialog(2,scope.row,scope.index)">複覈</el-button>
<el-dialog <!-- 使用element彈窗對話框方式,對提交操作按鈕佈局 -->
title="提交複覈申請" <!-- 彈窗標題 -->
:visible.sync="dialogFormVisibleSbumit" <!-- 是否顯示 Dialog,支持 .sync 修飾符 -->
width="40%" <!-- 彈出的對話框寬度 -->
append-to-body="true"> <!-- Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必須指定該屬性並賦值爲 true -->
<el-form :model="form"> <!-- 表單 -->
<h3>當前已選擇待複覈交易共<span>{{selectcpobjs.length}}</span>筆,詳細交易如下:</h3>
<div style="margin-top:20px;" >
<el-tooltip
class="item"
effect="dark"
v-for="(item,i) of selectcpobjs" :key="i"
placement="top-start">
<div slot="content">
產品名稱:{{selectcpobjs[i].cpmc}} , 客戶名稱:{{selectcpobjs[i].hymc}} ,<br/>
成交金額:{{selectcpobjs[i].cjje}} , 產品定價:{{selectcpobjs[i].cpdj}} ,<br/>
</div>
<el-button>{{selectcpobjs[i].cpmc.length>9?selectcpobjs[i].cpmc.slice(0,8)+'...':selectcpobjs[i].cpmc}}</el-button>
</el-tooltip>
</div>
<el-form-item>
<el-select v-model="fhrmc" placeholder="請選擇複覈人">
<el-option
v-for="item in fhrList"
:key="item.userId"
:label="item.username"
:value="item.userId"></el-option>
</el-select>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="cancelDialog">取 消</el-button>
<el-button type="primary" @click="toAudit(1)">發 送</el-button>
</span>
</el-dialog>
<el-dialog title="複覈" :visible.sync="dialogFormVisibleTickets" width="40%" append-to-body="true">
<el-form :model="form">
<div>
<h3>當前需審覈產品簡要信息如下:</h3>
<div style="margin-top:20px;" >
<el-tooltip
class="item"
effect="dark"
v-for="(item,i) of selectcpobjs" :key="i"
placement="top-start">
<div slot="content">
產品名稱:{{selectcpobjs[i].cpmc}} , 客戶名稱:{{selectcpobjs[i].hymc}} ,<br/>
成交金額:{{selectcpobjs[i].cjje}} , 產品定價:{{selectcpobjs[i].cpdj}} ,<br/>
</div>
<el-button>{{selectcpobjs[i].cpmc}}</el-button>
</el-tooltip>
</div>
<div style="margin-top:20px;">
<el-radio-group v-model="radio" @change="setTextArea">
<el-radio-button label="1">同意</el-radio-button>
<el-radio-button label="2">不同意</el-radio-button>
</el-radio-group>
<div style="margin-top:20px;">
<el-input
type="textarea"
:autosize="{ minRows: 5, maxRows: 10}"
v-model="textarea"
ref="tex">
</el-input>
</div>
</div>
</div>
<div style="height:10px;"></div>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="doAudit(radio)">提 交</el-button>
<el-button @click="cancelDialog">取 消</el-button>
</span>
</el-dialog>
</template>
<template slot-scope="scope" slot="jkhsjlListForm">
<div style="height:135px;">
<el-row v-for="(item,i) of jkhsjlListArr" :key="i">
<el-col :span="5">
<el-input
:placeholder=i+1
maxlength="18"
minlength="1"
v-model="index.val[i]">
</el-input>
</el-col>
<el-col :span="1" align="center">--</el-col>
<el-col :span="5">
<el-input
placeholder="回輸日期"
v-model="hsrq.val[i]">
</el-input>
</el-col>
<el-col :span="1" align="center">--</el-col>
<el-col :span="10">
<el-input
maxlength="18"
minlength="1"
placeholder="說明"
v-model="sm.val[i]">
</el-input>
</el-col>
<el-col :span="1">
<el-link @click="jkhsjlListDelete(i)" icon="el-icon-remove-outline" :underline="false" style="margin-left:4px;">
</el-link>
</el-col>
<el-col :span="1">
<el-link @click="jkhsjlListAdd()" icon="el-icon-circle-plus-outline" :underline="false">
</el-link>
</el-col>
</el-row>
</div>
</template>
</avue-crud>
</basic-container>
</div>
</template>
href="{{scope.row.logisticsResultfile}}": Interpolation inside attributes has been removed. Use v-bind or the colon shorthand instead. For example, instead of <div id="{{ val }}">, use <div :id="val">.