<!-- 新增專案單獨頁面 -->
<template>
  <div>
    <div
      class="background"
      style="
        z-index: -1;
        position: fixed;
        background-repeat: no-repeat;
        width: 100%;
        overflow: auto;
      "
    >
      <img :src="backgroundImg" width="101% " height="100%" alt="" />
    </div>
    <div class="front">
      <b-row style="padding-top: 30px; margin: 0 !important">
        <b-col cols="10">
          <b-button class="btn_title">PMIS專案管理資訊系統</b-button>
        </b-col>
        <!-- <b-col cols="2">
          <b-nav-item-dropdown
            right
            style="float: right; padding-top: 5px; color: white"
          >
            <b-dropdown-item to="/projectManagement">專案管理</b-dropdown-item>
            <b-dropdown-item to="/userManagement">使用者管理</b-dropdown-item>
            <b-dropdown-item to="/personalInformation"
              >個人資料</b-dropdown-item
            >
            <b-dropdown-divider></b-dropdown-divider>
            <b-dropdown-item to="/signin/userLogIn"
              ><b-icon icon="box-arrow-left " font-scale="1"></b-icon
              >登出</b-dropdown-item
            >
          </b-nav-item-dropdown>
          <b-avatar variant="primary" style="float: right"></b-avatar>
          <div
            style="
              padding-top: 9px;
              padding-right: 10px;
              float: right;
              color: white;
            "
          >
            {{ currentUser.name }}
          </div>
        </b-col> -->
      </b-row>

      <b-row style="padding-bottom: 20px; margin: 0 !important">
        <b-col cols="12">
          <b-container
            class="container"
            style="
              border: 0;
              width: 100%;
              height: auto;
              background-color: rgb(238, 238, 238);
              margin: 30px 0 0 20%;
              padding-bottom: 20px;
            "
          >
            <b-row>
              <b-col cols="10">
              <div
                style="
                  margin: 20px 0 30px 30px;
                  font-size: 25px;
                  font-weight: bold;
                "
              >
                專案資料
              </div>
              </b-col>
              <b-col cols="2">
                  <b-button
                    class="btn_module"
                    style="margin: 20px 30px 30px 30px; float: right"
                    >確認
                  </b-button>
                </b-col>
            </b-row>
            <b-row>
              <div
                style="margin: 0 0 0 30px; font-size: 16px; font-weight: 500"
              >
                專案類型
              </div>
            </b-row>
            <b-row style="padding-bottom: 10px">
              <b-col cols="12">
                <div style="height: 5px; width: 100%">
                  <hr
                    style="
                      border-top: 1px solid gray;
                      margin-top: 0;
                      margin-bottom: 0;
                    "
                  />
                </div>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="4">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="年度："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 40%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
              <b-col cols="8">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="工程案所屬單位："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 70%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <div
                style="margin: 0 0 0 30px; font-size: 16px; font-weight: 500"
              >
                基本資料
              </div>
            </b-row>
            <b-row style="padding-bottom: 10px">
              <b-col cols="12">
                <div style="height: 5px; width: 100%">
                  <hr
                    style="
                      border-top: 1px solid gray;
                      margin-top: 0;
                      margin-bottom: 0;
                    "
                  />
                </div>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="計畫名稱："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="計畫編號："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="工程名稱："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="負責人："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="專案地址："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="聯絡電話："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="聯絡地址："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="聯絡電話："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="傳真："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="郵遞區號："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="6">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 10px; color: black"
                  label="電子郵件："
                  label-for="input-lg"
                >
                  <b-form-input
                    id="input-lg"
                    style="width: 90%; color: black"
                  ></b-form-input>
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <div
                style="margin: 0 0 0 30px; font-size: 16px; font-weight: 500"
              >
                備註
              </div>
            </b-row>
            <b-row>
              <b-col cols="12">
                <div style="height: 5px; width: 100%">
                  <hr
                    style="
                      border-top: 1px solid gray;
                      margin-top: 0;
                      margin-bottom: 0;
                    "
                  />
                </div>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="12">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 5px; color: black"
                  label="工程概述："
                  label-for="input-lg"
                >
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="12" style="padding-left: 40px; margin-bottom: 10px">
                <b-form-textarea
                  id="input-lg"
                  style="width: 90%; color: black; height: 100px"
                ></b-form-textarea>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="12">
                <b-form-group
                  label-cols-sm="3"
                  label-align-sm="left"
                  style="padding-left: 20px; margin-bottom: 5px; color: black"
                  label="備註："
                  label-for="input-lg"
                >
                </b-form-group>
              </b-col>
            </b-row>
            <b-row>
              <b-col cols="12" style="padding-left: 40px; margin-bottom: 10px">
                <b-form-textarea
                  id="input-lg"
                  style="width: 90%; color: black; height: 100px"
                ></b-form-textarea>
              </b-col>
            </b-row>
          </b-container>
        </b-col>
        <!-- <b-col style="padding: 30px 0 0 0" cols="8"> -->
        <!-- <div
            style="
              width: 65vw;
              max-width: 95%;
              padding: 0 0 10px 10px;
              height: 80vh;
              max-height: 80vh;
              overflow-y: auto;
            "
          > -->
        <!-- <div style="width: 97%; margin-bottom: 20px">
              <b-row>
                <b-col cols="10">
                  <b-button @click="addNewTender" class="btn_module" style="width: 100%">
                    新增專案
                  </b-button>
                </b-col>
                <b-col cols="2">
                  <b-button
                    class="btn_module"
                    style="float: right"
                    @click="addProject"
                    >確認
                  </b-button>
                </b-col>
              </b-row>
            </div> -->
        <!-- 標案框 -->
        <!-- <div
              class="container"
              style="
                max-width: 97%;
                background-color: white;
                margin-left: 0;
                padding-left: 10px;
                overflow: auto;
                box-shadow: 2px 2px 10px rgba(0, 0, 0, 40);
                margin-bottom:15px;
              "
              v-for="(project,index) in projectListTest"
              :key="index"
            > -->
        <!-- splice若要使用v-for的index，需要使用到v-for的第一個參數才抓的到值，例如:v-model,{{}} -->
        <!-- <b-button
                style="
                  background-color: white;
                  color: red;
                  box-shadow: none;
                  font-size: 18px;
                  float: right;
                  margin: 0;
                  padding: 10px 0 0 0;
                "
                @click="deleteTender(index)"
                ><b-icon-x-circle
              /></b-button> -->
        <!-- <b-row style="padding-top: 35px">
                <b-col cols="6">
                  <b-form-group
                    label-cols-sm="3"
                    label-align-sm="left"
                    style="
                      padding-left: 20px;
                      margin-bottom: 10px;
                      font-size: 20px;
                      font-weight: bold;
                    "
                    label="標別："
                    label-for="input-lg"
                  >
                    <b-form-input
                      v-model="projectListTest[index].tender"
                      id="input-lg"
                      style="width: 95%"
                    ></b-form-input>
                  </b-form-group>
                </b-col>
                <b-col cols="6">
                  <b-form-group
                    label-cols-sm="3"
                    label-align-sm="left"
                    style="
                      padding-left: 20px;
                      margin-bottom: 10px;
                      font-size: 20px;
                      font-weight: bold;
                    "
                    label="標案編號："
                    label-for="input-lg"
                  >
                    <b-form-input
                      v-model="projectListTest[index].tenderNumber"
                      id="input-lg"
                      style="width: 95%"
                    ></b-form-input>
                  </b-form-group>
                </b-col>
              </b-row>
              <b-row
                ><div
                  style="font-size: 20px; font-weight: bold; margin-left: 3%"
                >
                  選擇委託類型：
                </div></b-row
              >
              <div id="allContent" style="margin-top: 10px">
                <div
                  id="ContractCategory"
                  style="
                    margin-left: 10px;
                    margin-top: 5px;
                    margin-bottom: 10px;
                  "
                >
                  <b-card no-body class="mb-1" id="PCMControl">
                    <div>
                      <b-button v-b-toggle="`PCM-${index}`" block class="btn_module">
                        專案管理
                      </b-button>
                      <b-form-checkbox
                        v-model="PCM.checked"
                        name="check-button"
                        switch
                      >
                        <b
                          ><span v-if="PCM.checked">已開啟</span>
                          <span v-else>已關閉</span></b
                        >
                      </b-form-checkbox>
                      <b-collapse
                        :id="`PCM-${index}`"
                        style="padding: 0 15px 15px 15px"
                      >
                        <div class="infoTitle">
                          <span class="midText" style="font-weight: bold"
                            >標案資料</span
                          >
                        </div>
                        <b-row style="margin-bottom: 20px">
                          <b-col cols="12">
                            <b-row>
                              <b-col cols="6">
                                <span style="color: black">主辦部門：</span>
                                <b-form-input
                                  id="input-lg"
                                  style="width: 100%"
                                  v-model="project.organizer"
                                ></b-form-input>
                                <span style="color: black">主辦工程師：</span>
                                <b-form-input
                                  id="input-lg"
                                  style="width: 100%"
                                  v-model="project.organizerEngineer"
                                ></b-form-input>
                                <span style="color: black">工程地點：</span>
                                <b-form-input
                                  id="input-lg"
                                  style="width: 100%"
                                  v-model="project.address"
                                ></b-form-input>
                              </b-col>
                              <b-col cols="6">
                                <span style="color: black">聯絡人：</span>
                                <b-form-input
                                  id="input-lg"
                                  style="width: 100%"
                                  v-model="project.contactPerson"
                                ></b-form-input>
                                <span style="color: black">聯絡電話：</span>
                                <b-form-input
                                  id="input-lg"
                                  style="width: 100%"
                                  v-model="project.contactNumber"
                                ></b-form-input>
                                <span style="color: black">電子郵件：</span>
                                <b-form-input
                                  id="input-lg"
                                  style="width: 100%"
                                  v-model="project.email"
                                ></b-form-input>
                              </b-col>
                            </b-row>
                          </b-col>
                        </b-row>
                        <div class="infoTitle">
                          <span class="midText" style="font-weight: bold"
                            >參數設置</span
                          >
                        </div>
                        <b-row>
                          <b-col cols="6">
                            <span style="color: black">發文預設單位：</span>
                            <b-form-input
                              id="input-lg"
                              style="width: 100%"
                              v-model="PCM.issuer"
                            ></b-form-input>
                            <span style="color: black">發文預設字號：</span>
                            <b-form-input
                              id="input-lg"
                              style="width: 100%"
                              v-model="PCM.issue_text_number"
                            ></b-form-input>
                            <span style="color: black">輸出Title：</span>
                            <b-form-input
                              id="input-lg"
                              style="width: 100%"
                              v-model="PCM.title"
                            ></b-form-input>
                          </b-col>
                          <b-col cols="6">
                            <span style="color: black">發文限辦天數：</span>
                            <b-form-input
                              id="input-lg"
                              style="width: 100%"
                              v-model="PCM.issueHandlingDay"
                            ></b-form-input>
                            <span style="color: black">收文限辦天數：</span>
                            <b-form-input
                              id="input-lg"
                              style="width: 100%"
                              v-model="PCM.receiveHandlingDay"
                            ></b-form-input>
                            <span style="color: black"
                              >輸出書函時，內部存檔用之名稱：</span
                            >
                            <b-form-input
                              id="input-lg"
                              style="width: 100%"
                              v-model="PCM.outputFileName"
                            ></b-form-input>
                          </b-col>
                        </b-row>
                      </b-collapse>
                    </div>
                  </b-card>
                  <b-card no-body class="mb-1" id="CSControl">
                    <b-button v-b-toggle="`CS-${index}`" block class="btn_module">
                      監造工務管理
                    </b-button>
                    <b-form-checkbox
                      v-model="CS.checked"
                      name="check-button"
                      switch
                    >
                      <b
                        ><span v-if="CS.checked">已開啟</span>
                        <span v-else>已關閉</span></b
                      >
                    </b-form-checkbox>
                    <b-collapse
                      :id="`CS-${index}`"
                      style="padding: 0 15px 15px 15px"
                      class="mt-2"
                    >
                      <div class="infoTitle">
                        <span class="midText" style="font-weight: bold"
                          >標案資料</span
                        >
                      </div>
                      <b-row style="margin-top: 10px">
                        <b-col cols="6">
                          <span style="color: black">主辦部門：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.organizer"
                          ></b-form-input>
                          <span style="color: black">主辦工程師：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.organizerEngineer"
                          ></b-form-input>
                          <span style="color: black">工程地點：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.address"
                          ></b-form-input>
                        </b-col>
                        <b-col cols="6">
                          <span style="color: black">聯絡人：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.contactPerson"
                          ></b-form-input>
                          <span style="color: black">聯絡電話：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.contactNumber"
                          ></b-form-input>
                          <span style="color: black">電子郵件：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.email"
                          ></b-form-input>
                        </b-col>
                      </b-row>
                      <div class="infoTitle">
                        <span class="midText" style="font-weight: bold"
                          >參數設置</span
                        >
                      </div>
                      <b-row>
                        <b-col cols="6">
                          <span style="color: black">發文預設單位：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="CS.issuer"
                          ></b-form-input>
                          <span style="color: black">發文預設字號：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="CS.issue_text_number"
                          ></b-form-input>
                          <span style="color: black">輸出Title：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="CS.title"
                          ></b-form-input>
                        </b-col>
                        <b-col cols="6">
                          <span style="color: black">發文限辦天數：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="CS.issueHandlingDay"
                          ></b-form-input>
                          <span style="color: black">收文限辦天數：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="CS.receiveHandlingDay"
                          ></b-form-input>
                          <span style="color: black"
                            >輸出書函時，內部存檔用之名稱：</span
                          >
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="CS.outputFileName"
                          ></b-form-input>
                        </b-col>
                      </b-row>
                    </b-collapse>
                  </b-card>

                  <b-card no-body class="mb-1" id="OtherControl">
                    <b-button v-b-toggle="`Other-${index}`" block class="btn_module">
                      其他
                    </b-button>
                    <b-form-checkbox
                      v-model="Other.checked"
                      name="check-button"
                      switch
                    >
                      <b
                        ><span v-if="Other.checked">已開啟</span>
                        <span v-else>已關閉</span></b
                      >
                    </b-form-checkbox>
                    <b-collapse
                      :id="`Other-${index}`"
                      style="padding: 0 15px 15px 15px"
                      class="mt-2"
                    >
                      <div class="infoTitle">
                        <span class="midText" style="font-weight: bold"
                          >標案資料</span
                        >
                      </div>
                      <b-row style="margin-top: 10px">
                        <b-col cols="6">
                          <span style="color: black">主辦部門：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.organizer"
                          ></b-form-input>
                          <span style="color: black">主辦工程師：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.organizerEngineer"
                          ></b-form-input>
                          <span style="color: black">工程地點：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.address"
                          ></b-form-input>
                        </b-col>
                        <b-col cols="6">
                          <span style="color: black">聯絡人：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.contactPerson"
                          ></b-form-input>
                          <span style="color: black">聯絡電話：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.contactNumber"
                          ></b-form-input>
                          <span style="color: black">電子郵件：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="project.email"
                          ></b-form-input>
                        </b-col>
                      </b-row>
                      <div class="infoTitle">
                        <span class="midText" style="font-weight: bold"
                          >參數設置</span
                        >
                      </div>
                      <b-row>
                        <b-col cols="6">
                          <span style="color: black">發文預設單位：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="Other.issuer"
                          ></b-form-input>
                          <span style="color: black">發文預設字號：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="Other.issue_text_number"
                          ></b-form-input>
                          <span style="color: black">輸出Title：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="Other.title"
                          ></b-form-input>
                        </b-col>
                        <b-col cols="6">
                          <span style="color: black">發文限辦天數：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="Other.issueHandlingDay"
                          ></b-form-input>
                          <span style="color: black">收文限辦天數：</span>
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="Other.receiveHandlingDay"
                          ></b-form-input>
                          <span style="color: black"
                            >輸出書函時，內部存檔用之名稱：</span
                          >
                          <b-form-input
                            id="input-lg"
                            style="width: 100%"
                            v-model="Other.outputFileName"
                          ></b-form-input>
                        </b-col>
                      </b-row>
                    </b-collapse>
                  </b-card>
                </div>
              </div>
            </div> -->
        <!-- </div> -->
        <!-- </b-col> -->
      </b-row>
    </div>
  </div>
</template>

<script>
import { mapActions, mapState } from 'vuex'
export default {
  data () {
    return {
      backgroundImg: require('../../assets/png/000.png'),
      projectList: [],
      project: [],
      aaa: false,
      bbb: false,
      ccc: false,
      projectListTest: [
        {
          tender: '',
          tenderNumber: '',
          PCM: {
            group: 'PCM',
            issuer: '',
            issue_text_number: '',
            title: '',
            issueHandlingDay: '',
            receiveHandlingDay: '',
            outputFileName: '',
            checked: false
          },
          CS: {
            group: 'CS',
            issuer: '',
            issue_text_number: '',
            title: '',
            issueHandlingDay: '',
            receiveHandlingDay: '',
            outputFileName: '',
            checked: false
          },
          Other: {
            group: 'Other',
            issuer: '',
            issue_text_number: '',
            title: '',
            issueHandlingDay: '',
            receiveHandlingDay: '',
            outputFileName: '',
            checked: false
          }
        }
      ],
      PCM: {
        group: 'PCM',
        issuer: '',
        issue_text_number: '',
        title: '',
        issueHandlingDay: '',
        receiveHandlingDay: '',
        outputFileName: '',
        checked: false
      },
      CS: {
        group: 'CS',
        issuer: '',
        issue_text_number: '',
        title: '',
        issueHandlingDay: '',
        receiveHandlingDay: '',
        outputFileName: '',
        checked: false
      },
      Other: {
        group: 'Other',
        issuer: '',
        issue_text_number: '',
        title: '',
        issueHandlingDay: '',
        receiveHandlingDay: '',
        outputFileName: '',
        checked: false
      }
    }
  },
  methods: {
    enterProject () {
      this.$router.push({ name: 'Dashboard' })
    },
    ...mapActions('project', ['createProject', 'addProjectRoleParamSetting']),
    addProject () {
      var wasNull = false
      if (
        this.project.name === '' ||
        this.project.number === '' ||
        this.project.organizer === '' ||
        this.project.organizerEngineer === '' ||
        this.project.address === '' ||
        this.project.owner === '' ||
        this.project.ownerAddress === '' ||
        this.project.contactPerson === '' ||
        this.project.contactNumber === '' ||
        this.project.email === '' ||
        this.project.tender === ''
      ) {
        wasNull = true
      }
      if (wasNull) alert('尚有內容未填!')
      else {
        var yes = confirm('確定新增專案?')
        if (yes) {
          if (this.project._id === undefined) {
            this.createProject()
          }
          alert('新增專案成功！')
          this.$router.push({ name: 'Dashboard' })
        } else {
          alert('取消新增')
        }
      }
    },
    addNewTender () {
      this.projectListTest.push({
        tender: '',
        tenderNumber: '',
        PCM: {
          group: 'PCM',
          issuer: '',
          issue_text_number: '',
          title: '',
          issueHandlingDay: '',
          receiveHandlingDay: '',
          outputFileName: '',
          checked: false
        },
        CS: {
          group: 'CS',
          issuer: '',
          issue_text_number: '',
          title: '',
          issueHandlingDay: '',
          receiveHandlingDay: '',
          outputFileName: '',
          checked: false
        },
        Other: {
          group: 'Other',
          issuer: '',
          issue_text_number: '',
          title: '',
          issueHandlingDay: '',
          receiveHandlingDay: '',
          outputFileName: '',
          checked: false
        }
      })
    },
    deleteTender (index) {
      this.projectListTest.splice(index, 1)
    }
  },
  computed: {
    ...mapState({
      currentUser: (state) => state.user.current
    })
  }
}
</script>

<style lang="scss" scoped >
.container {
  border-radius: 15px;
}
.project-group {
  width: 800px;
  height: 250px;
  background-color: white;
  border-radius: 10%;
  border-style: solid;
  border-width: 3px;
  border-color: rgb(163, 163, 163);
  margin-left: 3%;
  margin-top: 3%;
  padding-top: 15px;
}
.btn {
  background-color: rgb(75, 102, 255);
  font-size: 20px;
  padding-left: 13px;
  padding-right: 13px;
  padding-top: 7px;
  padding-bottom: 7px;
  color: #ffffff;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
  border: none;
}
.btn:hover {
  color: rgb(255, 255, 255);
  background-color: rgb(49, 68, 175);
  transform: translateY(0);
}
.btn_module {
  background-color: rgb(75, 102, 255);
  font-size: 16px;
  color: #ffffff;
}
.btn_title {
  background-color: #1d325f;
  font-size: 40px;
  padding-left: 13px;
  padding-right: 13px;
  padding-top: 7px;
  padding-bottom: 7px;
  color: white;
  margin-left: 70px;
}
.infoTitle {
  position: relative;
  margin-top: 20px;
  margin-bottom: 20px;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
  height: 2px;
  background-color: #1d325f;
  text-align: center;
  font-size: 20px;
  color: #1d325f;
}
.midText {
  position: absolute;
  left: 50%;
  background-color: #ffffff;
  padding: 0 10px 0 10px;
  transform: translateX(-50%) translateY(-50%);
}
</style>
