模块三：区块链应用系统开发
选手完成本模块的任务后，将任务中设计结果、运行代码、运行结果等截图粘贴至客户端桌面【区块链技术应用赛\重命名为工位号\模块三提交结果.docx】中对应的任务序号下。
任务3-1：区块链应用前端功能开发
1.请基于前端系统的开发模板，在注册组件Register.vue文件中添加对应的注册逻辑代码，实现对后端系统的注册功能，并测试功能完整性：
本题目的具体要求如下：
- 界面有明确的注册相关提示语
- 需要填写的项有组织名称、区块链地址、组织类型
- 页面需要有“返回”按钮，可以跳转到登录页面
- 点击“注册”按钮时需要检查区块链地址是否已输入
- 注册成功后跳转登录页面
Register.vue:
代码片段1：
<el-row>
<el-col :span="16" :offset="4">
<el-form label-width="100px">
<h3>选手填写部分</h3>
<el-form-item label="组织名称:">
<el-input type="primary" v-model="选手填写部分"></el-input>
</el-form-item>
<el-form-item label="区块链地址:">
<el-input type="primary" v-model="选手填写部分"></el-input>
</el-form-item>
<el-form-item label="组织类型:">
<el-radio-group v-model="orgType">
<el-radio :label="1">公司</el-radio>
<el-radio :label="2">银行</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-row style="padding-bottom:20px">
<el-button type="primary" 选手填写部分>注册</el-button>
<el-button type="primary" 选手填写部分>返回</el-button>
</el-row>
代码片段2：
register: function () {
if (this.address == "") {
alert(选手填写部分)
}else {
let postData = {
orgType: 选手填写部分,
username: 选手填写部分,
address:选手填写部分
}
// 和后端交互
选手填写部分
}
},
代码片段3：
goback: function () {
this.orgType = ''
this.username = ''
this.address = ''
选手填写部分
}
2.请基于前端系统的开发模板，在登录组件Login.vue文件中添加对应的登录逻辑代码，实现对后端系统的登录功能，并测试功能完整性：
本题目的具体要求如下：
- 界面有明确的登录相关提示语
- 需要填写的项有用户地址、组织类型
- 页面需要有“注册”按钮，可以跳转注册页面
- 点击“登录”按钮时需要检查各个表项是否已输入
- 登录成功后跳转首页，路径为“/home”
Login.vue:
代码片段1：
<el-col :span="16" :offset="4">
<el-form label-width="80px">
<h1>供应链金融应用</h1>
<h3>选手填写部分</h3>
<el-form-item label="用户地址:">
<el-input type="primary" v-model="选手填写部分"></el-input>
</el-form-item>
<el-form-item label="组织类型:">
<el-radio-group v-model="选手填写部分">
<el-radio :label="1">公司</el-radio>
<el-radio :label="2">银行</el-radio>
</el-radio-group>
</el-form-item>
</el-form>
</el-col>
</el-row>
<el-row style="margin-bottom: 20px">
<el-button type="primary" 选手填写部分>登录</el-button>
<el-button type="primary" 选手填写部分>注册</el-button>
</el-row> </el-row>
代码片段2：
login: function () {
if (this.address == "") {
alert("选手填写部分")
}else if (this.orgType == "") {
alert("选手填写部分")
}else {
let postData = {
orgType: 选手填写部分,
address: 选手填写部分
}
// 与后端交互
选手填写部分
}
},
代码片段3：
register: function () {
选手填写部分
},
3.请基于前端系统的开发模板，在公司组件Company.vue文件中添加对应的逻辑代码，实现对后端系统的公司相关业务功能，并测试功能完整性：
Company.vue:
代码片段1：
<el-row>
<el-col :span="20" :offset="2">
<el-table :data="companyList" style="font-size: 20px">
<el-table-column prop="address" label="账户地址"></el-table-column>
<el-table-column prop="name" label="公司名称"></el-table-column>
<el-table-column prop="amount" label="账户总额"></el-table-column>
<el-table-column label="查看详情">
<template slot-scope="scope">
<el-button type="primary" @click="选手填写部分">查询</el-button>
</template>
</el-table-column>
<el-table-column prop="receiptType" label="转账">
<template slot-scope="scope">
<el-button type="primary" @click="transfer(scope.row)">操作</el-button>
</template>
</el-table-column>
</el-table>
</el-col>
</el-row>
<el-row>
代码片段2：
<el-dialog title="公司详情" :visible.sync="dialogVisible">
<el-form label-width="100px">
<el-form-item label="账户地址:">
{ {选手填写部分 }}
</el-form-item>
<el-form-item label="公司名称:">
{ { 选手填写部分 }}
</el-form-item>
<el-form-item label="账户总额:">
{ { 选手填写部分 }}
</el-form-item>
</el-form>
代码片段3：
detail: function (queryAddress) {
this.dialogVisible = true
let address = 选手填写部分
this.axios.get(`选手填写部分?address=${address}&queryAddress=${queryAddress}`)
.then((response) => {
console.log(response)
if (response.data.code == 200) {
let inAddress = response.data.data.companyVO.address;
let inName = 选手填写部分;
let inAmount = response.data.data.companyVO.amount;
this.companyDetail = {
address: 选手填写部分,
name: 选手填写部分,
amount: 选手填写部分,
senderReceiptList: response.data.data.senderReceiptList,
accepterReceiptList: response.data.data.accepterReceiptList
}
} else {
alert(`请求内容有误, ${response.data.data}`)
}
})
},
4.请基于前端系统的开发模板，在银行组件Bank.vue文件中添加对应的逻辑代码，实现对后端系统的银行相关业务功能，并测试功能完整性：
Bank.vue:
代码片段1：
<el-row>
<el-dialog title="交易（发送凭证）页" :visible.sync="transDialogVisible" width="30%">
<el-form label-width="100px">
<el-form-item label="发送账户地址:">
{ {选手填写部分}}
</el-form-item>
<el-form-item label="接收账户地址:">
{ {选手填写部分}}
</el-form-item>
<el-form-item label="交易额:">
<el-col :span="16" :offset="4">
<el-input type="primary" v-model="选手填写部分"></el-input>
</el-col>
</el-form-item>
<el-form-item label="凭证类型:">
<el-select v-model="选手填写部分" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-form>
<el-row>
<el-button type="primary" size="medium" @click="选手填写部分">确定</el-button>
</el-row>
</el-dialog>
</el-row>
代码片段2：
executeTransaction: function() {
let funcName = "companyToBankReceipt";
if (this.transDetail.amount ==选手填写部分) {
alert('交易额不能为空！')
return
}
if (this.$cookies.get('orgType') == 选手填写部分) {
alert('银行不能给银行发送凭证！')
return
}
if (选手填写部分) {
alert("凭证发送账户和接收账户不能相一致！")
return
}
this.axios.post(`/finance/transaction/${funcName}`, 选手填写部分).then((response) => {
if (response.data.code == 200) {
alert('凭证发送成功')
this.query()
this.transDialogVisible = false
}else {
alert(`凭证发送失败, ${response.data.data}`)
}
})
},
任务3-2：区块链应用后端功能开发
1.开发区块链供应链金融应用中后端系统中用户功能模块对应的用户注册功能，根据前后代码补充最合适的代码，并测试功能完整性。
OrgServiceImpl.java：
/**
* 注册Service
* RegisterBO registerBO
* */
@Override
public Result<String> register(RegisterBO registerBO) {
if (StrUtil.isEmpty(选手填写部分) ||
StrUtil.isEmpty(选手填写部分) ||
registerBO.getOrgType() == 选手填写部分
) {
return Result.error(ResultVO.PARAM_EMPTY);
}
List funcParam = new ArrayList();
funcParam.add(选手填写部分);
funcParam.add(选手填写部分);
if(registerBO.getOrgType() == 2){
funcParam.add(BigInteger.valueOf(1000));
}
String funcName;
if(registerBO.getOrgType() == 2){
funcName =选手填写部分;
}else{
funcName =选手填写部分;
}
String _result = weBASEUtils.funcPost(OWNER_ADDRESS,funcName,funcParam);
JSONObject _resultJson = JSONUtil.parseObj(_result);
if (_resultJson.containsKey("statusOK") == false || _resultJson.getBool("statusOK") != true){ // _resultJson.getInt("code") > 0
return Result.error(ResultVO.选手填写部分);
}
return Result.success("ok");
}
2.开发区块链供应链金融应用中后端系统中用户功能模块对应的用户登录功能，根据前后代码补充最合适的代码，并测试功能完整性。
OrgServiceImpl.java:
/**
* 登录Service
* LoginBO loginBO
**/
@Override
public Result<String> login(@RequestBody LoginBO loginBO) {
if (StrUtil.isEmpty(loginBO.getAddress())
) {
return Result.error(ResultVO.PARAM_EMPTY);
}
List funcParam = new ArrayList();
funcParam.add(选手填写部分);
String funcName;
if(loginBO.getOrgType() == 2){
funcName =选手填写部分;
}else{
funcName =选手填写部分;
}
String _result = weBASEUtils.funcPost(选手填写部分,funcName,funcParam);
JSONArray _resultJson = JSONUtil.parseArray(_result);
if (StrUtil.isEmpty(_resultJson.get(0).toString())){
return Result.error(ResultVO.选手填写部分);
}
return Result.success("ok");
}
3.开发区块链供应链金融应用的后端系统中查询功能模块对应的查询所有公司信息功能，根据前后代码补充最合适的代码，并测试功能完整性。
QueryServiceImpl.java：
/**
* 获取所有公司数据，不包含存证详细信息
* */
@Override
public Result listCompany(String userAddress){
String _result = weBASEUtils.funcPost(userAddress,"getAllCompanyAddress",new ArrayList());
try {
JSONArray respArray = 选手填写部分;
String a = respArray.get(0).toString();
JSONArray addressArray = 选手填写部分;
List<CompanyVO> companyList = new ArrayList<>();
for(Object obj: addressArray) {
CompanyVO companyVO = 选手填写部分;
companyList.add(companyVO);
}
return Result.success(选手填写部分);
}catch (Exception e) {
ResultVO resultVO = ResultVO.CONTRACT_ERROR;
resultVO.setData(选手填写部分);
return Result.error(选手填写部分);
}
}
4.开发区块链供应链金融应用的后端系统中查询功能模块对应的查询银行凭证列表功能根据前后代码补充最合适的代码，并测试功能完整性。
QueryServiceImpl.java：
/**
* 获取包括银行详情，银行发送凭证列表，银行接收凭证列表
* */
@Override
public Result getBankEntity(String userAddress, String queryAddress){
BankVO bankVO = 选手填写部分;
List<ReceiptVO> senderReceiptList = 选手填写部分;
List<ReceiptVO> accepterReceiptList = 选手填写部分;
BankEntityVO bankEntityVO = new BankEntityVO();
bankEntityVO.setBankVO(选手填写部分);
bankEntityVO.setSenderReceiptList(选手填写部分);
bankEntityVO.setAccepterReceiptList(选手填写部分);
return Result.success(bankEntityVO);
}
5.开发区块链供应链金融应用的后端系统中交易功能模块对应的银行向公司交易凭证功能，根据前后代码补充最合适的代码，并测试功能完整性。
TransactionServiceImpl.java：
/**
* 公司向银行发送凭证（银行转账给公司）
* */
public Result<String> bankToCompanyReceipt(TransactionBO transactionBO) {
选手填写部分;
}
6.开发区块链供应链金融应用的后端系统中交易功能模块对应的公司向公司交易凭证功能，根据前后代码补充最合适的代码，并测试功能完整性。
TransactionServiceImpl.java：
/**
* 公司向公司的凭证发送
* */
public Result<String> companyToCompanyReceipt(TransactionBO transactionBO) {
选手填写部分;
}