@extends('layouts.front.shell')

@section('cssdefine')

<link rel="stylesheet" type="text/css" href="{{ asset('css/page/part/project/project_list.css') }}">

@endsection

@section('content')

<div id="content_area" class="shrink">
	<div class="w-100 content_layer rounded_lv4">
		<div class="container-fluid">
			<div class="row">
				<div class="col main_title order-1 mb-3 mb-lg-0">專案列表</div>
				<div class="col-lg-auto order-3 order-lg-2">
					<div class="form-row">
						<div class="col col-lg-auto">
							<div class="input-group input-group-sm">
								<input type="text" class="form-control form-control-sm form_control_cover inputbox_primary" placeholder="搜尋名稱">
								<div class="input-group-append">
									<button class="btn btn_secondary" type="button" id="button-addon2"><i class="fa-solid fa-magnifying-glass"></i></button>
								</div>
							</div>
						</div>
						<div class="col-auto">
							<button class="btn_text text_sm btn_secondary" data-toggle="collapse" data-target="#filter"><i class="fas fa-filter"></i>&ensp;篩選</button>
						</div>
					</div>
				</div>
				<div class="col-auto order-2 order-lg-3 mb-3 mb-lg-0">
					<button class="btn_text text_sm btn_primary" onclick="location.href='project_edit.php';"><i class="fas fa-plus"></i>&ensp;新增專案</button>
				</div>
			</div>
			<div id="filter" class="collapse mt-4">
				<div class="row align-items-center">
					<div class="col-lg">
						<div class="row">
							<div class="col-6 col-lg-3 form-group">
								<select class="form-control form-control-sm form_control_cover inputbox_primary">
									<option>請選擇狀態</option>
								</select>
							</div>
							<div class="col-6 col-lg-3 form-group">
								<select class="form-control form-control-sm form_control_cover inputbox_primary">
									<option>請選擇負責人</option>
								</select>
							</div>
							<div class="col-lg-6 form-group">
								<div class="form-row">
									<div class="col-6">
										<div class="form-row align-items-center">
											<div class="col-auto small">起</div>
											<div class="col">
												<input type="date" class="form-control form-control-sm form_control_cover inputbox_primary">
											</div>
										</div>
									</div>
									<div class="col-6">
										<div class="form-row align-items-center">
											<div class="col-auto small">迄</div>
											<div class="col">
												<input type="date" class="form-control form-control-sm form_control_cover inputbox_primary">
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="col-lg-auto">
						<div class="d-flex w-100 justify-content-end">
							<button class="btn_text text_sm btn_secondary mb-3">進行篩選</button>
						</div>

					</div>
				</div>
			</div>
			<div class="position-relative">
				<div class="mt-4 scrollbar_x">
					<div class="d-lg-table container-fluid px-lg-0 list_2nd_table">
						<div class="list_2nd_head d-none d-lg-table-row">
							<div class="d-table-cell">專案名稱</div>
							<div class="d-table-cell">狀態</div>
							<div class="d-table-cell">進度</div>
							<div class="d-table-cell">時程</div>
							<div class="d-table-cell">負責人</div>
							<div class="d-table-cell list_tool">
								<div class="d-lg-none">操作</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="name_width multiline_ellipsis clamp_2" title="[顯示專案全名]">[專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱][專案名稱]</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle w-auto">
								<div class="d-flex">
									<div class="tag_frame tag_primary text-nowrap">狀態</div>
								</div>
							</div>
							<div class="col-8 col-md-4 d-lg-table-cell align-middle">
								<div class="progress progress_bg progress_width">
									<div class="progress-bar progressbar_bg" role="progressbar" style="width: 25%" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
								</div>
							</div>
							<div class="col-auto col-md-4 d-lg-table-cell align-middle">
								<div class="row no-gutters">
									<div class="col-auto">2022.10.01→</div>
									<div class="col-auto color_warn">2023.03.31</div>
								</div>
							</div>
							<div class="col-auto d-lg-table-cell align-middle">
								<div class="d-inline-flex align-items-center cursor_pointer" data-toggle="modal" data-target="#principal_modal">
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="crew_image shadow-sm">
										<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
									</div>
									<div class="more_count">+5</div>
								</div>
							</div>
							<div class="col-12 col-md-auto d-lg-table-cell align-middle w-lg-1 list_tool_border">
								<div class="d-inline-flex list_tool justify-content-end">
									<button class="btn_icon_word icon_sm btn_warn d-lg-none" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
									<button class="btn_icon_word icon_sm btn_primary d-lg-none" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>
								</div>
							</div>
						</div>
						<div class="d-none d-lg-block operation_area">
							<div class="list_2nd_head d-none d-lg-table-row">
								<div class="d-table-cell list_tool">操作</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
							<div class="row d-lg-table-row list_2nd_body align-items-center justify-content-between">
								<div class="d-none d-lg-table-cell align-middle w-lg-1">
									<div class="d-inline-flex list_tool justify-content-end">
										<button class="btn_icon_word icon_sm btn_warn" title="刪除" data-toggle="modal" data-target="#delete"><i class="fa-solid fa-trash"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="甘特圖" onclick="location.href='project_gantt.php';"><i class="fa-solid fa-chart-gantt"></i></button>
										<button class="btn_icon_word icon_sm btn_primary" title="編輯" onclick="location.href='project_edit.php';"><i class="fa-solid fa-pen"></i></button>

									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<nav class="mt-4">
				<ul class="pagination justify-content-center pagination_style">
					<li class="page-item">
						<a class="page-link" href="#" aria-label="Previous">
							<span aria-hidden="true">&laquo;</span>
						</a>
					</li>
					<li class="page-item active"><a class="page-link" href="#">1</a></li>
					<li class="page-item"><a class="page-link" href="#">2</a></li>
					<li class="page-item"><a class="page-link" href="#">3</a></li>
					<li class="page-item">
						<a class="page-link" href="#" aria-label="Next">
							<span aria-hidden="true">&raquo;</span>
						</a>
					</li>
				</ul>
			</nav>
		</div>
	</div>
</div>

<div class="modal fade modal_style" id="principal_modal" tabindex="-1" role="dialog">
	<div class="modal-dialog modal-dialog-centered modal-dialog-scrollable" role="document">
		<div class="modal-content">
			<div class="modal-header">
				<h5 class="modal-title font-weight-bold">[專案名稱]-負責人</h5>
				<button type="button" class="close" data-dismiss="modal" aria-label="Close">
					<i class="fa-solid fa-xmark"></i>
				</button>
			</div>
			<div class="modal-body scrollbar_y">
				<div class="row align-items-center crew_item">
					<div class="col-auto">
						<div class="crew_image shadow-sm border">
							<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
						</div>
					</div>
					<div class="col">[姓名]</div>
				</div>
				<div class="row align-items-center crew_item">
					<div class="col-auto">
						<div class="crew_image shadow-sm border">
							<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
						</div>
					</div>
					<div class="col">[姓名]</div>
				</div>
				<div class="row align-items-center crew_item">
					<div class="col-auto">
						<div class="crew_image shadow-sm border">
							<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
						</div>
					</div>
					<div class="col">[姓名]</div>
				</div>
				<div class="row align-items-center crew_item">
					<div class="col-auto">
						<div class="crew_image shadow-sm border">
							<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
						</div>
					</div>
					<div class="col">[姓名]</div>
				</div>
				<div class="row align-items-center crew_item">
					<div class="col-auto">
						<div class="crew_image shadow-sm border">
							<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
						</div>
					</div>
					<div class="col">[姓名]</div>
				</div>
				<div class="row align-items-center crew_item">
					<div class="col-auto">
						<div class="crew_image shadow-sm border">
							<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
						</div>
					</div>
					<div class="col">[姓名]</div>
				</div>
				<div class="row align-items-center crew_item">
					<div class="col-auto">
						<div class="crew_image shadow-sm border">
							<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
						</div>
					</div>
					<div class="col">[姓名]</div>
				</div>
				<div class="row align-items-center crew_item">
					<div class="col-auto">
						<div class="crew_image shadow-sm border">
							<img src="{{ asset('img/crew.jpg') }}" class="h-100 w-100 object_fit_cover rounded-circle">
						</div>
					</div>
					<div class="col">[姓名]</div>
				</div>
			</div>
		</div>
	</div>
</div>
<div class="modal fade modal_style" id="delete" tabindex="-1" role="dialog">
	<div class="modal-dialog modal-sm modal-dialog-centered modal-dialog-scrollable" role="document">
		<div class="modal-content">
			<div class="modal-body color_warn">確定要刪除「[專案名稱]」嗎？</div>
			<div class="modal-footer">
				<button class="btn_text text_sm btn_warn" data-dismiss="modal">確定刪除</button>
				<button class="btn_text text_sm btn_secondary" data-dismiss="modal">取消</button>
			</div>
		</div>
	</div>
</div>



@endsection


@section('jsdefine')


@endsection