|
@@ -1,155 +1,36 @@
|
|
|
-
|
|
|
-<ion-header>
|
|
|
+<ion-header [translucent]="true">
|
|
|
<ion-toolbar>
|
|
|
- <ion-title>发布信息</ion-title>
|
|
|
+ <!-- <ion-title>首页</ion-title> -->
|
|
|
+ <ion-searchbar [(ngModel)]="searchTitle" (ionChange)="searchItems()"></ion-searchbar>
|
|
|
+ <ion-buttons slot="end">
|
|
|
+ <ion-button (click)="sortItemsByAmount()">按金额排序</ion-button>
|
|
|
+ <ion-button routerLink="./tab4" >发布</ion-button>
|
|
|
+ </ion-buttons>
|
|
|
</ion-toolbar>
|
|
|
</ion-header>
|
|
|
|
|
|
-<ion-content padding>
|
|
|
-
|
|
|
- <ion-item>
|
|
|
- <ion-label>选择活动类型</ion-label>
|
|
|
- <ion-select [(ngModel)]="selectedType" (ionChange)="onChangeActivityType()">
|
|
|
- <ion-select-option value="help">求助</ion-select-option>
|
|
|
- <ion-select-option value="product">二手物品</ion-select-option>
|
|
|
- <ion-select-option value="event">活动</ion-select-option>
|
|
|
- <ion-select-option value="lostFound">失物招领</ion-select-option>
|
|
|
- </ion-select>
|
|
|
- </ion-item>
|
|
|
-
|
|
|
- <!-- 求助表单 -->
|
|
|
- <ng-container *ngIf="selectedType === 'help'">
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">标题</ion-label>
|
|
|
- <ion-input [(ngModel)]="help.title" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">内容</ion-label>
|
|
|
- <ion-textarea [(ngModel)]="help.content" required></ion-textarea>
|
|
|
- </ion-item>
|
|
|
- </ng-container>
|
|
|
-
|
|
|
- <!-- 二手物品表单 -->
|
|
|
- <ng-container *ngIf="selectedType === 'product'">
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">产品名称</ion-label>
|
|
|
- <ion-input [(ngModel)]="product.name" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">金额</ion-label>
|
|
|
- <ion-input type="number" [(ngModel)]="product.amount" required></ion-input>
|
|
|
- </ion-item>
|
|
|
-
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">地点</ion-label>
|
|
|
- <ion-input [(ngModel)]="product.location" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">图片上传</ion-label>
|
|
|
- <ion-input type="file" (change)="onProductImageSelected($event)" accept="image/*"></ion-input>
|
|
|
- </ion-item>
|
|
|
- </ng-container>
|
|
|
-
|
|
|
-
|
|
|
- <!-- 失物招领表单 -->
|
|
|
- <ng-container *ngIf="selectedType === 'lostFound'">
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">物品名称</ion-label>
|
|
|
- <ion-input [(ngModel)]="lostFound.itemName" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label>丢失/拾取</ion-label>
|
|
|
- <ion-select [(ngModel)]="lostFound.status" required>
|
|
|
- <ion-select-option value="lost">丢失</ion-select-option>
|
|
|
- <ion-select-option value="found">拾取</ion-select-option>
|
|
|
- </ion-select>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">地点</ion-label>
|
|
|
- <ion-input [(ngModel)]="lostFound.location" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">大致时间</ion-label>
|
|
|
- <ion-input type="datetime-local" [(ngModel)]="lostFound.time" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">备注</ion-label>
|
|
|
- <ion-textarea [(ngModel)]="lostFound.remarks"></ion-textarea>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">图片上传</ion-label>
|
|
|
- <ion-input type="file" (change)="onLostFoundImageSelected($event)" accept="image/*"></ion-input>
|
|
|
- </ion-item>
|
|
|
- </ng-container>
|
|
|
-
|
|
|
- <!-- 活动表单 -->
|
|
|
- <ng-container *ngIf="selectedType === 'event'">
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">活动名称</ion-label>
|
|
|
- <ion-input [(ngModel)]="event.name" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">可参与对象</ion-label>
|
|
|
- <ion-input [(ngModel)]="event.participants" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">开始时间</ion-label>
|
|
|
- <ion-input type="datetime-local" [(ngModel)]="event.startTime" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">持续时长</ion-label>
|
|
|
- <ion-input type="number" [(ngModel)]="event.duration" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">地点</ion-label>
|
|
|
- <ion-input [(ngModel)]="event.location" required></ion-input>
|
|
|
- </ion-item>
|
|
|
- <ion-item>
|
|
|
- <ion-label position="floating">备注</ion-label>
|
|
|
- <ion-textarea [(ngModel)]="event.remarks"></ion-textarea>
|
|
|
- </ion-item>
|
|
|
- </ng-container>
|
|
|
-
|
|
|
- <ion-button expand="block" (click)="submitForm()">发布</ion-button>
|
|
|
-
|
|
|
- <!-- 提交后显示的信息 -->
|
|
|
- <ion-card *ngIf="submitted">
|
|
|
- <ion-card-header>
|
|
|
- 已发布信息
|
|
|
+<ion-content>
|
|
|
+ <ion-segment [(ngModel)]="selectedCategory" (ionChange)="filterItemsByCategory(selectedCategory)">
|
|
|
+ <ion-segment-button value="求助" (ionSelect)="filterItemsByCategory('求助')">求助</ion-segment-button>
|
|
|
+ <ion-segment-button value="二手交易" (ionSelect)="filterItemsByCategory('二手交易')">二手交易</ion-segment-button>
|
|
|
+ <ion-segment-button value="失物招领" (ionSelect)="filterItemsByCategory('失物招领')">失物招领</ion-segment-button>
|
|
|
+ <ion-segment-button value="活动" (ionSelect)="filterItemsByCategory('活动')">活动</ion-segment-button>
|
|
|
+ </ion-segment>
|
|
|
+
|
|
|
+ <ion-card *ngFor="let item of itemsList" [routerLink]="getDetailPageLink(item)">
|
|
|
+ <ion-card-header *ngIf="item.get('category') === selectedCategory || !selectedCategory">
|
|
|
+ <ion-card-title>{{ item.title }}</ion-card-title>
|
|
|
</ion-card-header>
|
|
|
<ion-card-content>
|
|
|
- <p><strong>类型:</strong> {{ selectedType }}</p>
|
|
|
- <!-- 根据类型显示不同的表单项内容 -->
|
|
|
- <ng-container *ngIf="selectedType === 'help'">
|
|
|
- <p><strong>标题:</strong> {{ help.title }}</p>
|
|
|
- <p><strong>内容:</strong> {{ help.content }}</p>
|
|
|
- </ng-container>
|
|
|
- <ng-container *ngIf="selectedType === 'product'">
|
|
|
- <p><strong>产品名称:</strong> {{ product.name }}</p>
|
|
|
- <p><strong>金额:</strong> {{ product.amount }}</p>
|
|
|
- <p><strong>时间:</strong> {{ product.time }}</p>
|
|
|
- <p><strong>地点:</strong> {{ product.location }}</p>
|
|
|
- <p><strong>图片:</strong> <img [src]="productImageUrl" width="200"></p>
|
|
|
- </ng-container>
|
|
|
- <ng-container *ngIf="selectedType === 'lostFound'">
|
|
|
- <p><strong>物品名称:</strong> {{ lostFound.itemName }}</p>
|
|
|
- <p><strong>状态:</strong> {{ lostFound.status }}</p>
|
|
|
- <p><strong>地点:</strong> {{ lostFound.location }}</p>
|
|
|
- <p><strong>大致时间:</strong> {{ lostFound.time }}</p>
|
|
|
- <p><strong>备注:</strong> {{ lostFound.remarks }}</p>
|
|
|
- <p><strong>图片:</strong> <img [src]="lostFoundImageUrl" width="200"></p>
|
|
|
- </ng-container>
|
|
|
- <ng-container *ngIf="selectedType === 'event'">
|
|
|
- <p><strong>活动名称:</strong> {{ event.name }}</p>
|
|
|
- <p><strong>可参与对象:</strong> {{ event.participants }}</p>
|
|
|
- <p><strong>开始时间:</strong> {{ event.startTime }}</p>
|
|
|
- <p><strong>持续时长:</strong> {{ event.duration }}</p>
|
|
|
- <p><strong>地点:</strong> {{ event.location }}</p>
|
|
|
- <p><strong>备注:</strong> {{ event.remarks }}</p>
|
|
|
- </ng-container>
|
|
|
+ <div class="item-container">
|
|
|
+ <ion-avatar class="avatar-container">
|
|
|
+ <ion-img [src]="item.get('headImage')" alt="头像"></ion-img>
|
|
|
+ </ion-avatar>
|
|
|
+ <div class="info-container">
|
|
|
+ <p class="publisher">{{item.get("publisher")}}</p>
|
|
|
+ <h2 class="title">{{item.get("title")}}</h2>
|
|
|
+ <p *ngIf="(selectedCategory === '二手交易' || item.get('category') === '二手交易') && item.get('amount')" class="amount">¥{{item.get("amount")}}</p>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
</ion-card-content>
|
|
|
- </ion-card>
|
|
|
-
|
|
|
-</ion-content>
|
|
|
-
|
|
|
-
|
|
|
+ </ion-card>
|