decorate rate page

 

rate page(เก่า)

 

 rate page(ใหม่)

 

    จากตอนแรกใช้ bootstrap ตกแต่งแล้วดูไม่ค่อยสวยซักเท่าไหร่ จึงลองมาใช้เป็น table แทน และในส่วนของการคอมเม้น ใช้ textarea เพื่อให้ผู้ใช้สามารถใช้ได้สะดวกขึ้น

Commit meaning

first commit
    - เริ่มสร้างไฟล์งานโปรเจค

make home page page
    - สร้างหน้า home page ที่ใช้เลือกคนขับ taxi

make rage page
    - สร้างหน้า rage page เพื่อที่ผู้ใช้จะสามารถให้คะแนนคนขับแต่ละคนได้

can rate cab driver
    - ผู้ใช้สามารถให้คะแนนคนขับและนำไปเก็บในฐานข้อมูลได้

make thank page, make login page
    - สร้างหน้า ขอบคุณหลังใช้เสร็จ และกลับไปที่หน้าแรก
    - สร้างหน้า login

complate functional test, decorate with bootstrap
    - เปลี่ยนจากการกดเลือกคนขับเป็นการเลือกเป็นการพิมพ์ชื่อหา
    - เขียน functional test เสร็จ
    - ตกแต่งหน้าเว็บด้วย bootstrap


add about page
    - สร้างหน้าที่บอกถึงความสามารถของ app

change about button location
    - เปลี่ยนตำแหน่งปุ่ม about ในหน้า login

fix login & sign in page to inheritance template
    - ในหน้า log in และ หน้า sign in มีรูปแบบคล้ายกัน จึงเปลี่ยนมาใช้แบบ inheritance 
    template

change word on button
    - เปลี่ยนคำบนปุ่มในหน้า sign in page

add comment in code
    - คอมเม้นถึงการทำงานของแต่ละบรรทัด

decorate rate page
    - ตกแต่งหน้า rate ให้มีความดูดีขึ้น

inheritance templates

    เราได้นำโค้ด html ของ login page และ sign in page มาเทียบกันแล้ว โค้ดมีหน้าตาที่คล้ายกัน

 login.html

 signin.html

     เพื่อให้เป็นการประหยัดเวลาในการเขียนโค้ด เราจึงสร้าง file หลัก ที่เป็นต้นแบบให้กับ login.html

 และ signin.html ซึ่งผมตั้งชื่อ file นี้ว่า id_pass_input_b.html

 

id_pass_input_b.html

    จากที่เห็น เราจะใส่เป็นตัว {% block ... %}{% endblock %} ซึ่งเราเรียกว่า block เพื่อที่เราจะได้ใส่ส่วนที่ต่างกันลงใน block

login.html

 

 signin.html

    เราจะสามารถใช้ file หลักได้ เราจะต้องใช้
       {% extends ' directory ' %}
    เราจึงจะสามารถโหลดไฟล์หลักมาใช้ได้ จากนั้น เราก็ใส่โค้ดตามที่เราต้องการลงใน block ตามที่เราต้องการได้
    
   

เมื่อใช้ bootstrap กับ app และการเพิ่ม comment ในหน้า rate page

Log in page

                 
                                      Home page

Rate page 

Sign in page

 

     เพิ่มในส่วนของ comment เข้ามาเพื่อที่ลูกค้าจะได้สามารถติชมคนขับแท๊กซี่ได้

    
จึงเพิ่ม attribute ใน class DriverHistory ชื่อ comment เพื่อที่จะใช้เก็บข้อมูลในส่วนนี้ได้

Rate Your Cab part2

    เพิ่มหน้า sign page ขึ้นมาเพื่อที่จะให้ผู้ใช้ ที่ยังไม่เคยใช้เข้ามาสมัครก่อน แล้วจึงจะ log in เข้าไปในหน้า homepage ได้

  

 

     เปลี่ยนการเก็บคะแนนจากเมื่อครั้งที่แล้วโดยครั้งนี้จะนำการให้คะแนนทุกครั้งมาหาค่าเฉลี่ย แล้วจึงเก็บเป็นคะแนนของแต่ละคน

     จากครั้งที่แล้วเป็น sild down input เป็น radion input input

 

    

Rate Your Cab part3

    เปลี่ยนจากเลือกคนขับโดยการคลิ้ก เป็นเลือกโดยใช้เป็นการใส่ชื่อลงไป เพื่อเป็นการเจาะจงว่าต้องการที่จะให้คะแนนคนขับคนนั้น

 

     User Story

         1.มานีได้ยินเกี่ยวกับแอพนี้จึงลองเปิดขึ้นมาดู

         2.เธอเปิดมาเจอหน้า log in

         3.เธอใส่ชื่อและรหัส

         4.เธอพิมพ์หาชื่อ สมหมาย

         5.เธอให้คะแนนสมหมาย 4 ดาว

         6.เธอกดกลับไปที่หน้า log in

         7.Don goes to the sign in page

         8.He insert his name and password

         9.He click back to the login page

        

   

Rate Your Cab part1

Log In


Home Page


Rate Page


Thank Page


ภายใน view.py มีทั้งหมด 4 method

• callLogInPage
• callHomePage
• callRatePage
• savePoint

callLoginPage method

    เรียกหน้า Log In ขึ้นมา

callHomePage method

    เมื่อผู้ใช้ Log In เข้ามาแล้ว ใน method นี้จะ เทียบชื่อผู้ใช้กับฐานข้อมูล จากนั้นจึงเทียบรหัสกับฐานข้อมูลอีกที แล้วจึงเรียกหน้า homepage

callRatePage method
    หลังจากที่ผู้ใช้เลือกคนขับแล้วจะเรียกหน้า Rate Page ขึ้นมา

savePoint method
    หลังจากที่ผู้ใช้ให้คะแนนคนขับ taxi แล้วจะนำมารวมกับคะแนนก่อนหน้าโดยดึงเอาจาก point ที่อยู่ใน CabDriver แล้วจึงหาร 2 แล้วเก็บเข้าไปใหม่ แล้วจึงเรียกหน้า thank page ขึ้นมา

มีทั้งหมด 4 template

• login.html
• home.html
• rate_page.html
• thank_page.html