Tiktok practice ~ public / private short video interchange

One 、 Demand analysis

1. Public to private ~ flow chart

2. Public to private ~ Process brief

• 1. Recommend from the home page ~ Short video list watch a short video
• 2. Click the right side of the short video to share
• 3. Choose to be private
• 4. Home page recommendation ~ There is no private video in the short video list
• 5. The video goes to the personal center ~ Private video list

3. Private to public ~ flow chart

4. Private to public ~ Process brief

• 1. From the personal Center ~ Private video list , Click a short video to enter the details of the short video
• 2. Click the right side of the short video to share
• 3. Select make public
• 4. Home page recommendation ~ Refresh in the short video list , You can see the short video that has just been made public

Two 、 Code combat

• front end

2.1. Public to private

//  Users change public video to private video 
			changeVlogToPrivate() {
    
				var vlogId = this.thisVlogId;
				var me = this;
				var userId = getApp().getUserInfoSession().id;
				var serverUrl = app.globalData.serverUrl;
				uni.request({
    
					method: "POST",
					header: {
    
						headerUserId: userId,
						headerUserToken: app.getUserSessionToken()
					},
					url: serverUrl + "/vlog/changeToPrivate?userId=" + userId + "&vlogId=" + vlogId,
					success(result) {
    
						console.log(result);
						
						if (result.data.status == 200) {
    
							uni.showToast({
    
								title: " Setup complete ~"
							})
						}
					}
				});
				
			}

2.2. Private to public

	//  Users change private video to public video 
			changeVlogToPublic() {
    
				var vlogId = this.thisVlogId;
				var me = this;
				var userId = getApp().getUserInfoSession().id;
				var serverUrl = app.globalData.serverUrl;
				uni.request({
    
					method: "POST",
					header: {
    
						headerUserId: userId,
						headerUserToken: app.getUserSessionToken()
					},
					url: serverUrl + "/vlog/changeToPublic?userId=" + userId + "&vlogId=" + vlogId,
					success(result) {
    
						console.log(result);
						
						if (result.data.status == 200) {
    
							uni.showToast({
    
								title: " Setup complete ~"
							})
						}
					}
				});
			}

• Back end

2.3. Public to private

 /**
     *  Users change the video to public / Private video 
     *
     * @param userId  With the head of the household key ID
     * @param vlogId  Video primary key ID
     * @return
     */
    @PostMapping("changeToPublic")
    public GraceJSONResult changeToPublic(@RequestParam String userId,
                                          @RequestParam String vlogId) {
    
        vlogService.changeToPrivateOrPublic(userId,
                vlogId,
                YesOrNo.NO.type);
        return GraceJSONResult.ok();
    }

2.4. Short video details

List video click one to jump to short video details , The principle is the same as that of the short video list on the home page and the short video list search , It uses an interface

2.5. Private to public

/**
     *  Users change the video to public / Private video 
     *
     * @param userId  With the head of the household key ID
     * @param vlogId  Video primary key ID
     * @return
     */
    @PostMapping("changeToPrivate")
    public GraceJSONResult changeToPrivate(@RequestParam String userId,
                                           @RequestParam String vlogId) {
    
        vlogService.changeToPrivateOrPublic(userId,
                vlogId,
                YesOrNo.YES.type);
        return GraceJSONResult.ok();
    }

3、 ... and 、 Appreciation of works

3.1. Public short video to private

• Short video recommended on the home page
  

• Sharing turns private
  

3.2. Private short video to public

• Personal center private short video list
  

• Short video details
  
  Private to public
  

• Recommended short videos on the home page , After drop-down refresh , There is more private to public video