Commit ea9c38ec authored by 纪泽龙's avatar 纪泽龙

新分支

parent aeea6d6b
......@@ -4,236 +4,323 @@
*/
/** 基础通用 **/
.pt5 {
padding-top: 5px;
}
.pr5 {
padding-right: 5px;
}
.pb5 {
padding-bottom: 5px;
}
.mt5 {
margin-top: 5px;
}
.mr5 {
margin-right: 5px;
}
.mb5 {
margin-bottom: 5px;
}
.mb8 {
margin-bottom: 8px;
}
.ml5 {
margin-left: 5px;
}
.mt10 {
margin-top: 10px;
}
.mr10 {
margin-right: 10px;
}
.mb10 {
margin-bottom: 10px;
}
.ml0 {
margin-left: 10px;
}
.mt20 {
margin-top: 20px;
}
.mr20 {
margin-right: 20px;
}
.mb20 {
margin-bottom: 20px;
}
.m20 {
margin-left: 20px;
}
.el-dialog:not(.is-fullscreen){
margin-top: 6vh !important;
}
.el-table {
.el-table__header-wrapper, .el-table__fixed-header-wrapper {
th {
word-break: break-word;
background-color: #f8f8f9;
color: #515a6e;
height: 40px;
font-size: 13px;
}
}
.el-table__body-wrapper {
.el-button [class*="el-icon-"] + span {
margin-left: 1px;
}
.pt5 {
padding-top: 5px;
}
.pr5 {
padding-right: 5px;
}
.pb5 {
padding-bottom: 5px;
}
.mt5 {
margin-top: 5px;
}
.mr5 {
margin-right: 5px;
}
.mb5 {
margin-bottom: 5px;
}
.mb8 {
margin-bottom: 8px;
}
.ml5 {
margin-left: 5px;
}
.mt10 {
margin-top: 10px;
}
.mr10 {
margin-right: 10px;
}
.mb10 {
margin-bottom: 10px;
}
.ml0 {
margin-left: 10px;
}
.mt20 {
margin-top: 20px;
}
.mr20 {
margin-right: 20px;
}
.mb20 {
margin-bottom: 20px;
}
.m20 {
margin-left: 20px;
}
.el-dialog:not(.is-fullscreen) {
margin-top: 6vh !important;
}
.el-table {
.el-table__header-wrapper,
.el-table__fixed-header-wrapper {
th {
word-break: break-word;
background-color: #f8f8f9;
color: #515a6e;
height: 40px;
font-size: 13px;
}
}
.el-table__body-wrapper {
.el-button [class*="el-icon-"]+span {
margin-left: 1px;
}
}
}
/** 表单布局 **/
.form-header {
font-size: 15px;
color: #6379bb;
border-bottom: 1px solid #ddd;
margin: 8px 10px 25px 10px;
padding-bottom: 5px
}
/** 表格布局 **/
.pagination-container {
position: relative;
height: 25px;
margin-bottom: 10px;
margin-top: 15px;
padding: 10px 20px !important;
}
/* tree border */
.tree-border {
margin-top: 5px;
border: 1px solid #e5e6e7;
background: #FFFFFF none;
border-radius: 4px;
}
.pagination-container .el-pagination {
right: 0;
position: absolute;
}
.el-table .fixed-width .el-button--mini {
padding-left: 0;
padding-right: 0;
width: inherit;
}
.el-tree-node__content>.el-checkbox {
margin-right: 8px;
}
.list-group-striped>.list-group-item {
border-left: 0;
border-right: 0;
border-radius: 0;
padding-left: 0;
padding-right: 0;
}
.list-group {
padding-left: 0px;
list-style: none;
}
.list-group-item {
border-bottom: 1px solid #e7eaec;
border-top: 1px solid #e7eaec;
margin-bottom: -1px;
padding: 11px 0px;
font-size: 13px;
}
.pull-right {
float: right !important;
}
.el-card__header {
padding: 14px 15px 7px;
min-height: 40px;
}
.el-card__body {
padding: 15px 20px 20px 20px;
}
.card-box {
padding-right: 15px;
padding-left: 15px;
margin-bottom: 10px;
}
/* button color */
.el-button--cyan.is-active,
.el-button--cyan:active {
background: #20B2AA;
border-color: #20B2AA;
color: #FFFFFF;
}
.el-button--cyan:focus,
.el-button--cyan:hover {
background: #48D1CC;
border-color: #48D1CC;
color: #FFFFFF;
}
.el-button--cyan {
background-color: #20B2AA;
border-color: #20B2AA;
color: #FFFFFF;
}
/* text color */
.text-navy {
color: #1ab394;
}
.text-primary {
color: inherit;
}
.text-success {
color: #1c84c6;
}
.text-info {
color: #23c6c8;
}
.text-warning {
color: #f8ac59;
}
.text-danger {
color: #ed5565;
}
.text-muted {
color: #888888;
}
/* image */
.img-circle {
border-radius: 50%;
}
.img-lg {
width: 120px;
height: 120px;
}
.avatar-upload-preview {
position: absolute;
top: 50%;
transform: translate(50%, -50%);
width: 200px;
height: 200px;
border-radius: 50%;
box-shadow: 0 0 4px #ccc;
overflow: hidden;
}
/* 拖拽列样式 */
.sortable-ghost {
opacity: .8;
color: #fff !important;
background: #42b983 !important;
}
.top-right-btn {
position: relative;
float: right;
}
// dialog
.el-dialog {
padding: 0 20px !important;
border-radius: 25px;
}
.el-dialog__headerbtn {
right: 0 !important;
}
.el-dialog__header {
border: 1px solid rgba(222, 222, 222, 0.53);
position: relative;
padding: 15px 0 10px !important;
// &:before {
// content: "";
// width: 16px;
// height: 3px;
// position: absolute;
// background-color: $--color-primary;
// left: 0;
// bottom: -2px;
// }
// &:after {
// content: "";
// width: 16px;
// height: 3px;
// position: absolute;
// background-color: $--color-primary;
// right: 0;
// bottom: -2px;
// }
.el-dialog__title {
font-size: 16px;
color: #333333;
}
}
.el-dialog__body {
padding: 30px 0 !important;
}
.el-table {
& tr:nth-child(2n) {
background: rgba(249, 249, 249, 0.8);
}
&::before{
content: "";
position: absolute;
background-color: #e6ebf5;
z-index: 1;
display: none;
}
}
/** 表单布局 **/
.form-header {
font-size:15px;
color:#6379bb;
border-bottom:1px solid #ddd;
margin:8px 10px 25px 10px;
padding-bottom:5px
}
/** 表格布局 **/
.pagination-container {
position: relative;
height: 25px;
margin-bottom: 10px;
margin-top: 15px;
padding: 10px 20px !important;
}
/* tree border */
.tree-border {
margin-top: 5px;
border: 1px solid #e5e6e7;
background: #FFFFFF none;
border-radius:4px;
}
.pagination-container .el-pagination {
right: 0;
position: absolute;
}
.el-table .fixed-width .el-button--mini {
padding-left: 0;
padding-right: 0;
width: inherit;
}
.el-tree-node__content > .el-checkbox {
margin-right: 8px;
}
.list-group-striped > .list-group-item {
border-left: 0;
border-right: 0;
border-radius: 0;
padding-left: 0;
padding-right: 0;
}
.list-group {
padding-left: 0px;
list-style: none;
}
.list-group-item {
border-bottom: 1px solid #e7eaec;
border-top: 1px solid #e7eaec;
margin-bottom: -1px;
padding: 11px 0px;
font-size: 13px;
}
.pull-right {
float: right !important;
}
.el-card__header {
padding: 14px 15px 7px;
min-height: 40px;
}
.el-card__body {
padding: 15px 20px 20px 20px;
}
.card-box {
padding-right: 15px;
padding-left: 15px;
margin-bottom: 10px;
}
/* button color */
.el-button--cyan.is-active,
.el-button--cyan:active {
background: #20B2AA;
border-color: #20B2AA;
color: #FFFFFF;
}
.el-button--cyan:focus,
.el-button--cyan:hover {
background: #48D1CC;
border-color: #48D1CC;
color: #FFFFFF;
}
.el-button--cyan {
background-color: #20B2AA;
border-color: #20B2AA;
color: #FFFFFF;
}
/* text color */
.text-navy {
color: #1ab394;
}
.text-primary {
color: inherit;
}
.text-success {
color: #1c84c6;
}
.text-info {
color: #23c6c8;
}
.text-warning {
color: #f8ac59;
}
.text-danger {
color: #ed5565;
}
.text-muted {
color: #888888;
}
/* image */
.img-circle {
border-radius: 50%;
}
.img-lg {
width: 120px;
height: 120px;
}
.avatar-upload-preview {
position: absolute;
top: 50%;
transform: translate(50%, -50%);
width: 200px;
height: 200px;
border-radius: 50%;
box-shadow: 0 0 4px #ccc;
overflow: hidden;
}
/* 拖拽列样式 */
.sortable-ghost{
opacity: .8;
color: #fff!important;
background: #42b983!important;
}
.top-right-btn {
position: relative;
float: right;
}
}
.el-table th.el-table__cell.is-leaf,
.el-table td.el-table__cell {
border: none;
}
.flex{
display: flex;
}
\ No newline at end of file
<template>
<div :class="{'hidden':hidden}" class="pagination-container">
<el-pagination
:background="background"
:current-page.sync="currentPage"
:page-size.sync="pageSize"
:layout="layout"
:page-sizes="pageSizes"
:total="total"
v-bind="$attrs"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
<div :class="{ hidden: hidden }" class="pagination-container flex">
<div class="flex">
<div
class="myBtn"
:class="{ active: active===index }"
v-for="item,index in pageSizes"
:key="item"
@click="handleSizeChange(index)"
>
{{ item }}
</div>
</div>
<div>
<el-pagination
:background="background"
:current-page.sync="currentPage"
:page-size.sync="pageSize"
:layout="layout"
:page-sizes="pageSizes"
:total="total"
v-bind="$attrs"
@current-change="handleCurrentChange"
/>
<!-- @size-change="handleSizeChange" -->
</div>
</div>
</template>
<script>
import { scrollTo } from '@/utils/scroll-to'
import { scrollTo } from "@/utils/scroll-to";
export default {
name: 'Pagination',
name: "Pagination",
props: {
total: {
required: true,
type: Number
type: Number,
},
page: {
type: Number,
default: 1
default: 1,
},
limit: {
type: Number,
default: 20
default: 20,
},
pageSizes: {
type: Array,
default() {
return [10, 20, 30, 50]
}
return [10, 20, 30, 50];
},
},
layout: {
type: String,
default: 'total, sizes, prev, pager, next, jumper'
// default: 'total, sizes, prev, pager, next, jumper'
default: "prev, pager, next",
},
background: {
type: Boolean,
default: true
default: false,
},
autoScroll: {
type: Boolean,
default: true
default: true,
},
hidden: {
type: Boolean,
default: false
}
default: false,
},
},
data() {
return {active:0};
},
computed: {
currentPage: {
get() {
return this.page
return this.page;
},
set(val) {
this.$emit('update:page', val)
}
this.$emit("update:page", val);
},
},
pageSize: {
get() {
return this.limit
return this.limit;
},
set(val) {
this.$emit('update:limit', val)
}
}
this.$emit("update:limit", val);
},
},
},
methods: {
handleSizeChange(val) {
this.$emit('pagination', { page: this.currentPage, limit: val })
this.active =val;
this.$emit("pagination", { page: this.currentPage, limit: this.pageSizes[val] });
if (this.autoScroll) {
scrollTo(0, 800)
scrollTo(0, 800);
}
},
handleCurrentChange(val) {
this.$emit('pagination', { page: val, limit: this.pageSize })
this.$emit("pagination", { page: val, limit: this.pageSizes[active] });
if (this.autoScroll) {
scrollTo(0, 800)
scrollTo(0, 800);
}
}
}
}
},
},
};
</script>
<style scoped>
<style lang="scss" scoped>
.pagination-container {
background: #fff;
padding: 32px 16px;
padding: 10px 0px !important;
justify-content: space-between;
}
.pagination-container.hidden {
display: none;
}
.myBtn {
width: 42px;
height: 29px;
border-radius: 8px;
color: #727a84;
text-align: center;
line-height: 29px;
font-size: 14px;
margin-right: 10px;
cursor: pointer;
&:hover{
background: rgba(0, 122, 255,.5)
}
&.active {
background: #007aff;
color:#fff
}
}
</style>
<template>
<div>
<el-table v-loading="loading" :data="projectList">
<el-table-column label="交易项目" align="center" prop="relationTransactionProjectId" :formatter="transactionProjectName" :show-overflow-tooltip="true"/>
<el-table-column label="交易状态" align="center" prop="tradeStatus" :formatter="getTradeStatus" :show-overflow-tooltip="true"/>
<el-table-column label="申请人" align="center" prop="applyName" />
<el-table-column label="卖方" align="center" prop="applyDeptName" :show-overflow-tooltip="true"/>
<el-table-column label="申报总价" align="center" prop="tradeTotal" />
<el-table-column label="买方" align="center" prop="tradeDeptName" :show-overflow-tooltip="true"/>
<el-table-column label="交易评分" align="center" prop="tradeScore" />
<el-table-column label="交易成交价" align="center" prop="dealPrice" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
v-if="scope.row.tradeStatus=='0' || scope.row.tradeStatus=='4'"
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:project:edit']"
>修改</el-button>
<el-button
v-if="scope.row.tradeStatus=='0' || scope.row.tradeStatus=='4'"
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:project:remove']"
>删除</el-button>
<OperatorButton v-for="item in scope.row.operators"
:operatorName="item"
:tradeInfo="scope.row"
@getList="getList"/>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
<div>
<el-table v-loading="loading" :data="projectList">
<el-table-column
label="交易项目"
align="center"
prop="relationTransactionProjectId"
:formatter="transactionProjectName"
:show-overflow-tooltip="true"
/>
</div>
<el-table-column
label="交易状态"
align="center"
prop="tradeStatus"
:formatter="getTradeStatus"
:show-overflow-tooltip="true"
/>
<el-table-column label="申请人" align="center" prop="applyName" />
<el-table-column
label="卖方"
align="center"
prop="applyDeptName"
:show-overflow-tooltip="true"
/>
<el-table-column label="申报总价" align="center" prop="tradeTotal" />
<el-table-column
label="买方"
align="center"
prop="tradeDeptName"
:show-overflow-tooltip="true"
/>
<el-table-column label="交易评分" align="center" prop="tradeScore" />
<el-table-column label="交易成交价" align="center" prop="dealPrice" />
<el-table-column
label="操作"
align="center"
class-name="small-padding fixed-width"
>
<template slot-scope="scope">
<el-button
v-if="scope.row.tradeStatus == '0' || scope.row.tradeStatus == '4'"
size="mini"
type="text"
icon="el-icon-edit"
@click="handleUpdate(scope.row)"
v-hasPermi="['system:project:edit']"
>修改</el-button
>
<el-button
v-if="scope.row.tradeStatus == '0' || scope.row.tradeStatus == '4'"
size="mini"
type="text"
icon="el-icon-delete"
@click="handleDelete(scope.row)"
v-hasPermi="['system:project:remove']"
>删除</el-button
>
<OperatorButton
v-for="item in scope.row.operators"
:key="item"
:operatorName="item"
:tradeInfo="scope.row"
@getList="getList"
/>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total > 0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script>
import OperatorButton from "./OperatorButton";
export default {
name: "table-list",
props:{
projectList:{
type: Array
},
queryParams:{
type: Object
},
total:{
type: Number
},
loading:{
type: Boolean
}
import OperatorButton from "./OperatorButton";
export default {
name: "table-list",
props: {
projectList: {
type: Array,
},
queryParams: {
type: Object,
},
total: {
type: Number,
},
components:{
OperatorButton
loading: {
type: Boolean,
},
methods:{
getList(){
this.$emit("getList");
},
//获取项目名称
transactionProjectName(row){
let project = this.$parent.$parent.transactionProjects.find(item => item.transactionProjectId == row.relationTransactionProjectId);
if(project){
return project.transactionProjectName;
}
return "-";
},
//获取交易状态
getTradeStatus(row){
return this.selectDictLabel(this.$parent.$parent.transactionProjectStatus, row.tradeStatus);
},
handleUpdate(row){
this.$parent.$parent.handleUpdate(row);
},
handleDelete(row){
this.$parent.$parent.handleDelete(row);
},
components: {
OperatorButton,
},
methods: {
getList(value) {
console.log(value)
this.$emit("getList",value);
},
//获取项目名称
transactionProjectName(row) {
let project = this.$parent.$parent.transactionProjects.find(
(item) => item.transactionProjectId == row.relationTransactionProjectId
);
if (project) {
return project.transactionProjectName;
}
}
}
return "-";
},
//获取交易状态
getTradeStatus(row) {
return this.selectDictLabel(
this.$parent.$parent.transactionProjectStatus,
row.tradeStatus
);
},
handleUpdate(row) {
this.$parent.$parent.handleUpdate(row);
},
handleDelete(row) {
this.$parent.$parent.handleDelete(row);
},
},
};
</script>
<style scoped>
</style>
<style scoped></style>
<template>
<div class="app-container">
<el-form :model="queryParams" size="mini" ref="queryForm" :inline="true" v-show="showSearch" label-width="100px">
<el-form
:model="queryParams"
size="mini"
ref="queryForm"
:inline="true"
v-show="showSearch"
label-width="100px"
>
<el-form-item label="交易项目" prop="relationTransactionProjectId">
<el-select v-model="queryParams.relationTransactionProjectId" placeholder="请选择交易项目">
<el-option v-for="item in transactionProjects"
:key="item.transactionProjectId"
:label="item.transactionProjectName"
:value="item.transactionProjectId"/>
<el-select
v-model="queryParams.relationTransactionProjectId"
placeholder="请选择交易项目"
>
<el-option
v-for="item in transactionProjects"
:key="item.transactionProjectId"
:label="item.transactionProjectName"
:value="item.transactionProjectId"
/>
</el-select>
</el-form-item>
<el-form-item label="项目状态" prop="tradeStatus">
<el-select v-model="queryParams.tradeStatus" placeholder="请选择项目状态" clearable size="small">
<el-option v-for="item in transactionProjectStatus"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
<el-select
v-model="queryParams.tradeStatus"
placeholder="请选择项目状态"
clearable
size="small"
>
<el-option
v-for="item in transactionProjectStatus"
:key="item.dictValue"
:label="item.dictLabel"
:value="item.dictValue"
/>
</el-select>
</el-form-item>
<el-form-item label="卖方部门" prop="applyDeptId">
<div style="width: 160px">
<treeselect v-model="queryParams.applyDeptId" :options="deptOptions" :show-count="true" placeholder="请选择卖方部门" />
<treeselect
v-model="queryParams.applyDeptId"
:options="deptOptions"
:show-count="true"
placeholder="请选择卖方部门"
/>
</div>
</el-form-item>
<el-form-item label="买方部门" prop="tradeDeptId">
<div style="width: 160px">
<treeselect v-model="queryParams.tradeDeptId" :options="deptOptions" :show-count="true" placeholder="请选择买方部门" />
<treeselect
v-model="queryParams.tradeDeptId"
:options="deptOptions"
:show-count="true"
placeholder="请选择买方部门"
/>
</div>
</el-form-item>
......@@ -35,13 +63,22 @@
<el-date-picker
v-model="queryParams.createTime"
type="datetime"
placeholder="选择日期">
placeholder="选择日期"
>
</el-date-picker>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
<el-button
type="primary"
icon="el-icon-search"
size="mini"
@click="handleQuery"
>搜索</el-button
>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
>重置</el-button
>
</el-form-item>
</el-form>
......@@ -96,96 +133,146 @@
<div class="outer-div">
<header class="header">
<ul class="tab-tilte">
<li :class="{ active: tab == 0 }" @click="changeTab(0)">所有项目</li>
<li :class="{ active: tab == 1 }" @click="changeTab(1)">我申请的</li>
<li :class="{ active: tab == 2 }" @click="changeTab(2)">我审批的</li>
<li :class="{ active: tab == 0 }" @click="changeTab(0)">
所有项目
</li>
<li :class="{ active: tab == 1 }" @click="changeTab(1)">
我申请的
</li>
<li :class="{ active: tab == 2 }" @click="changeTab(2)">
我审批的
</li>
</ul>
<el-button
@click="handleAdd"
v-hasPermi="['system:project:add']"
class="applyService"
>申请服务</el-button>
>申请服务</el-button
>
</header>
<div class="tab-content">
<!-- 可以使用自定义组件 -->
<!-- <component-one v-show="tab == 0"></component-one>
<component-two v-show="tab == 1"></component-two> -->
<div v-if="tab == 0">
<TableList :queryParams="queryParams"
:projectList="projectList"
:total="total"
:loading="loading"
@getList="getList"/>
<div v-if="tab == 0" :key="tab">
<TableList
:queryParams="queryParams"
:projectList="projectList"
:total="total"
:loading="loading"
@getList="getList"
/>
</div>
<div v-if="tab == 1">
<TableList :queryParams="queryParams"
:projectList="projectList"
:total="total"
:loading="loading"
@getList="getList"/>
<div v-if="tab == 1" :key="tab">
<TableList
:queryParams="queryParams"
:projectList="projectList"
:total="total"
:loading="loading"
@getList="getList"
/>
</div>
<div v-if="tab == 2">
<TableList :queryParams="queryParams"
:projectList="projectList"
:total="total"
:loading="loading"
@getList="getList"/>
<div v-if="tab == 2" :key="tab">
<TableList
:queryParams="queryParams"
:projectList="projectList"
:total="total"
:loading="loading"
@getList="getList"
/>
</div>
</div>
</div>
</el-card>
<!-- 添加或修改交易项目对话框 -->
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body :close-on-click-modal="false" destroy-on-close>
<el-dialog
:title="title"
:visible.sync="open"
width="800px"
append-to-body
:close-on-click-modal="false"
destroy-on-close
>
<el-form ref="form" :model="form" :rules="rules" label-width="100px">
<el-row>
<el-col :span="12">
<el-form-item label="买方" prop="tradeDeptId">
<treeselect v-model="form.tradeDeptId" :options="deptOptions" :show-count="true" placeholder="请选择部门"/>
<treeselect
v-model="form.tradeDeptId"
:options="deptOptions"
:show-count="true"
placeholder="请选择部门"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="交易项目" prop="relationTransactionProjectId">
<el-select v-model="form.relationTransactionProjectId" placeholder="请选择交易项目" style="width: 100%" @change="changeTransactionProject">
<el-option v-for="item in transactionOptions"
:key="item.transactionProjectId"
:label="item.transactionProjectName"
:value="item.transactionProjectId"/>
<el-select
v-model="form.relationTransactionProjectId"
placeholder="请选择交易项目"
style="width: 100%"
@change="changeTransactionProject"
>
<el-option
v-for="item in transactionOptions"
:key="item.transactionProjectId"
:label="item.transactionProjectName"
:value="item.transactionProjectId"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="买方经办人" prop="tradeTransactor">
<el-select v-model="form.tradeTransactor" placeholder="请选择买方经办人" style="width: 100%">
<el-option v-for="item in transactorList"
:key="item.userId"
:label="item.nickName"
:value="item.userId"/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="单价" prop="tradePrice">
<el-input v-model="form.tradePrice" placeholder="请输入单价" :disabled="priceType == '1'" @blur="sumAmount"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="买方经办人" prop="tradeTransactor">
<el-select
v-model="form.tradeTransactor"
placeholder="请选择买方经办人"
style="width: 100%"
>
<el-option
v-for="item in transactorList"
:key="item.userId"
:label="item.nickName"
:value="item.userId"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="单价" prop="tradePrice">
<el-input
v-model="form.tradePrice"
placeholder="请输入单价"
:disabled="priceType == '1'"
@blur="sumAmount"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="数量" prop="tradeCount">
<el-input v-model="form.tradeCount" placeholder="请输入交易数量" @blur="sumAmount"/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="总价" prop="tradeTotal">
<el-input v-model="form.tradeTotal" placeholder="请输入交易总价" />
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="12">
<el-form-item label="数量" prop="tradeCount">
<el-input
v-model="form.tradeCount"
placeholder="请输入交易数量"
@blur="sumAmount"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="总价" prop="tradeTotal">
<el-input
v-model="form.tradeTotal"
placeholder="请输入交易总价"
/>
</el-form-item>
</el-col>
</el-row>
<el-form-item label="附件" prop="attachmentUrl">
<FileUpload
listType="picture"
......@@ -193,20 +280,49 @@
@remove="listRemove"
:fileArr="fileList"
:fileSize="500"
:fileType="['png', 'jpg', 'jpeg','mp4','doc', 'xls', 'ppt', 'txt','pdf']"/>
<el-input v-show="false" disabled v-model="form.attachmentUrl"></el-input>
:fileType="[
'png',
'jpg',
'jpeg',
'mp4',
'doc',
'xls',
'ppt',
'txt',
'pdf',
]"
/>
<el-input
v-show="false"
disabled
v-model="form.attachmentUrl"
></el-input>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer" style="text-align: center">
<el-button style="width: 150px;border-color: #1890ff;color: #1890ff;" @click="reset">内容重置</el-button>
<el-button type="primary" style="width: 150px" @click="submitForm">提交申请</el-button>
<el-button
style="width: 150px; border-color: #1890ff; color: #1890ff"
@click="reset"
>内容重置</el-button
>
<el-button type="primary" style="width: 150px" @click="submitForm"
>提交申请</el-button
>
</div>
</el-dialog>
</div>
</template>
<script>
import { selectTTradeProjectListByRoles, listProject, getProject, delProject, addProject, updateProject, exportProject } from "@/api/transaction/tradeProject.js";
import {
selectTTradeProjectListByRoles,
listProject,
getProject,
delProject,
addProject,
updateProject,
exportProject,
} from "@/api/transaction/tradeProject.js";
import { getTransactionProjectList } from "@/api/transaction/project.js";
import { treeselect } from "@/api/system/dept";
import { selectTransactorByDeptId } from "@/api/system/user";
......@@ -220,7 +336,7 @@ export default {
components: {
Treeselect,
FileUpload,
TableList
TableList,
},
data() {
return {
......@@ -260,23 +376,23 @@ export default {
form: {},
// 表单校验
rules: {
relationTransactionProjectId:[
{ required: true, message: "交易项目名称不能为空", trigger: "blur" }
],
tradeDeptId:[
{ required: true, message: "请选择买方部门", trigger: "change" }
relationTransactionProjectId: [
{ required: true, message: "交易项目名称不能为空", trigger: "blur" },
],
tradeDeptId: [
{ required: true, message: "请选择买方部门", trigger: "change" },
],
tradeTransactor:[
{ required: true, message: "请选择买方经办人", trigger: "change" }
tradeTransactor: [
{ required: true, message: "请选择买方经办人", trigger: "change" },
],
tradePrice:[
{ required: true, message: "单价不能为空", trigger: "blur" }
tradePrice: [
{ required: true, message: "单价不能为空", trigger: "blur" },
],
tradeCount:[
{ required: true, message: "数量不能为空", trigger: "blur" }
tradeCount: [
{ required: true, message: "数量不能为空", trigger: "blur" },
],
tradeTotal:[
{ required: true, message: "总价不能为空", trigger: "blur" }
tradeTotal: [
{ required: true, message: "总价不能为空", trigger: "blur" },
],
},
transactionProjects: [],
......@@ -284,33 +400,36 @@ export default {
priceType: "",
fileList: [],
transactionProjectStatus: [],
tab:"0",
tab: "0",
transactionOptions: [],
transactorList: []
transactorList: [],
};
},
created() {
this.getList();
this.getTransactionProjects();
this.getTreeselect();
this.getDicts("t_transaction_project_status").then(response => {
this.getDicts("t_transaction_project_status").then((response) => {
this.transactionProjectStatus = response.data;
});
},
watch:{
"form.tradeDeptId":{
handler(newValue, oldValue){
watch: {
"form.tradeDeptId": {
handler(newValue, oldValue) {
this.changeDept();
this.getTransactor();
},
deep:true
}
deep: true,
},
},
methods: {
/** 查询交易项目列表 */
getList() {
getList(value) {
this.loading = true;
selectTTradeProjectListByRoles(this.queryParams).then(response => {
selectTTradeProjectListByRoles({
...this.queryParams,
pageSize: value?.limit ? value.limit : this.queryParams.pageSize,
}).then((response) => {
this.projectList = response.rows;
this.total = response.total;
this.loading = false;
......@@ -346,7 +465,7 @@ export default {
createTime: null,
updateTime: null,
isDel: null,
remark: null
remark: null,
};
this.resetForm("form");
this.fileList = [];
......@@ -363,9 +482,9 @@ export default {
},
// 多选框选中数据
handleSelectionChange(selection) {
this.ids = selection.map(item => item.tradeId)
this.single = selection.length!==1
this.multiple = !selection.length
this.ids = selection.map((item) => item.tradeId);
this.single = selection.length !== 1;
this.multiple = !selection.length;
},
/** 新增按钮操作 */
handleAdd() {
......@@ -376,8 +495,8 @@ export default {
/** 修改按钮操作 */
handleUpdate(row) {
this.reset();
const tradeId = row.tradeId || this.ids
getProject(tradeId).then(response => {
const tradeId = row.tradeId || this.ids;
getProject(tradeId).then((response) => {
this.form = response.data;
this.open = true;
this.title = "修改交易项目";
......@@ -385,16 +504,16 @@ export default {
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
this.$refs["form"].validate((valid) => {
if (valid) {
if (this.form.tradeId != null) {
updateProject(this.form).then(response => {
updateProject(this.form).then((response) => {
this.msgSuccess("修改成功");
this.open = false;
this.getList();
});
} else {
addProject(this.form).then(response => {
addProject(this.form).then((response) => {
this.msgSuccess("新增成功");
this.open = false;
this.getList();
......@@ -406,71 +525,95 @@ export default {
/** 删除按钮操作 */
handleDelete(row) {
const tradeIds = row.tradeId || this.ids;
this.$confirm('是否确认删除交易项目编号为"' + tradeIds + '"的数据项?', "警告", {
this.$confirm(
'是否确认删除交易项目编号为"' + tradeIds + '"的数据项?',
"警告",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(function() {
type: "warning",
}
)
.then(function () {
return delProject(tradeIds);
}).then(() => {
})
.then(() => {
this.getList();
this.msgSuccess("删除成功");
}).catch(() => {});
})
.catch(() => {});
},
/** 导出按钮操作 */
handleExport() {
const queryParams = this.queryParams;
this.$confirm('是否确认导出所有交易项目数据项?', "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.$confirm("是否确认导出所有交易项目数据项?", "警告", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning",
})
.then(() => {
this.exportLoading = true;
return exportProject(queryParams);
}).then(response => {
})
.then((response) => {
this.download(response.msg);
this.exportLoading = false;
}).catch(() => {});
})
.catch(() => {});
},
//获取项目列表
getTransactionProjects(query){
getTransactionProjectList(query).then(res =>{
if(res.code == 200){
getTransactionProjects(query) {
getTransactionProjectList(query).then((res) => {
if (res.code == 200) {
this.transactionProjects = res.data;
}
})
});
},
/** 查询部门下拉树结构 */
getTreeselect() {
treeselect().then(response => {
this.deptOptions = response.data;
treeselect().then((response) => {
this.deptOptions = response.data;
});
},
changeTransactionProject(val){
let transactionProject = this.transactionProjects.find(item => item.transactionProjectId == val);
if(transactionProject.priceType == '1'){
this.priceType = '1';
changeTransactionProject(val) {
let transactionProject = this.transactionProjects.find(
(item) => item.transactionProjectId == val
);
if (transactionProject.priceType == "1") {
this.priceType = "1";
this.form.tradePrice = transactionProject.price;
}else{
} else {
this.priceType = transactionProject.priceType;
this.form.tradePrice = "";
}
this.sumAmount();
},
//计算总价
sumAmount(){
if(this.form.tradePrice && this.form.tradeCount){
this.form.tradeTotal = this.accMul(this.form.tradePrice,this.form.tradeCount);
}else{
sumAmount() {
if (this.form.tradePrice && this.form.tradeCount) {
this.form.tradeTotal = this.accMul(
this.form.tradePrice,
this.form.tradeCount
);
} else {
this.form.tradeTotal = "";
}
},
//浮点计算出现无限小数
accMul(arg1,arg2){
var m=0,s1=arg1.toString(),s2=arg2.toString();
try{m+=s1.split(".")[1].length}catch(e){}
try{m+=s2.split(".")[1].length}catch(e){}
return Number(s1.replace(".",""))*Number(s2.replace(".",""))/Math.pow(10,m)
accMul(arg1, arg2) {
var m = 0,
s1 = arg1.toString(),
s2 = arg2.toString();
try {
m += s1.split(".")[1].length;
} catch (e) {}
try {
m += s2.split(".")[1].length;
} catch (e) {}
return (
(Number(s1.replace(".", "")) * Number(s2.replace(".", ""))) /
Math.pow(10, m)
);
},
getFileInfo(res) {
this.form.attachmentUrl = res.url;
......@@ -486,79 +629,83 @@ export default {
this.form.attachmentUrl = "";
},
//切换tab
changeTab(tabNum){
changeTab(tabNum) {
this.queryParams.pageNum = 1;
this.queryParams.pageSize = 10;
this.tab = tabNum;
if(tabNum == 0){
if (tabNum == 0) {
this.queryParams.queryType = "all";
}
if(tabNum == 1){
if (tabNum == 1) {
this.queryParams.queryType = "myApply";
}
if(tabNum == 2){
if (tabNum == 2) {
this.queryParams.queryType = "myApproval";
}
this.getList();
},
changeDept(){
this.transactionOptions = this.transactionProjects.filter(item => item.deptId == this.form.tradeDeptId);
changeDept() {
this.transactionOptions = this.transactionProjects.filter(
(item) => item.deptId == this.form.tradeDeptId
);
this.relationTransactionProjectId = null;
},
getTransactor(){
getTransactor() {
this.form.tradeTransactor = null;
if(this.form.tradeDeptId && this.form.tradeDeptId != null){
selectTransactorByDeptId({deptId:this.form.tradeDeptId}).then(res => {
if (this.form.tradeDeptId && this.form.tradeDeptId != null) {
selectTransactorByDeptId({ deptId: this.form.tradeDeptId }).then(
(res) => {
this.transactorList = res.data;
});
}
);
}
}
}
},
},
};
</script>
<style scoped lang="scss">
.outer-div {
//padding: 24px;
margin: 0 auto;
}
.header {
height: 47px;
width: 100%;
//border-bottom: 1px solid #ebebeb;
//margin-bottom: 24px;
}
ul li {
margin: 0;
padding: 0;
list-style: none;
}
.tab-tilte {
font-family: PingFangSC-Semibold;
letter-spacing: 0;
width: 90%;
padding-left: 0;
}
.tab-tilte li {
float: left;
font-size: 16px;
color: #999999;
// line-height: 53px;
text-align: center;
margin-right: 30px;
cursor: pointer;
}
/* 点击对应的标题添加对应的背景颜色 */
.tab-tilte .active {
color: #3385ff;
// border-bottom: 2px solid #3385ff;
}
.outer-div {
//padding: 24px;
margin: 0 auto;
}
.header {
height: 47px;
width: 100%;
//border-bottom: 1px solid #ebebeb;
//margin-bottom: 24px;
}
ul li {
margin: 0;
padding: 0;
list-style: none;
}
.tab-tilte {
font-family: PingFangSC-Semibold;
letter-spacing: 0;
width: 90%;
padding-left: 0;
}
.tab-tilte li {
float: left;
font-size: 16px;
color: #999999;
// line-height: 53px;
text-align: center;
margin-right: 30px;
cursor: pointer;
}
/* 点击对应的标题添加对应的背景颜色 */
.tab-tilte .active {
color: #3385ff;
// border-bottom: 2px solid #3385ff;
}
.applyService{
float: right;
width: 124px;
border-radius: 18px;
color: white;
background: #1890ff;
}
.applyService {
float: right;
width: 124px;
border-radius: 18px;
color: white;
background: #1890ff;
}
</style>
......@@ -34,7 +34,7 @@ module.exports = {
proxy: {
// detail: https://cli.vuejs.org/config/#devserver-proxy
[process.env.VUE_APP_BASE_API]: {
target: `http://localhost:8668/precisionEffect`,
target: `http://192.168.1.5:8668/precisionEffect`,
changeOrigin: true,
pathRewrite: {
['^' + process.env.VUE_APP_BASE_API]: ''
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment