<!DOCTYPE html>
|
<html lang="en">
|
<head>
|
<meta charset="UTF-8">
|
<title>周计划</title>
|
<link rel="stylesheet" href="../../static/layui/css/layui.css" media="all">
|
<link rel="stylesheet" href="../../static/css/admin.css?v=318" media="all">
|
<link rel="stylesheet" href="../../static/css/cool.css" media="all">
|
<link rel="stylesheet" href="../../static/css/element.css">
|
<script type="text/javascript" src="../../static/js/jquery/jquery-3.3.1.min.js"></script>
|
<script type="text/javascript" src="../../static/layui/layui.js"></script>
|
<script type="text/javascript" src="../../static/js/handlebars/handlebars-v4.5.3.js"></script>
|
<script type="text/javascript" src="../../static/js/common.js"></script>
|
<script type="text/javascript" src="../../static/js/vue.min.js"></script>
|
<script type="text/javascript" src="../../static/js/element.js"></script>
|
</head>
|
<body>
|
<div id="app">
|
<div>
|
<el-dialog title="周计划" :visible.sync="dialogFormVisible" style="width: 1800px">
|
<el-form :model="form" style="width: 100%">
|
<el-form-item label="日期" :label-width="formLabelWidth">
|
<el-select v-model="form.name">
|
<el-option
|
v-for="item in addWeekPlanDataWeeklySign"
|
:key="item.value"
|
:label="item.label"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="周计划" :label-width="formLabelWidth">
|
<el-button type="primary" @click="addWeekPlan">添加日计划</el-button>
|
<el-table
|
:data="weeklyFormData"
|
border
|
style="width: 100%">
|
<el-table-column
|
fixed
|
:data="addWeekPlanData"
|
prop="weeklyDay"
|
label="星期"
|
width="150">
|
</el-table-column>
|
<el-table-column
|
prop="cstmrId"
|
label="甲方单位"
|
width="180">
|
<div class="item" slot-scope="scope">
|
<el-select v-model="scope.row.cstmrId" placeholder="甲方单位">
|
<el-option
|
v-for="item in options"
|
:key="item.value"
|
:label="item.name"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</div>
|
</el-table-column>
|
<el-table-column
|
prop="workContent"
|
label="工作内容及目的"
|
width="180">
|
<div class="item" slot-scope="scope">
|
<el-input v-model="scope.row.workContent" placeholder="工作内容及目的"></el-input>
|
</div>
|
</el-table-column>
|
<el-table-column
|
prop="weeklyMatter"
|
label="需协助事项"
|
width="120">
|
<div class="item" slot-scope="scope">
|
<el-input v-model="scope.row.weeklyMatter" placeholder="需协助事项"></el-input>
|
</div>
|
</el-table-column>
|
<el-table-column
|
prop="addr"
|
label="地址"
|
width="180">
|
<div class="item" slot-scope="scope">
|
<el-input v-model="scope.row.addr" placeholder="地址"></el-input>
|
</div>
|
</el-table-column>
|
<el-table-column
|
prop="memo"
|
label="备注"
|
width="120">
|
<div class="item" slot-scope="scope">
|
<el-input v-model="scope.row.memo" placeholder="备注"></el-input>
|
</div>
|
</el-table-column>
|
<el-table-column :show="false" property="weeklyDay$" label="日期" v-if="false"></el-table-column>
|
<el-table-column
|
fixed="right"
|
label="操作"
|
width="100">
|
<template slot-scope="scope">
|
<el-button @click="delWeeklyPlan(scope.row)" type="text" size="del-weekly-plan">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-form-item>
|
</el-form>
|
<div slot="footer" class="dialog-footer">
|
<el-button @click="dialogFormVisible = false, weeklyFormData=[]">取 消</el-button>
|
<el-button type="primary" @click="dialogFormVisible = false, addWeekly(form,true)">确 定</el-button>
|
</div>
|
</el-dialog>
|
|
<el-dialog
|
title="星期"
|
:visible.sync="addWeekPlanVisible"
|
width="30%">
|
<div>
|
<el-select v-model="addWeekPlanValue" multiple placeholder="请选择">
|
<el-option
|
v-for="item in addWeekPlanData"
|
:key="item.value"
|
:label="item.name"
|
:value="item.value">
|
</el-option>
|
</el-select>
|
</div>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="addWeekPlanVisible = false">取 消</el-button>
|
<el-button type="primary" @click="addWeekPlanConfirm">确 定</el-button>
|
</span>
|
</el-dialog>
|
|
<el-main>
|
<el-button type="primary" @click="dialogFormVisible = true" icon="el-icon-edit" size="mini" circle></el-button>
|
<el-table
|
:data="tableData"
|
style="width: 100%">
|
<el-table-column
|
prop="weeklyDayMonth"
|
label="周">
|
</el-table-column>
|
<el-table-column
|
prop="status$"
|
label="状态">
|
</el-table-column>
|
<el-table-column
|
prop="weeklyDailyPlan"
|
label="日计划">
|
<template slot-scope="scope">
|
<el-popover
|
placement="bottom"
|
width="1200"
|
trigger="click">
|
<el-table :data="weeklyDailyPlanData">
|
<el-table-column property="weeklyDay$" label="日期"></el-table-column>
|
<el-table-column property="cstmrId$" label="甲方单位"></el-table-column>
|
<el-table-column property="dailyTime$" label="日期"></el-table-column>
|
<el-table-column width="180" property="workContent" label="工作内容及目的"></el-table-column>
|
<el-table-column property="weeklyMatter" label="需协助事项"></el-table-column>
|
<el-table-column property="addr" label="地址"></el-table-column>
|
<el-table-column property="memo" label="备注"></el-table-column>
|
</el-table>
|
<el-button slot="reference" type="text" @click="showWeeklyDailyPlan(scope.row.id)">查看日计划</el-button>
|
</el-popover>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="weeklyDailyReality"
|
label="日结果">
|
<template slot-scope="scope">
|
<el-popover
|
placement="bottom"
|
width="1200"
|
trigger="click">
|
<el-table :data="weeklyDailyRealityData">
|
<el-table-column property="weeklyDay$" label="日期"></el-table-column>
|
<el-table-column property="cstmrId$" label="甲方单位"></el-table-column>
|
<el-table-column property="dailyTime$" label="日期"></el-table-column>
|
<el-table-column width="180" property="workContent" label="结果"></el-table-column>
|
<el-table-column property="weeklyMatter" label="需协助事项"></el-table-column>
|
<el-table-column property="addr" label="地址"></el-table-column>
|
<el-table-column property="memo" label="备注"></el-table-column>
|
</el-table>
|
<el-button slot="reference" type="text" @click="showWeeklyDailyReality(scope.row.id)">查看日结果</el-button>
|
</el-popover>
|
</template>
|
</el-table-column>
|
<el-table-column
|
prop="memo"
|
label="备注（50字）">
|
</el-table-column>
|
<!-- <el-table-column-->
|
<!-- prop="settle$"-->
|
<!-- label="进度">-->
|
<!-- </el-table-column>-->
|
<el-table-column
|
prop="oper"
|
fixed="right"
|
label="操作"
|
width="100">
|
<template slot-scope="scope">
|
<el-button @click="delWeekly(scope.row)" type="text" size="del-weekly">删除</el-button>
|
</template>
|
</el-table-column>
|
</el-table>
|
</el-main>
|
</div>
|
</div>
|
<script>
|
var app = new Vue({
|
el: '#app',
|
data: {
|
tableData: [],
|
weeklyDailyPlanData: [],
|
weeklyDailyRealityData: [],
|
dialogFormVisible: false,
|
form: {
|
name: '',
|
region: '',
|
date1: '',
|
date2: '',
|
delivery: false,
|
type: [],
|
resource: '',
|
desc: ''
|
},
|
formLabelWidth: '120px',
|
addWeekPlanVisible: false,
|
addWeekPlanDataWeeklySign: [
|
{
|
value: '1',
|
label: '上周'
|
},
|
{
|
value: '2',
|
label: '本周'
|
},
|
{
|
value: '3',
|
label: '下周'
|
}
|
],
|
addWeekPlanData: [],
|
addWeekPlanValue: [],
|
weeklyFormData: [],
|
options: [],
|
// 需要编辑的属性
|
editProp: ['cstmrId','workContent','weeklyMatter','memo']
|
},
|
created(){
|
this.init();
|
this.getOptionsData();
|
this.getAddWeekPlanData();
|
},
|
watch: {
|
|
},
|
computed:{
|
// cstmrLabel () {
|
// return (val) => {
|
// let item = this.options.find(o => o.value === val);
|
// return item ? item.label : 'Item not found';
|
// }
|
// }
|
},
|
methods: {
|
init(){
|
let that = this
|
$.ajax({
|
url: baseUrl + '/weekly/list/auth',
|
headers: {'token': localStorage.getItem('token')},
|
method: "get",
|
success: (res) => {
|
that.tableData = res.data.records;
|
console.log(that.tableData)
|
}
|
});
|
},
|
showWeeklyDailyPlan(id) {
|
let that = this;
|
// console.log(id)
|
$.ajax({
|
url: baseUrl + '/weeklyDailyPlan/list/auth',
|
headers: {'token': localStorage.getItem('token')},
|
method: "get",
|
data: {
|
weekly_id: id
|
},
|
success: (res) => {
|
that.weeklyDailyPlanData = res.data.records;
|
// console.log(that.weeklyDailyPlanData)
|
}
|
});
|
},
|
showWeeklyDailyReality(id) {
|
let that = this;
|
// console.log(id)
|
$.ajax({
|
url: baseUrl + '/weeklyDailyReality/list/auth',
|
headers: {'token': localStorage.getItem('token')},
|
method: "get",
|
data: {
|
weekly_id: id
|
},
|
success: (res) => {
|
that.weeklyDailyRealityData = res.data.records;
|
// console.log(that.weeklyDailyRealityData)
|
}
|
});
|
},
|
addWeekPlan() {
|
this.addWeekPlanVisible = true;
|
},
|
addWeekly(res,isExpAdd){
|
let that = this;
|
let weeklyFormData = this.weeklyFormData;
|
|
$.ajax({
|
url: baseUrl+"/weekly/from/" + (isExpAdd?"add":"modify") + "/auth",
|
headers: {'token': localStorage.getItem('token')},
|
data: JSON.stringify({
|
weeklyType: Number(res.name),
|
weeklyId: null,
|
// type: Number(data.field.type),
|
type: Number(1),
|
weeklyDailyPlanList: weeklyFormData
|
}),
|
contentType:'application/json;charset=UTF-8',
|
method: 'POST',
|
success: (res) => {
|
weeklyFormData=[]
|
},
|
error: function (jqXHR, textStatus, errorThrown) {
|
// 在这里做错误处理:
|
console.log('Error occurred: ', textStatus, errorThrown);
|
}
|
})
|
},
|
addWeekPlanConfirm() {
|
let list = this.weeklyFormData
|
let value = this.addWeekPlanValue
|
if (value.length > 0) {
|
value.forEach((item,idx) => {
|
// console.log(item)
|
list.push({
|
weeklyDay: item
|
})
|
})
|
}
|
|
this.weeklyFormData = list;
|
this.addWeekPlanVisible = false;
|
this.addWeekPlanValue = [];
|
},
|
delWeeklyPlan(row) {
|
// 找到要删除的行在数据列表中的索引
|
const index = this.weeklyFormData.findIndex(item => item === row);
|
if (index !== -1) {
|
// 通过splice方法删除该行
|
this.weeklyFormData.splice(index, 1);
|
}
|
},
|
delWeekly(row) {
|
let that = this;
|
// 找到要删除的行在数据列表中的索引
|
const index = this.tableData.findIndex(item => item === row);
|
$.ajax({
|
url: baseUrl+"/weekly/delete/auth",
|
headers: {'token': localStorage.getItem('token')},
|
data: {ids: row.id},
|
method: 'POST',
|
traditional:true,
|
success: function (res) {
|
console.log("res")
|
console.log(res)
|
if (res.code === 200){
|
if (index !== -1) {
|
// 通过splice方法删除该行
|
that.tableData.splice(index, 1);
|
}
|
}
|
}
|
})
|
|
},
|
getOptionsData() {
|
let that = this;
|
$.ajax({
|
url: baseUrl+"/cstmr/all/get/kv",
|
headers: {'token': localStorage.getItem('token')},
|
data: {
|
limit: 9999
|
},
|
method: 'POST',
|
async: false, // 设置为同步执行
|
success: function (res) {
|
// let options1 = that.options;
|
that.options = res.data
|
}
|
})
|
},
|
getAddWeekPlanData() {
|
let that = this;
|
$.ajax({
|
url: baseUrl+"/weeklyCostTypes/all/get/kv",
|
headers: {'token': localStorage.getItem('token')},
|
data: {
|
condition:null
|
},
|
method: 'POST',
|
success: function (res) {
|
// console.log("res")
|
// console.log(res)
|
that.addWeekPlanData = res.data
|
// console.log(that.addWeekPlanData)
|
|
}
|
});
|
}
|
}
|
})
|
|
</script>
|
</body>
|
</html>
|
