編寫專案展示頁

1.這是專案的資料模型

class tb_projs(models.Model):
    projID=models.AutoField(primary_key=True,verbose_name="作品ID")
    title=models.CharField(max_length=24,db_index=True,verbose_name="作品名")
    abstract=models.CharField(max_length=140,verbose_name="作品簡介")
    uploaded=models.DateTimeField(verbose_name="作品釋出時間"
 
)
    imgsURL=models.URLField(verbose_name="作品圖集")
    gitURL=models.URLField(verbose_name="作品GitHubURL")

2.功能需求

  1.imgsURL是作品圖集static/www/projImgs
  2.該頁面提供一個相簿效果，相片是各個專案的照片之一，下面是名字。
  3.相片的URL根據imgsURL和img的Id及照片編號來構造，例如…/projImgs/Id_1.jpg。
  4.每個專案提供5張照片，首頁編號為1。
  5.專案名字的URL跳轉到專案的github地址上去。專案圖片跳轉到圖冊，裡面有專案的5張照片圖冊和簡介及名字。
  6.上傳的照片會被按順序重新命名,eg:1_1.jpg，1_5.jpg，2_1.jpg…然後傳入指定資料夾。

3.大致思路

 1.專案釋出頁

  1.共4項要填寫，專案名稱，專案簡介，上傳圖片，gitURL。上傳圖片我打算用django的ImageField，並且不打算使用批量上傳外掛，所以得在表單裡建立5個圖片上傳項。

class ProjForm(forms.Form):
  title=forms.CharField()
  abstract=forms.CharField(max_length=140)
  gitURL=forms.URLField()
  img1=forms.ImageField()
  img2=forms.ImageField()
  img3=forms.ImageField
 
()
  img4=forms.ImageField()
  img5=forms.ImageField()

  2.在表單頁填好資訊，傳遞給View層，View裡呼叫form_valid，函式裡實現裡構造好tb_projs物件，儲存物件，儲存圖片。在官方手冊查閱了File類實現檔案儲存後，寫出如下程式碼

class ProjPublishView(FormView):
    template_name="www/proj_publish_base.html"
    form_class=ProjForm
    absolute_path='/virEnv/mysite/www/static/'
    def form_valid(self,form):
        if form.is_valid():
            data=form.cleaned_data
            title=data['title']
            abstract=data['abstract']
            uploaded=datetime.datetime.now()
            gitURL=data['gitURL']
            imgsURL=www/projImgs'
            proj=tb_projs(title=title,abstract=abstract,uploaded=uploaded,imgsURL=imgsURL,gitURL=gitURL)
            proj.save()
            img1_path=self.absolute_path+imgsURL+'/'+str(proj.projID)+'_1.jpg'
            self.handle_uploaded_img(self.request.FILES['img1'],img1_path)
            img2_path=self.absolute_path+imgsURL+'/'+str(proj.111
            111projID)+'_2.jpg'
            self.handle_uploaded_img(self.request.FILES['img2'],img2_path)
            img3_path=self.absolute_path+imgsURL+'/'+str(proj.projID)+'_3.jpg'
            self.handle_uploaded_img(self.request.FILES['img3'],img3_path)
            img4_path=self.absolute_path+imgsURL+'/'+str(proj.projID)+'_4.jpg'
            self.handle_uploaded_img(self.request.FILES['img4'],img4_path)
            img5_path=self.absolute_path+imgsURL+'/'+str(proj.projID)+'_5.jpg'
            self.handle_uploaded_img(self.request.FILES['img5'],img5_path)
        return super(ProjPublishView,self).form_valid(form)

    def handle_uploaded_img(self,f,path):
        with open(path,'wb+') as destination:
            for chunk in f.chunks():
                destination.write(chunk)

    def get_success_url(self):
        #success_url=reverse('www:projList',kwargs={'page':1})
        success_url=reverse('www:indexView')
        return success_url

 2.驗證結果

  1.上傳頁面

  2.資料庫檢視

  3.資料夾下檢視檔案

 3.專案展示頁

  1.專案展示頁使用的是ListView,繫結的model是tb_projs.預設返回context就是全部的tb_projs.objects
  2.效果如下

  3.編寫html模板時使用了get_static_prefix以及divisibleby

<img src="{% get_static_prefix %}{{o.imgsURL}}/{{o.projID}}_1.jpg"
alt="{{p.title}}" class="img-responsive">

{% if forloop.counter|divisibleby:'4' == False and forloop.counter|divisibleby:'2' %}
<div class="clearfix visible-xs-block"></div>
{% endif %}{% if forloop.counter|divisibleby:'4' %}
<div class="clearfix visible-xs-block"></div>
{% endif %}

 4.專案詳細頁

  1.專案詳細頁使用DetailView,繫結的model是tb_projs。get_object()裡使用objects.get()來根據id過濾。get_context_data()直接返回context
  2.效果如下