新增项目添加
parent
21e4683f41
commit
2fcae8c82f
|
|
@ -0,0 +1,4 @@
|
||||||
|
import axios from 'axios'
|
||||||
|
import qs from 'qs'
|
||||||
|
|
||||||
|
export const projectAdd = query => axios.post('http://oa-dxtc.test/project/add', qs.stringify(query));
|
||||||
|
|
@ -36,6 +36,14 @@ const routes = [
|
||||||
},
|
},
|
||||||
component: () => import( '../views/Source.vue' )
|
component: () => import( '../views/Source.vue' )
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/project',
|
||||||
|
name: 'project',
|
||||||
|
meta: {
|
||||||
|
title: '项目'
|
||||||
|
},
|
||||||
|
component: () => import( '../views/Project.vue' )
|
||||||
|
},
|
||||||
//{
|
//{
|
||||||
// path: "/charts",
|
// path: "/charts",
|
||||||
// name: "basecharts",
|
// name: "basecharts",
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,203 @@
|
||||||
|
<template>
|
||||||
|
<div>
|
||||||
|
<div class="crumbs">
|
||||||
|
<el-breadcrumb separator="/">
|
||||||
|
<el-breadcrumb-item>
|
||||||
|
<i class="el-icon-lx-cascades"></i> 项目列表
|
||||||
|
</el-breadcrumb-item>
|
||||||
|
<el-button size="small" type="primary" @click="handleAdd()">
|
||||||
|
<el-icon size="small"><plus /></el-icon>
|
||||||
|
</el-button>
|
||||||
|
</el-breadcrumb>
|
||||||
|
</div>
|
||||||
|
<div class="container">
|
||||||
|
<el-table :data="tableData" border class="table" ref="multipleTable" header-cell-class-name="table-header">
|
||||||
|
<el-table-column prop="id" label="ID" width="55" align="center"></el-table-column>
|
||||||
|
<el-table-column prop="name" label="名称"></el-table-column>
|
||||||
|
<el-table-column label="操作" width="180" align="center">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button type="text" @click="handleEdit(scope.$index, scope.row)">
|
||||||
|
<el-icon><edit-pen /></el-icon>
|
||||||
|
编辑
|
||||||
|
</el-button>
|
||||||
|
<el-button type="text" class="red" @click="handleDelete(scope.$index, scope.row)">
|
||||||
|
<el-icon><delete /></el-icon>
|
||||||
|
删除
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
</el-table>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 添加弹出框 -->
|
||||||
|
<el-dialog title="新增" v-model="addVisible" width="40%">
|
||||||
|
<el-form :model="addForm" ref="tableAddData" label-width="120px" :rules="rules">
|
||||||
|
<el-form-item label="项目名称" prop="name">
|
||||||
|
<el-input v-model="addForm.name"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="客户" prop="customer_id">
|
||||||
|
<el-select v-model="addForm.customer_id" class="m-2" placeholder="客户" size="small" name="customer_id">
|
||||||
|
<el-option
|
||||||
|
v-for="item in customerListData"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.id"
|
||||||
|
:label="item.name"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="项目对接人" prop="user_id">
|
||||||
|
<el-select v-model="addForm.user_id" class="m-2" placeholder="项目对接人" size="small" name="user_id">
|
||||||
|
<el-option
|
||||||
|
v-for="item in userListData"
|
||||||
|
:key="item.id"
|
||||||
|
:value="item.id"
|
||||||
|
:label="item.name"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="合同日期">
|
||||||
|
<el-col :span="11">
|
||||||
|
<el-form-item prop="contract_signing_date">
|
||||||
|
<el-date-picker type="date" placeholder="合同签订日期" v-model="addForm.contract_signing_date" format="YYYY-MM-DD" value-format="YYYY-MM-DD" style="width: 100%;"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col class="line" :span="2">-</el-col>
|
||||||
|
<el-col :span="11">
|
||||||
|
<el-form-item prop="contract_end_date">
|
||||||
|
<el-date-picker type="date" placeholder="合同约定项目结束日期" v-model="addForm.contract_end_date" style="width: 100%;" format="YYYY-MM-DD" value-format="YYYY-MM-DD"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="项目工期" prop="contract_construction_period">
|
||||||
|
<el-input-number v-model="addForm.contract_construction_period" :min="1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="预估日期">
|
||||||
|
<el-col :span="11">
|
||||||
|
<el-form-item prop="estimated_start_date">
|
||||||
|
<el-date-picker type="date" placeholder="预估开始日期" v-model="addForm.estimated_start_date" style="width: 100%;" format="YYYY-MM-DD" value-format="YYYY-MM-DD"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col class="line" :span="2">-</el-col>
|
||||||
|
<el-col :span="11">
|
||||||
|
<el-form-item prop="estimated_end_date">
|
||||||
|
<el-date-picker type="date" placeholder="预估结束日期" v-model="addForm.estimated_end_date" style="width: 100%;" format="YYYY-MM-DD" value-format="YYYY-MM-DD"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="预估工期" prop="estimated_construction_period">
|
||||||
|
<el-input-number v-model="addForm.estimated_construction_period" :min="1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="实际日期">
|
||||||
|
<el-col :span="11">
|
||||||
|
<el-form-item prop="start_date">
|
||||||
|
<el-date-picker type="date" placeholder="实际开始日期" v-model="addForm.start_date" style="width: 100%;" format="YYYY-MM-DD" value-format="YYYY-MM-DD"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
<el-col class="line" :span="2">-</el-col>
|
||||||
|
<el-col :span="11">
|
||||||
|
<el-form-item prop="end_date">
|
||||||
|
<el-date-picker type="date" placeholder="实际结束日期" v-model="addForm.end_date" style="width: 100%;" format="YYYY-MM-DD" value-format="YYYY-MM-DD"></el-date-picker>
|
||||||
|
</el-form-item>
|
||||||
|
</el-col>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="实际工期" prop="construction_period">
|
||||||
|
<el-input-number v-model="addForm.construction_period" :min="1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="项目金额" prop="amount">
|
||||||
|
<el-input-number v-model="addForm.amount" :precision="2" :step="0.1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="已回款金额" prop="received">
|
||||||
|
<el-input-number v-model="addForm.received" :precision="2" :step="0.1" />
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="待回款金额" prop="pending">
|
||||||
|
<el-input-number v-model="addForm.pending" :precision="2" :step="0.1" />
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<template #footer>
|
||||||
|
<span class="dialog-footer">
|
||||||
|
<el-button @click="addVisible = false">取 消</el-button>
|
||||||
|
<el-button type="primary" @click="saveAdd">确 定</el-button>
|
||||||
|
</span>
|
||||||
|
</template>
|
||||||
|
</el-dialog>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
<script lang="ts">
|
||||||
|
import { reactive, ref } from 'vue';
|
||||||
|
import { ElMessage } from "element-plus";
|
||||||
|
import { projectAdd } from "../api/projectAdd";
|
||||||
|
|
||||||
|
export default{
|
||||||
|
setup() {
|
||||||
|
const tableData = ref([]);
|
||||||
|
const customerListData = ref([]);
|
||||||
|
const userListData = ref([]);
|
||||||
|
const rules = reactive({
|
||||||
|
name: [
|
||||||
|
{ required: true, message: "请输入项目名称", trigger: "blur"},
|
||||||
|
],
|
||||||
|
customer_id: [
|
||||||
|
{ required: true, message: "请选择客户", trigger: "blur" },
|
||||||
|
],
|
||||||
|
user_id:[
|
||||||
|
{ required: true, message: "请选负责人", trigger: "blur" },
|
||||||
|
]
|
||||||
|
});
|
||||||
|
|
||||||
|
//新增
|
||||||
|
const addVisible = ref(false);
|
||||||
|
const tableAddData = ref(null);
|
||||||
|
const addForm = reactive({
|
||||||
|
name:'',
|
||||||
|
customer_id: 0,
|
||||||
|
user_id: 0,
|
||||||
|
contract_signing_date:'',
|
||||||
|
contract_end_date:'',
|
||||||
|
contract_construction_period: 0,
|
||||||
|
estimated_start_date:'',
|
||||||
|
estimated_end_date:'',
|
||||||
|
estimated_construction_period:0,
|
||||||
|
start_date:'',
|
||||||
|
end_date:'',
|
||||||
|
construction_period:0,
|
||||||
|
amount:0,
|
||||||
|
received:0,
|
||||||
|
pending:0
|
||||||
|
});
|
||||||
|
const handleAdd = () => {
|
||||||
|
addVisible.value = true;
|
||||||
|
};
|
||||||
|
const saveAdd = () => {
|
||||||
|
tableAddData.value.validate((valid) => {
|
||||||
|
if(!valid){
|
||||||
|
ElMessage.error('验证失败');
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
projectAdd(addForm).then((res) => {
|
||||||
|
if(res.data.code == 0){
|
||||||
|
ElMessage.success("添加成功");
|
||||||
|
addVisible.value = false;
|
||||||
|
}else{
|
||||||
|
ElMessage.error(res.data.msg);
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
};
|
||||||
|
return {
|
||||||
|
tableData,
|
||||||
|
customerListData,
|
||||||
|
userListData,
|
||||||
|
rules,
|
||||||
|
addVisible,
|
||||||
|
tableAddData,
|
||||||
|
addForm,
|
||||||
|
handleAdd,
|
||||||
|
saveAdd,
|
||||||
|
projectAdd,
|
||||||
|
ElMessage
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</script>
|
||||||
Loading…
Reference in New Issue