|
@@ -2,7 +2,7 @@
|
|
<template>
|
|
<template>
|
|
<div ref="gantt"></div>
|
|
<div ref="gantt"></div>
|
|
</template>
|
|
</template>
|
|
-
|
|
|
|
|
|
+
|
|
<script>
|
|
<script>
|
|
import {gantt} from 'dhtmlx-gantt';
|
|
import {gantt} from 'dhtmlx-gantt';
|
|
import {getDeviceList} from '@/api/api'
|
|
import {getDeviceList} from '@/api/api'
|
|
@@ -16,180 +16,348 @@ export default {
|
|
}
|
|
}
|
|
}
|
|
}
|
|
},
|
|
},
|
|
- // created() {
|
|
|
|
- // this.getDevicelist();
|
|
|
|
|
|
+ created() {
|
|
|
|
+ this.getDevicelist();
|
|
|
|
+ },
|
|
|
|
+ // mounted: function () {
|
|
|
|
+ // // 启用动态加载
|
|
|
|
+ // gantt.config.branch_loading = true
|
|
|
|
+ // //日期格式化
|
|
|
|
+ // gantt.config.xml_date = "%Y-%m-%d";
|
|
|
|
+ // gantt.config.order_branch = true;
|
|
|
|
+ // gantt.config.order_branch_free = true;
|
|
|
|
+ // //左侧是否自适应
|
|
|
|
+ // gantt.config.autofit = true;
|
|
|
|
+ // gantt.config.drag_links = false;//连线
|
|
|
|
+ // gantt.config.readonly = false; //只读
|
|
|
|
+ // gantt.config.date_scale = "%m月%d日"; //右侧显示列名
|
|
|
|
+ // gantt.config.layout = {//拖拽布局
|
|
|
|
+ // css: "gantt_container",
|
|
|
|
+ // rows: [
|
|
|
|
+ // {
|
|
|
|
+ // cols: [
|
|
|
|
+ // { view: "grid", id: "grid", scrollX: "scrollHor", scrollY: "scrollVer" },
|
|
|
|
+ // { resizer: true, width: 1 },
|
|
|
|
+ // { view: "timeline", id: "timeline", scrollX: "scrollHor", scrollY: "scrollVer" },
|
|
|
|
+ // { view: "scrollbar", scroll: "y", id: "scrollVer" }
|
|
|
|
+ // ]
|
|
|
|
+ // },
|
|
|
|
+ // { view: "scrollbar", scroll: "x", id: "scrollHor", height: 20 }
|
|
|
|
+ // ]
|
|
|
|
+ // };
|
|
|
|
+ // gantt.config.start_on_monday = true;
|
|
|
|
+ // gantt.config.work_time = true;
|
|
|
|
+ // gantt.config.fit_tasks = true; //自动调整图表坐标轴区间用于适配task的长度
|
|
|
|
+ // // 甘特图汉化
|
|
|
|
+ // gantt.locale = {
|
|
|
|
+ // date: {
|
|
|
|
+ // month_full: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"],
|
|
|
|
+ // month_short: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
|
|
|
|
+ // day_full: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
|
|
|
|
+ // day_short: ["日", "一", "二", "三", "四", "五", "六"]
|
|
|
|
+ // },
|
|
|
|
+ // labels: {
|
|
|
|
+ // dhx_cal_today_button: "今天",
|
|
|
|
+ // day_tab: "日",
|
|
|
|
+ // week_tab: "周",
|
|
|
|
+ // month_tab: "月",
|
|
|
|
+ // new_event: "新建日程",
|
|
|
|
+ // icon_save: "保存",
|
|
|
|
+ // icon_cancel: "关闭",
|
|
|
|
+ // icon_details: "详细",
|
|
|
|
+ // icon_edit: "编辑",
|
|
|
|
+ // icon_delete: "删除",
|
|
|
|
+ // confirm_closing: "请确认是否撤销修改!", //Your changes will be lost, are your sure?
|
|
|
|
+ // confirm_deleting: "是否删除计划?",
|
|
|
|
+ // section_description: "描述:",
|
|
|
|
+ // section_time: "时间范围:",
|
|
|
|
+ // section_type: "类型:",
|
|
|
|
+ // section_text: "计划名称:",
|
|
|
|
+ // section_test: "测试:",
|
|
|
|
+ // section_projectClass: "项目类型:",
|
|
|
|
+ // taskProjectType_0: "项目任务",
|
|
|
|
+ // taskProjectType_1: "普通任务",
|
|
|
|
+ // section_head: "项目经理:",
|
|
|
|
+ // section_device: "试验设备:",
|
|
|
|
+ // section_priority: '优先级:',
|
|
|
|
+ // taskProgress: '任务状态',
|
|
|
|
+ // taskProgress_0: "未开始",
|
|
|
|
+ // taskProgress_1: "进行中",
|
|
|
|
+ // taskProgress_2: "已完成",
|
|
|
|
+ // taskProgress_3: "已延期",
|
|
|
|
+ // taskProgress_4: "搁置中",
|
|
|
|
+ // section_template: 'Details',
|
|
|
|
+ // /* grid columns */
|
|
|
|
+ // column_text: "计划名称",
|
|
|
|
+ // column_sample: "样品名称",
|
|
|
|
+ // column_project: "检测项目",
|
|
|
|
+ // column_start_date: "开始时间",
|
|
|
|
+ // column_duration: "持续时间",
|
|
|
|
+ // column_add: "",
|
|
|
|
+ // column_priority: "难度",
|
|
|
|
+ // /* link confirmation */
|
|
|
|
+ // link: "关联",
|
|
|
|
+ // confirm_link_deleting: "将被删除",
|
|
|
|
+ // link_start: " (开始)",
|
|
|
|
+ // link_end: " (结束)",
|
|
|
|
+ // type_task: "任务",
|
|
|
|
+ // type_project: "项目",
|
|
|
|
+ // type_milestone: "里程碑",
|
|
|
|
+ //
|
|
|
|
+ // minutes: "分钟",
|
|
|
|
+ // hours: "小时",
|
|
|
|
+ // days: "天",
|
|
|
|
+ // weeks: "周",
|
|
|
|
+ // months: "月",
|
|
|
|
+ // years: "年"
|
|
|
|
+ // }
|
|
|
|
+ // };
|
|
|
|
+ //
|
|
|
|
+ // //定义各种编辑器及类型
|
|
|
|
+ // // var textEditor = {type: "text", map_to: "text"};
|
|
|
|
+ // // var startDateEditor = {type: "date", map_to: "start_date"};
|
|
|
|
+ // // var endDateEditor = {type: "date", map_to: "end_date"};
|
|
|
|
+ // //设置甘特图中各个列相关配置
|
|
|
|
+ // gantt.config.columns = [
|
|
|
|
+ // { name: "text", min_width:100,max_width:200, label:"任务", align: "left",resize: true, tree: true },
|
|
|
|
+ // { name: "sample", label: "样品名称", width: 130, resize: true, align: "left" },
|
|
|
|
+ // { name: "project", label: "检测项目", width: 130, resize: true, align: "left" },
|
|
|
|
+ // { name: "start_date", label: "开始时间", width: 130, resize: true, align: "left" },
|
|
|
|
+ // { name: "end_date", label: "结束时间", width: 130, resize: true, align: "left" },
|
|
|
|
+ // { name: "add", label:"", width: 30 },
|
|
|
|
+ // // {
|
|
|
|
+ // // name: 'text',
|
|
|
|
+ // // label: '项目名称',
|
|
|
|
+ // // editor: textEditor,
|
|
|
|
+ // // resize: true,
|
|
|
|
+ // // tree: true,
|
|
|
|
+ // // width: '100',
|
|
|
|
+ // // },
|
|
|
|
+ // // {
|
|
|
|
+ // // name: 'start_date',
|
|
|
|
+ // // label: '项目开始时间',
|
|
|
|
+ // // align: "center",
|
|
|
|
+ // // editor: startDateEditor,
|
|
|
|
+ // // resize:true,
|
|
|
|
+ // // tree: false,
|
|
|
|
+ // // width: '130',
|
|
|
|
+ // // },
|
|
|
|
+ // // {
|
|
|
|
+ // // name: 'end_date',
|
|
|
|
+ // // label: '项目结束时间',
|
|
|
|
+ // // width: '130',
|
|
|
|
+ // // align: 'center',
|
|
|
|
+ // // editor: endDateEditor,
|
|
|
|
+ // // resize: true,
|
|
|
|
+ // // },
|
|
|
|
+ // ];
|
|
|
|
+ // // var staff = [
|
|
|
|
+ // // { id: 1, label: '大王' },
|
|
|
|
+ // // { id: 2, label: '小王' },
|
|
|
|
+ // // { id: 3, label: '老王' }
|
|
|
|
+ // // ];
|
|
|
|
+ // //弹出层
|
|
|
|
+ // gantt.config.lightbox.sections = [
|
|
|
|
+ // { name: "text", height: 30, map_to: "text", type: "textarea", focus: true, width: "*" },
|
|
|
|
+ // {
|
|
|
|
+ // name: "time", height: 40, map_to: "auto", type: "duration",
|
|
|
|
+ // time_format: ["%Y", "%m", "%d"],
|
|
|
|
+ // },
|
|
|
|
+ // { name: "head", height: 30, map_to: "head_id", type: "select", options:gantt.serverList("staff") },
|
|
|
|
+ // {
|
|
|
|
+ // name: "device", height: 30, map_to: "device_id", type: "select", options: gantt.serverList('staff',[]),
|
|
|
|
+ // },
|
|
|
|
+ // { name: "description", height: 70, map_to: "description", type: "textarea" },
|
|
|
|
+ // // {
|
|
|
|
+ // // name: "priority", height: 40, map_to: "priority", type: "radio", options: gantt.serverList("priority")
|
|
|
|
+ // // },
|
|
|
|
+ //
|
|
|
|
+ // ];
|
|
|
|
+ //
|
|
|
|
+ //
|
|
|
|
+ // gantt.init(this.$refs.gantt);
|
|
|
|
+ // gantt.parse(this.$props.tasks);
|
|
// },
|
|
// },
|
|
- mounted: function () {
|
|
|
|
- // 启用动态加载
|
|
|
|
- gantt.config.branch_loading = true
|
|
|
|
- //日期格式化
|
|
|
|
- gantt.config.xml_date = "%Y-%m-%d";
|
|
|
|
- gantt.config.order_branch = true;
|
|
|
|
- gantt.config.order_branch_free = true;
|
|
|
|
- //左侧是否自适应
|
|
|
|
- gantt.config.autofit = true;
|
|
|
|
- gantt.config.drag_links = false;//连线
|
|
|
|
- gantt.config.readonly = false; //只读
|
|
|
|
- gantt.config.date_scale = "%m月%d日"; //右侧显示列名
|
|
|
|
- gantt.config.layout = {//拖拽布局
|
|
|
|
- css: "gantt_container",
|
|
|
|
- rows: [
|
|
|
|
|
|
+ methods: {
|
|
|
|
+ getDevicelist(){
|
|
|
|
+ getDeviceList().then((res) => {
|
|
|
|
+ this.tasks.collections.staff = res.map(response =>{
|
|
|
|
+ return {
|
|
|
|
+ value: response.id,
|
|
|
|
+ label: response.deviceName
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ console.log('this.tasks.collections.staff:',this.tasks.collections.staff)
|
|
|
|
+ this.tasks.collections.staff2.push(
|
|
|
|
+ { id: 2, label: '999' },
|
|
|
|
+ { id: 3, label: '777' }
|
|
|
|
+ )
|
|
|
|
+ this.initData()
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ initData(){
|
|
|
|
+ // 启用动态加载
|
|
|
|
+ gantt.config.branch_loading = true
|
|
|
|
+ //日期格式化
|
|
|
|
+ gantt.config.xml_date = "%Y-%m-%d";
|
|
|
|
+ gantt.config.order_branch = true;
|
|
|
|
+ gantt.config.order_branch_free = true;
|
|
|
|
+ //左侧是否自适应
|
|
|
|
+ gantt.config.autofit = true;
|
|
|
|
+ gantt.config.drag_links = false;//连线
|
|
|
|
+ gantt.config.readonly = false; //只读
|
|
|
|
+ gantt.config.date_scale = "%m月%d日"; //右侧显示列名
|
|
|
|
+ gantt.config.layout = {//拖拽布局
|
|
|
|
+ css: "gantt_container",
|
|
|
|
+ rows: [
|
|
|
|
+ {
|
|
|
|
+ cols: [
|
|
|
|
+ { view: "grid", id: "grid", scrollX: "scrollHor", scrollY: "scrollVer" },
|
|
|
|
+ { resizer: true, width: 1 },
|
|
|
|
+ { view: "timeline", id: "timeline", scrollX: "scrollHor", scrollY: "scrollVer" },
|
|
|
|
+ { view: "scrollbar", scroll: "y", id: "scrollVer" }
|
|
|
|
+ ]
|
|
|
|
+ },
|
|
|
|
+ { view: "scrollbar", scroll: "x", id: "scrollHor", height: 20 }
|
|
|
|
+ ]
|
|
|
|
+ };
|
|
|
|
+ gantt.config.start_on_monday = true;
|
|
|
|
+ gantt.config.work_time = true;
|
|
|
|
+ gantt.config.fit_tasks = true; //自动调整图表坐标轴区间用于适配task的长度
|
|
|
|
+ // 甘特图汉化
|
|
|
|
+ gantt.locale = {
|
|
|
|
+ date: {
|
|
|
|
+ month_full: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"],
|
|
|
|
+ month_short: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
|
|
|
|
+ day_full: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
|
|
|
|
+ day_short: ["日", "一", "二", "三", "四", "五", "六"]
|
|
|
|
+ },
|
|
|
|
+ labels: {
|
|
|
|
+ dhx_cal_today_button: "今天",
|
|
|
|
+ day_tab: "日",
|
|
|
|
+ week_tab: "周",
|
|
|
|
+ month_tab: "月",
|
|
|
|
+ new_event: "新建日程",
|
|
|
|
+ icon_save: "保存",
|
|
|
|
+ icon_cancel: "关闭",
|
|
|
|
+ icon_details: "详细",
|
|
|
|
+ icon_edit: "编辑",
|
|
|
|
+ icon_delete: "删除",
|
|
|
|
+ confirm_closing: "请确认是否撤销修改!", //Your changes will be lost, are your sure?
|
|
|
|
+ confirm_deleting: "是否删除计划?",
|
|
|
|
+ section_description: "描述:",
|
|
|
|
+ section_time: "时间范围:",
|
|
|
|
+ section_type: "类型:",
|
|
|
|
+ section_text: "计划名称:",
|
|
|
|
+ section_test: "测试:",
|
|
|
|
+ section_projectClass: "项目类型:",
|
|
|
|
+ taskProjectType_0: "项目任务",
|
|
|
|
+ taskProjectType_1: "普通任务",
|
|
|
|
+ section_head: "项目经理:",
|
|
|
|
+ section_device: "试验设备:",
|
|
|
|
+ section_priority: '优先级:',
|
|
|
|
+ taskProgress: '任务状态',
|
|
|
|
+ taskProgress_0: "未开始",
|
|
|
|
+ taskProgress_1: "进行中",
|
|
|
|
+ taskProgress_2: "已完成",
|
|
|
|
+ taskProgress_3: "已延期",
|
|
|
|
+ taskProgress_4: "搁置中",
|
|
|
|
+ section_template: 'Details',
|
|
|
|
+ /* grid columns */
|
|
|
|
+ column_text: "计划名称",
|
|
|
|
+ column_sample: "样品名称",
|
|
|
|
+ column_project: "检测项目",
|
|
|
|
+ column_start_date: "开始时间",
|
|
|
|
+ column_duration: "持续时间",
|
|
|
|
+ column_add: "",
|
|
|
|
+ column_priority: "难度",
|
|
|
|
+ /* link confirmation */
|
|
|
|
+ link: "关联",
|
|
|
|
+ confirm_link_deleting: "将被删除",
|
|
|
|
+ link_start: " (开始)",
|
|
|
|
+ link_end: " (结束)",
|
|
|
|
+ type_task: "任务",
|
|
|
|
+ type_project: "项目",
|
|
|
|
+ type_milestone: "里程碑",
|
|
|
|
+
|
|
|
|
+ minutes: "分钟",
|
|
|
|
+ hours: "小时",
|
|
|
|
+ days: "天",
|
|
|
|
+ weeks: "周",
|
|
|
|
+ months: "月",
|
|
|
|
+ years: "年"
|
|
|
|
+ }
|
|
|
|
+ };
|
|
|
|
+
|
|
|
|
+ //定义各种编辑器及类型
|
|
|
|
+ // var textEditor = {type: "text", map_to: "text"};
|
|
|
|
+ // var startDateEditor = {type: "date", map_to: "start_date"};
|
|
|
|
+ // var endDateEditor = {type: "date", map_to: "end_date"};
|
|
|
|
+ //设置甘特图中各个列相关配置
|
|
|
|
+ gantt.config.columns = [
|
|
|
|
+ { name: "text", min_width:100,max_width:200, label:"任务", align: "left",resize: true, tree: true },
|
|
|
|
+ { name: "sample", label: "样品名称", width: 130, resize: true, align: "left" },
|
|
|
|
+ { name: "project", label: "检测项目", width: 130, resize: true, align: "left" },
|
|
|
|
+ { name: "start_date", label: "开始时间", width: 130, resize: true, align: "left" },
|
|
|
|
+ { name: "end_date", label: "结束时间", width: 130, resize: true, align: "left" },
|
|
|
|
+ { name: "add", label:"", width: 30 },
|
|
|
|
+ // {
|
|
|
|
+ // name: 'text',
|
|
|
|
+ // label: '项目名称',
|
|
|
|
+ // editor: textEditor,
|
|
|
|
+ // resize: true,
|
|
|
|
+ // tree: true,
|
|
|
|
+ // width: '100',
|
|
|
|
+ // },
|
|
|
|
+ // {
|
|
|
|
+ // name: 'start_date',
|
|
|
|
+ // label: '项目开始时间',
|
|
|
|
+ // align: "center",
|
|
|
|
+ // editor: startDateEditor,
|
|
|
|
+ // resize:true,
|
|
|
|
+ // tree: false,
|
|
|
|
+ // width: '130',
|
|
|
|
+ // },
|
|
|
|
+ // {
|
|
|
|
+ // name: 'end_date',
|
|
|
|
+ // label: '项目结束时间',
|
|
|
|
+ // width: '130',
|
|
|
|
+ // align: 'center',
|
|
|
|
+ // editor: endDateEditor,
|
|
|
|
+ // resize: true,
|
|
|
|
+ // },
|
|
|
|
+ ];
|
|
|
|
+ // var staff = [
|
|
|
|
+ // { id: 1, label: '大王' },
|
|
|
|
+ // { id: 2, label: '小王' },
|
|
|
|
+ // { id: 3, label: '老王' }
|
|
|
|
+ // ];
|
|
|
|
+ //弹出层
|
|
|
|
+ gantt.config.lightbox.sections = [
|
|
|
|
+ { name: "text", height: 30, map_to: "text", type: "textarea", focus: true, width: "*" },
|
|
{
|
|
{
|
|
- cols: [
|
|
|
|
- { view: "grid", id: "grid", scrollX: "scrollHor", scrollY: "scrollVer" },
|
|
|
|
- { resizer: true, width: 1 },
|
|
|
|
- { view: "timeline", id: "timeline", scrollX: "scrollHor", scrollY: "scrollVer" },
|
|
|
|
- { view: "scrollbar", scroll: "y", id: "scrollVer" }
|
|
|
|
- ]
|
|
|
|
|
|
+ name: "time", height: 40, map_to: "auto", type: "duration",
|
|
|
|
+ time_format: ["%Y", "%m", "%d"],
|
|
},
|
|
},
|
|
- { view: "scrollbar", scroll: "x", id: "scrollHor", height: 20 }
|
|
|
|
- ]
|
|
|
|
- };
|
|
|
|
- gantt.config.start_on_monday = true;
|
|
|
|
- gantt.config.work_time = true;
|
|
|
|
- gantt.config.fit_tasks = true; //自动调整图表坐标轴区间用于适配task的长度
|
|
|
|
- // 甘特图汉化
|
|
|
|
- gantt.locale = {
|
|
|
|
- date: {
|
|
|
|
- month_full: ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"],
|
|
|
|
- month_short: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
|
|
|
|
- day_full: ["星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"],
|
|
|
|
- day_short: ["日", "一", "二", "三", "四", "五", "六"]
|
|
|
|
- },
|
|
|
|
- labels: {
|
|
|
|
- dhx_cal_today_button: "今天",
|
|
|
|
- day_tab: "日",
|
|
|
|
- week_tab: "周",
|
|
|
|
- month_tab: "月",
|
|
|
|
- new_event: "新建日程",
|
|
|
|
- icon_save: "保存",
|
|
|
|
- icon_cancel: "关闭",
|
|
|
|
- icon_details: "详细",
|
|
|
|
- icon_edit: "编辑",
|
|
|
|
- icon_delete: "删除",
|
|
|
|
- confirm_closing: "请确认是否撤销修改!", //Your changes will be lost, are your sure?
|
|
|
|
- confirm_deleting: "是否删除计划?",
|
|
|
|
- section_description: "描述:",
|
|
|
|
- section_time: "时间范围:",
|
|
|
|
- section_type: "类型:",
|
|
|
|
- section_text: "计划名称:",
|
|
|
|
- section_test: "测试:",
|
|
|
|
- section_projectClass: "项目类型:",
|
|
|
|
- taskProjectType_0: "项目任务",
|
|
|
|
- taskProjectType_1: "普通任务",
|
|
|
|
- section_head: "项目经理:",
|
|
|
|
- section_device: "试验设备:",
|
|
|
|
- section_priority: '优先级:',
|
|
|
|
- taskProgress: '任务状态',
|
|
|
|
- taskProgress_0: "未开始",
|
|
|
|
- taskProgress_1: "进行中",
|
|
|
|
- taskProgress_2: "已完成",
|
|
|
|
- taskProgress_3: "已延期",
|
|
|
|
- taskProgress_4: "搁置中",
|
|
|
|
- section_template: 'Details',
|
|
|
|
- /* grid columns */
|
|
|
|
- column_text: "计划名称",
|
|
|
|
- column_sample: "样品名称",
|
|
|
|
- column_project: "检测项目",
|
|
|
|
- column_start_date: "开始时间",
|
|
|
|
- column_duration: "持续时间",
|
|
|
|
- column_add: "",
|
|
|
|
- column_priority: "难度",
|
|
|
|
- /* link confirmation */
|
|
|
|
- link: "关联",
|
|
|
|
- confirm_link_deleting: "将被删除",
|
|
|
|
- link_start: " (开始)",
|
|
|
|
- link_end: " (结束)",
|
|
|
|
- type_task: "任务",
|
|
|
|
- type_project: "项目",
|
|
|
|
- type_milestone: "里程碑",
|
|
|
|
|
|
+ { name: "head", height: 30, map_to: "head_id", type: "select", options:gantt.serverList("staff2") },
|
|
|
|
+ {
|
|
|
|
+ name: "device", height: 30, map_to: "device_id", type: "select", options: gantt.serverList('staff',[]),
|
|
|
|
+ },
|
|
|
|
+ { name: "description", height: 70, map_to: "description", type: "textarea" },
|
|
|
|
+ // {
|
|
|
|
+ // name: "priority", height: 40, map_to: "priority", type: "radio", options: gantt.serverList("priority")
|
|
|
|
+ // },
|
|
|
|
|
|
- minutes: "分钟",
|
|
|
|
- hours: "小时",
|
|
|
|
- days: "天",
|
|
|
|
- weeks: "周",
|
|
|
|
- months: "月",
|
|
|
|
- years: "年"
|
|
|
|
- }
|
|
|
|
- };
|
|
|
|
-
|
|
|
|
- //定义各种编辑器及类型
|
|
|
|
- // var textEditor = {type: "text", map_to: "text"};
|
|
|
|
- // var startDateEditor = {type: "date", map_to: "start_date"};
|
|
|
|
- // var endDateEditor = {type: "date", map_to: "end_date"};
|
|
|
|
- //设置甘特图中各个列相关配置
|
|
|
|
- gantt.config.columns = [
|
|
|
|
- { name: "text", min_width:100,max_width:200, label:"任务", align: "left",resize: true, tree: true },
|
|
|
|
- { name: "sample", label: "样品名称", width: 130, resize: true, align: "left" },
|
|
|
|
- { name: "project", label: "检测项目", width: 130, resize: true, align: "left" },
|
|
|
|
- { name: "start_date", label: "开始时间", width: 130, resize: true, align: "left" },
|
|
|
|
- { name: "end_date", label: "结束时间", width: 130, resize: true, align: "left" },
|
|
|
|
- { name: "add", label:"", width: 30 },
|
|
|
|
- // {
|
|
|
|
- // name: 'text',
|
|
|
|
- // label: '项目名称',
|
|
|
|
- // editor: textEditor,
|
|
|
|
- // resize: true,
|
|
|
|
- // tree: true,
|
|
|
|
- // width: '100',
|
|
|
|
- // },
|
|
|
|
- // {
|
|
|
|
- // name: 'start_date',
|
|
|
|
- // label: '项目开始时间',
|
|
|
|
- // align: "center",
|
|
|
|
- // editor: startDateEditor,
|
|
|
|
- // resize:true,
|
|
|
|
- // tree: false,
|
|
|
|
- // width: '130',
|
|
|
|
- // },
|
|
|
|
- // {
|
|
|
|
- // name: 'end_date',
|
|
|
|
- // label: '项目结束时间',
|
|
|
|
- // width: '130',
|
|
|
|
- // align: 'center',
|
|
|
|
- // editor: endDateEditor,
|
|
|
|
- // resize: true,
|
|
|
|
- // },
|
|
|
|
- ];
|
|
|
|
- // var staff = [
|
|
|
|
- // { id: 1, label: '大王' },
|
|
|
|
- // { id: 2, label: '小王' },
|
|
|
|
- // { id: 3, label: '老王' }
|
|
|
|
- // ];
|
|
|
|
- //弹出层
|
|
|
|
- gantt.config.lightbox.sections = [
|
|
|
|
- { name: "text", height: 30, map_to: "text", type: "textarea", focus: true, width: "*" },
|
|
|
|
- {
|
|
|
|
- name: "time", height: 40, map_to: "auto", type: "duration",
|
|
|
|
- time_format: ["%Y", "%m", "%d"],
|
|
|
|
- },
|
|
|
|
- { name: "head", height: 30, map_to: "head_id", type: "select", options:gantt.serverList("staff") },
|
|
|
|
- {
|
|
|
|
- name: "device", height: 30, map_to: "device_id", type: "select", options: gantt.serverList('staff',[]),
|
|
|
|
- },
|
|
|
|
- { name: "description", height: 70, map_to: "description", type: "textarea" },
|
|
|
|
- // {
|
|
|
|
- // name: "priority", height: 40, map_to: "priority", type: "radio", options: gantt.serverList("priority")
|
|
|
|
- // },
|
|
|
|
|
|
+ ];
|
|
|
|
|
|
- ];
|
|
|
|
-
|
|
|
|
-
|
|
|
|
- gantt.init(this.$refs.gantt);
|
|
|
|
- gantt.parse(this.$props.tasks);
|
|
|
|
- },
|
|
|
|
- // methods: {
|
|
|
|
- // getDevicelist(){
|
|
|
|
- // getDeviceList().then((res) => {
|
|
|
|
- // console.log(111,res)
|
|
|
|
- // // this.staff = res
|
|
|
|
- // // console.log(this.staff)
|
|
|
|
- // })
|
|
|
|
- // }
|
|
|
|
- // }
|
|
|
|
|
|
+
|
|
|
|
+ gantt.init(this.$refs.gantt);
|
|
|
|
+ gantt.parse(this.$props.tasks);
|
|
|
|
+ }
|
|
|
|
+ }
|
|
}
|
|
}
|
|
</script>
|
|
</script>
|
|
-
|
|
|
|
|
|
+
|
|
<style>
|
|
<style>
|
|
@import "~dhtmlx-gantt/codebase/dhtmlxgantt.css";
|
|
@import "~dhtmlx-gantt/codebase/dhtmlxgantt.css";
|
|
</style>
|
|
</style>
|