不懂要麼樣去更改，HelloWorld.vue、TheWElcome.vue內容

[brian076269]

我是個Vue新手，試著自己練習，要如何去更改HelloWorld.vue、TheWElcome.vue程式碼

底下是app.vue程式碼

<script> export default { name: "App", }; </script>

楊梅物流中心

訪客車輛資訊

-區域詳細資訊

訪客預約登記

訪客預約紀錄

-已預約未進場車輛

-未來時段預約紀錄

-訪客預約類別

車輛進出紀錄

閘道控制選單

承租公司設定

貨運公司設定

車輛設定

使用者設定

使用者群組

使用者權限

使用紀錄

車輛進出紀錄

車牌號碼 Ac-2345	預約樓層 3F	拜訪公司 B公司
車輛類別 契約車	車輛類型 貨車	駕駛人公司 C物流公司

      <div class="block-left">
        <h4>進場起始時間</h4>
        <datetime v-model="date" input-id="startDate">
          <input type="datetime-local" v-model="value" />
        </datetime>

        <h4>離場起始時間</h4>
        <datetime v-model="date" input-id="startDate">
          <input type="datetime-local" v-model="value" />
        </datetime>
      </div>

      <div class="block-right">
        <h4>進場結束時間</h4>
        <datetime v-model="date" input-id="startDate">
          <input type="datetime-local" v-model="value" />
        </datetime>

        <h4>離場結束時間</h4>
        <datetime v-model="date" input-id="startDate">
          <input type="datetime-local" v-model="value" />
        </datetime>
      </div>
      <div class="gwee">
      <button>搜尋</button>
      <button>取消</button>
      </div>

      <table class="record">
        <hr class="my-6">
        <div class="row">
          <thead>
            <tr>
              <th><input type="checkbox" id="checkAll"></th>
              <th>序</th>

              <th>車牌號碼</th>
              <th>車輛類別</th>
              <th>車輛類型</th>
              <th>駕駛人</th>
              <th>駕駛人公司</th>
              <th>預約樓層</th>
              <th>拜訪公司</th>
              <th>進場時間</th>
              <th>離場時間</th>
              <th>預約時間</th>
            </tr>
          </thead>
        </div>
      </table>
    </div>
  </div>

  <div class="right-section">
    <h3>楊梅物流中心</h3>
    <h4>車輛進出紀錄</h4>
    <img src="./assets/car.jpg" width="50" height="50" />
    <div class="adef">
      <h5>駕駛公司:A物流公司</h5>
      <h5>駕駛人:王先生</h5>
      <h5>車牌號碼:Ac-2345</h5>
      <h5>車種:貨車</h5>
      <h5>進場時間:2023/06/23 12:00</h5>
    </div>
  </div>

  <route-view />
</div>

<style> #app { font-family: "Avenir", Arial, Helvetica, sans-serif; -webkit-font-smoothing: antialiased; -moz-font-smoothing: grayscale; text-align: center; margin-bottom: 60px; } * { margin: 0; padding: 0; box-sizing: border-box; } body { margin: 0; padding: 0; } .container { display: flex; } .app { padding: 20px; border: 1px solid transparent; border-radius: 5px; background-color: rgb(202, 202, 202); } .left-section { background-color: rgb(202, 202, 202); width: 20%; } .center-section { background-color: #ffffff; flex-grow: 1; padding: 20px; } .right-section { background-color: #e0e0e0; width: 20%; } .left-section h2 { border-bottom: 1px solid black; padding-bottom: 5px; } .left-section h4 { border: none; background-color: transparent; padding: 0; cursor: pointer; font-size: inherit; color: inherit; width: auto; text-decoration: underline; } .right-section h4 { border-bottom: 1px solid black; padding-bottom: 5px; } .right-section img { float: left; } .adef { border-bottom: 1px solid black; padding-bottom: 5px; width: auto; font-size: 12px; } .right-section { float: right; } .box { padding: 20px; border: 1px solid transparent; border-radius: 5px; background-color: rgb(202, 202, 202); } .center-section table { width: 100%; border-collapse: collapse; } .center-section table tr, th { padding: 10px; text-align: center; } .block-left { text-align: left; display: inline-flex; } .block-right { text-align: right; display: inline-flex; } .gwee { display: flex; align-items: center; justify-content: center; border-bottom: 1px solid black; padding-bottom: 5px; } .record { width: 100%; margin-bottom: 20px; overflow-y: auto; max-height: 400px; border-collapse: collapse; } .record th, .record td { border: 1px solid #ddd; text-align: center; padding: 8px; } th input[type="checkbox"] { margin-right: 5px; } .record th { background-color: #f2f2f2; } </style>

[wi1d1337]

没太看懂你的需求是啥，vue是个前端框架，不同于像python、java之类的语言，单个的HELLOWORLD.vue没有什么意义，你可以先阅读下vue的官方文档，这是简中的文档，我不知道有没有繁中的https://cn.vuejs.org/guide/introduction.html
这个里面有在线的演练场可以供你练习代码

[brian076269]

我已經成成功了，謝謝 wi1d1337 ***@***.***> 於 2024年4月18日 週四 上午11:18寫道：

…

没太看懂你的需求是啥，vue是个前端框架，不同于像python、java之类的语言，单个的HELLOWORLD.vue没有什么意义，你可以先阅读下vue的官方文档，这是简中的文档，我不知道有没有繁中的 https://cn.vuejs.org/guide/introduction.html 这个里面有在线的演练场可以供你练习代码 — Reply to this email directly, view it on GitHub <#10470 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BD2BGP6POJGJ7VLNLNDBFATY543OTAVCNFSM6AAAAABEKF5R7OVHI2DSMVQWIX3LMV43SRDJONRXK43TNFXW4Q3PNVWWK3TUHM4TCNBZHEZTA> . You are receiving this because you authored the thread.Message ID: ***@***.***>