|
@@ -51,7 +51,7 @@
|
|
|
></el-progress>
|
|
|
</div>
|
|
|
</div>
|
|
|
- <div style="width: 20%; height: 150px; margin-left: 16px">
|
|
|
+ <div style="width: 20%; height: 150px; margin-left: 16px" @click="onClick">
|
|
|
<div style="display: inline-block; height: 120px; margin-top: 16px">
|
|
|
<p class="box-title">{{ $t("实际金额") }}</p>
|
|
|
<p style="font-size: 26px; color: #4f7bfd">
|
|
@@ -300,13 +300,121 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
|
|
+ <el-drawer
|
|
|
+ :title="$t(this.typeDate) + '_' + $t(this.title) + $t('明细')"
|
|
|
+ :visible.sync="visibleShow"
|
|
|
+ size="90%"
|
|
|
+ direction="rtl"
|
|
|
+ append-to-body
|
|
|
+ @close="onClose"
|
|
|
+ >
|
|
|
+ <div class="drawer__panel_new">
|
|
|
+ <div>
|
|
|
+ <div class="mt-10 inline-16">
|
|
|
+ <span class="search__label" >{{$t('部门')}}:</span>
|
|
|
+ <el-cascader disabled :placeholder="$t('请选择')" class="inline-16" ref="selectdep" size="small" v-model="depment" :options="deplist" :props="{emitPath:true,expandTrigger:'hover',checkStrictly:true,label:'label',value:'departmentid',children:'children'}" @change="selectDep" ></el-cascader>
|
|
|
+ </div>
|
|
|
+ <div class="mt-10 inline-16">
|
|
|
+ <span class="search__label" >{{$t('业务员')}}:</span>
|
|
|
+ <el-select disabled class="inline-16" v-model="person" filterable :placeholder="$t('请选择')" size="small" @change="selectPerson" >
|
|
|
+ <el-option
|
|
|
+ v-for="item in personnelList"
|
|
|
+ :key="item.index"
|
|
|
+ :label="$t(item.name)"
|
|
|
+ :value="item.userid">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div class="mt-10 inline-16">
|
|
|
+ <span class="search__label" >{{$t('订单类型')}}:</span>
|
|
|
+ <el-select class="inline-16" v-model="orderType" filterable :placeholder="$t('请选择')" size="small" clearable @change="selectOrderType" >
|
|
|
+ <el-option
|
|
|
+ v-for="item in orderTypes"
|
|
|
+ :key="item.index"
|
|
|
+ :label="$t(item.value)"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div class="mt-10 inline-16">
|
|
|
+ <span class="search__label" >{{$t('领域')}}:</span>
|
|
|
+ <el-select class="inline-16" v-model="tradefield" filterable :placeholder="$t('请选择')" size="small" clearable @focus="queryTradefield" @change="selectTradefield" >
|
|
|
+ <el-option
|
|
|
+ v-for="item in tradefieldList"
|
|
|
+ :key="item.index"
|
|
|
+ :label="$t(item.value)"
|
|
|
+ :value="item.value">
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </div>
|
|
|
+ <div class="mt-10 inline-16">
|
|
|
+ <el-input style="width:200px;!important;" :placeholder="$t(`搜索`)" :suffix-icon="paramDetail.content.where.condition?paramDetail.content.where.condition.length > 0?'':'':'el-icon-search'" v-model="paramDetail.content.where.condition" @keyup.native.enter="listDataInfo(paramDetail.content.pageNUmber = 1)" @clear="listDataInfo(paramDetail.content.pageNUmber = 1)" size="small" class="input-with-select inline-16 layout_search__panel" clearable>
|
|
|
+ </el-input>
|
|
|
+ </div>
|
|
|
+ <div class="mt-10 inline-16">
|
|
|
+ <exportFile :param="paramDetail" :columns="tablecols" :fileName="$t(this.typeDate) + '_' + $t(this.title) + $t('明细')"></exportFile>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <tableTemplate style="margin-top: 10px" ref="table" :layout="tablecols" :data="listInfo" :opwidth="200" :custom="true" :height="height" fixedName="operation">
|
|
|
+ <template v-slot:customcol="scope">
|
|
|
+ <div v-if="scope.column.columnname === 'nominalpressure'">
|
|
|
+ {{tool.nominalPressureSet(scope.column.data.nominalpressure)}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'marketprice'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'price'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'amount'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'invoiceamount'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'writeoffamount'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'returnamount'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'logisticsamount'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'uninvoiceamount'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else-if="scope.column.columnname === 'unwriteoffamount'">
|
|
|
+ {{scope.column.data[scope.column.columnname]?tool.formatAmount(scope.column.data[scope.column.columnname],2,'¥'):'¥0.00'}}
|
|
|
+ </div>
|
|
|
+ <div v-else>{{scope.column.data[scope.column.columnname]?$t(scope.column.data[scope.column.columnname]):'--'}}</div>
|
|
|
+ </template>
|
|
|
+ </tableTemplate>
|
|
|
+ <div class="container normal-panel" style="text-align:right;float: right">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ @size-change="handleSizeChange"
|
|
|
+ @current-change="handleCurrentChange"
|
|
|
+ :current-page="currentPage"
|
|
|
+ :pager-count="5"
|
|
|
+ :page-sizes="[100,150, 200]"
|
|
|
+ :page-size="100"
|
|
|
+ layout="total,sizes, prev, pager, next, jumper"
|
|
|
+ :total="total">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </el-drawer>
|
|
|
</div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import tableTemplate from './table';
|
|
|
+import exportFile from '@/components/export_file/index5'
|
|
|
export default {
|
|
|
name: "boxLine",
|
|
|
props: ["title", "typeDate", "index"],
|
|
|
+ components:{tableTemplate,exportFile},
|
|
|
data() {
|
|
|
return {
|
|
|
list: [],
|
|
@@ -323,6 +431,57 @@ export default {
|
|
|
},
|
|
|
},
|
|
|
},
|
|
|
+ visibleShow:false,
|
|
|
+ depmentid:'',
|
|
|
+ deplist:[],
|
|
|
+ personnelList:[],
|
|
|
+ depment:'',
|
|
|
+ person:'',
|
|
|
+ depParam:{
|
|
|
+ "id": 20230620102004,
|
|
|
+ "content": {
|
|
|
+ }
|
|
|
+ },
|
|
|
+ orderTypes:[
|
|
|
+ {
|
|
|
+ value:'标准订单'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'特殊订单'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'项目订单'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'促销订单'
|
|
|
+ },
|
|
|
+ {
|
|
|
+ value:'工具订单'
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ orderType:'',
|
|
|
+ tradefield:'',
|
|
|
+ tradefieldList:[],
|
|
|
+ paramDetail:{
|
|
|
+ "id": 2025032613405702,
|
|
|
+ "content": {
|
|
|
+ "type": "1",
|
|
|
+ "dataid": 58,
|
|
|
+ "dateType": "去年", //去年,本年,本季,本月
|
|
|
+ "pageNumber":1,
|
|
|
+ "pageSize":100,
|
|
|
+ "where": {
|
|
|
+ "condition": "",
|
|
|
+ "type": "",
|
|
|
+ "tradefield": ""
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tablecols:[],
|
|
|
+ listInfo:[],
|
|
|
+ height:'calc(100vh - 195px)',
|
|
|
+ currentPage:0,
|
|
|
+ total:0
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
@@ -341,6 +500,164 @@ export default {
|
|
|
this.list = res.data;
|
|
|
this.percentage = Math.round(this.list.wcamount * 100 * 100) / 100;
|
|
|
},
|
|
|
+ onClick(){
|
|
|
+ console.log('点击',this.title)
|
|
|
+ this.orderType = ''
|
|
|
+ this.tradefield = ''
|
|
|
+ this.paramDetail.content.where.condition = ''
|
|
|
+ this.paramDetail.content.pageNUmber = 1
|
|
|
+ this.paramDetail.content.where.type = ''
|
|
|
+ this.paramDetail.content.where.tradefield = ''
|
|
|
+ this.visibleShow = true
|
|
|
+ if (this.title == '订单'){
|
|
|
+ this.tablecols = this.tool.tabelCol(this.$route.name).orderDetailsTable.tablecols
|
|
|
+ }else if (this.title == '出货'){
|
|
|
+ this.tablecols = this.tool.tabelCol(this.$route.name).shippingDetailsTable.tablecols
|
|
|
+ }else if (this.title == '开票'){
|
|
|
+ this.tablecols = this.tool.tabelCol(this.$route.name).billingDetailsTable.tablecols
|
|
|
+ }else if (this.title == '回款'){
|
|
|
+ this.tablecols = this.tool.tabelCol(this.$route.name).paymentScheduleTable.tablecols
|
|
|
+ }
|
|
|
+ this.queryDep()
|
|
|
+ this.paramDetail.content.pageNUmber = 1
|
|
|
+ this.listDataInfo()
|
|
|
+ },
|
|
|
+ onClose(){
|
|
|
+ this.visibleShow = false
|
|
|
+ },
|
|
|
+ /*获取部门*/
|
|
|
+ async queryDep(){
|
|
|
+ const res = await this.$api.requested(this.depParam)
|
|
|
+ this.deplist = this.createMenu(res.data.dep)
|
|
|
+ this.personnelList = res.data.hr
|
|
|
+ const usertype = JSON.parse(sessionStorage.getItem('active_account')).usertype
|
|
|
+ const userName = JSON.parse(sessionStorage.getItem('active_account')).name
|
|
|
+ const userid = JSON.parse(sessionStorage.getItem('active_account')).userid
|
|
|
+ if (this.param.content.type == 1){
|
|
|
+ this.depment = this.param.content.dataid
|
|
|
+ this.person = ''
|
|
|
+ }else {
|
|
|
+ console.log(usertype,userName,'eeeeee',userid,this.param.content.dataid)
|
|
|
+ this.person = userid === this.param.content.dataid?userName:this.param.content.dataid
|
|
|
+ console.log(this.person,'person')
|
|
|
+ this.depment = ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ createMenu (array) {
|
|
|
+ var that = this
|
|
|
+ let arr = []
|
|
|
+ function convertToElementTree(node) {
|
|
|
+ // 新节点
|
|
|
+ if (node.subdep.length === 0){
|
|
|
+ var elNode = {
|
|
|
+ label: node["depname"],
|
|
|
+ parentid:node['parentid'],
|
|
|
+ parentname:node['parentname'],
|
|
|
+ departmentid:node["departmentid"],
|
|
|
+ value:node["departmentid"],
|
|
|
+ remarks:node["remarks"],
|
|
|
+ isused:node["isused"],
|
|
|
+ changedate:node['changedate'],
|
|
|
+ changeby:node['changeby'],
|
|
|
+ createdate:node['createdate'],
|
|
|
+ createby:node['createby'],
|
|
|
+ depno:node['depno'],
|
|
|
+ disabled:that.pageOnlyRead,
|
|
|
+ }
|
|
|
+ }else {
|
|
|
+ var elNode = {
|
|
|
+ label: node["depname"],
|
|
|
+ parentid:node['parentid'],
|
|
|
+ parentname:node['parentname'],
|
|
|
+ departmentid:node["departmentid"],
|
|
|
+ value:node["departmentid"],
|
|
|
+ remarks:node["remarks"],
|
|
|
+ isused:node["isused"],
|
|
|
+ changedate:node['changedate'],
|
|
|
+ changeby:node['changeby'],
|
|
|
+ createdate:node['createdate'],
|
|
|
+ createby:node['createby'],
|
|
|
+ depno:node['depno'],
|
|
|
+ disabled:that.pageOnlyRead,
|
|
|
+ children: []
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if (node.subdep && node.subdep.length > 0) {
|
|
|
+ // 如果存在子节点
|
|
|
+ for (var index = 0; index < node.subdep.length; index++) {
|
|
|
+ // 遍历子节点, 把每个子节点看做一颗独立的树, 传入递归构造子树, 并把结果放回到新node的children中
|
|
|
+ elNode.children.push(convertToElementTree(node.subdep[index]));
|
|
|
+ }
|
|
|
+ }
|
|
|
+ return elNode;
|
|
|
+ }
|
|
|
+ array.forEach((element) => {
|
|
|
+ arr.push(convertToElementTree(element))
|
|
|
+ });
|
|
|
+ return arr
|
|
|
+ },
|
|
|
+ /*选择部门*/
|
|
|
+ selectDep(val){
|
|
|
+ this.person = ''
|
|
|
+ this.depmentid = val[val.length -1]
|
|
|
+ this.param.content.pageNumber = 1
|
|
|
+ this.listData(1,val[val.length -1],this.nowEndDate)
|
|
|
+ },
|
|
|
+ /*选择业务员*/
|
|
|
+ selectPerson(val){
|
|
|
+ this.depment = ''
|
|
|
+ this.depmentid = val
|
|
|
+ this.param.content.pageNumber = 1
|
|
|
+ this.listData(0,val,this.nowEndDate)
|
|
|
+ },
|
|
|
+ /*选择订单类型*/
|
|
|
+ selectOrderType(){
|
|
|
+ this.paramDetail.content.pageNUmber = 1
|
|
|
+ this.paramDetail.content.type = this.orderType
|
|
|
+ this.listDataInfo()
|
|
|
+ },
|
|
|
+ async queryTradefield(){
|
|
|
+ if (this.tradefieldList.length < 1){
|
|
|
+ const res = await this.$store.dispatch('optiontypeselect','tradefield')
|
|
|
+ this.tradefieldList = res.data
|
|
|
+ }
|
|
|
+ },
|
|
|
+ /*选择领域*/
|
|
|
+ selectTradefield(){
|
|
|
+ this.paramDetail.content.pageNUmber = 1
|
|
|
+ this.listDataInfo()
|
|
|
+ },
|
|
|
+ async listDataInfo(){
|
|
|
+ if (this.title == '订单'){
|
|
|
+ this.paramDetail.id = 2025032613405702
|
|
|
+ }else if (this.title == '出货'){
|
|
|
+ this.paramDetail.id = 2025032615330102
|
|
|
+ }else if (this.title == '开票'){
|
|
|
+ this.paramDetail.id = 2025032616343302
|
|
|
+ }else if (this.title == '回款'){
|
|
|
+ this.paramDetail.id = 2025032616352402
|
|
|
+ }
|
|
|
+ this.paramDetail.content.type = this.param.content.type
|
|
|
+ this.paramDetail.content.dataid = this.param.content.dataid
|
|
|
+ this.paramDetail.content.dateType = this.param.content.dateType
|
|
|
+ this.paramDetail.content.where.type = this.orderType
|
|
|
+ this.paramDetail.content.where.tradefield = this.tradefield
|
|
|
+ const res = await this.$api.requested(this.paramDetail)
|
|
|
+ this.listInfo = res.data
|
|
|
+ this.total = res.total
|
|
|
+ this.currentPage = res.pageNumber
|
|
|
+ console.log(res.data,'数据1111')
|
|
|
+ },
|
|
|
+ handleSizeChange(val) {
|
|
|
+ // console.log(`每页 ${val} 条`);
|
|
|
+ this.paramDetail.content.pageSize = val
|
|
|
+ this.listDataInfo()
|
|
|
+ },
|
|
|
+ handleCurrentChange(val) {
|
|
|
+ // console.log(`当前页: ${val}`);
|
|
|
+ this.paramDetail.content.pageNumber = val
|
|
|
+ this.listDataInfo()
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|