You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
664 lines
18 KiB
664 lines
18 KiB
<template>
|
|
<view class="v-pages">
|
|
<view class="v-form v-container">
|
|
<uni-forms ref="formRef" :label-width="80" :modelValue="formData" :rules="formRules">
|
|
<view class="v-form-item">
|
|
<uni-forms-item customClass="custom-content" label="选择作物" name="productName" required>
|
|
<view @click.stop="formData.choose == true ? goSearch(1) : ''">
|
|
<uni-easyinput
|
|
:styles="styles"
|
|
:disabled="true"
|
|
v-model="formData.productName"
|
|
class="uni-mt-5 m-padding-rigt"
|
|
placeholder="请选择选择作物"
|
|
suffixIcon="right"
|
|
></uni-easyinput>
|
|
</view>
|
|
</uni-forms-item>
|
|
<uni-forms-item customClass="custom-content" label="操作人员" name="operatorName" required>
|
|
<view @click.stop="openPopupSelect">
|
|
<uni-easyinput :styles="styles" :disabled="true" v-model="formData.operatorName" class="uni-mt-5" placeholder="请选择操作人员" suffixIcon="right"></uni-easyinput>
|
|
</view>
|
|
<hy-popup-select ref="popupRef" v-model="formData.operator" :filterKeys="['nickname']" :valueKey="'id'" :list="peopleList" @save="done">
|
|
<template slot-scope="{ item, index }">
|
|
<view style="margin-top: 12rpx">
|
|
{{ item.nickname }}
|
|
</view>
|
|
</template>
|
|
</hy-popup-select>
|
|
</uni-forms-item>
|
|
<uni-forms-item customClass="custom-content" v-if="!showSave && NzList.length > 0" label="使用农资" name="agriculturalName" required>
|
|
<view @click.stop="goSearch(2)">
|
|
<uni-easyinput :styles="styles" :disabled="true" v-model="formData.agriculturalName" class="uni-mt-5" placeholder="请选择农资" suffixIcon="right"></uni-easyinput>
|
|
</view>
|
|
</uni-forms-item>
|
|
|
|
<uni-forms-item label="操作时间" name="jobTime" required customClass="custom-content">
|
|
<uni-datetime-picker ref="datetimePicker" v-model="formData.jobTime" :clear-icon="false" returnType="timestamp" type="date">
|
|
<!-- <span style="color: #666;">{{parseTime(formData.jobTime,'{y}-{m}-{d}')||'请选择操作时间'}}</span> -->
|
|
</uni-datetime-picker>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="作业方式" name="jobWay" required>
|
|
<uni-data-picker v-model="formData.jobWay" :localdata="operationWayList" class="m-data-pick" popupTitle=" "></uni-data-picker>
|
|
</uni-forms-item>
|
|
<view v-if="showSave" class="">
|
|
<uni-forms-item label="收获重量" name="production" customClass="custom-content" required>
|
|
<uni-easyinput type="digit" :styles="styles" v-model="formData.production" class="m-cj" placeholder="请输入收获重量" @blur="handlerInput($event)">
|
|
<template slot="right" class="m-kg" :class="formData.production == undefined || formData.production == '' ? 'no-mar' : ''">公斤</template>
|
|
</uni-easyinput>
|
|
</uni-forms-item>
|
|
|
|
<uni-forms-item label="质检情况" name="qualityInspection" required>
|
|
<uni-data-picker v-model="formData.qualityInspection" :localdata="qualityInspectionList" class="m-data-pick" popupTitle=" "></uni-data-picker>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="质检结论" name="qualityResult" required>
|
|
<uni-data-picker v-model="formData.qualityResult" :localdata="qualityResultList" class="m-data-pick" popupTitle=" "></uni-data-picker>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="检查结果" name="qualityImage">
|
|
<htz-image-upload
|
|
v-model="imgList1"
|
|
:action="baseUrls"
|
|
:chooseNum="1"
|
|
:compress="false"
|
|
:headers="headers"
|
|
:max="1"
|
|
:quality="80"
|
|
:remove="true"
|
|
:sourceType="['album', 'camera']"
|
|
class="m-img-upload"
|
|
mediaType="image"
|
|
@imgDelete="ceshiImgDelete($event, 1)"
|
|
@uploadFail="ceshiUploadFail($event, 1)"
|
|
@uploadSuccess="ceshiUploadSuccess1"
|
|
></htz-image-upload>
|
|
<uni-easyinput v-model="formData.qualityImage" class="not-show" placeholder=" " />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="合格证号" name="certificateNumber" required>
|
|
<uni-easyinput :styles="styles" v-model="formData.certificateNumber" placeholder="请输入合格证号"></uni-easyinput>
|
|
</uni-forms-item>
|
|
<uni-forms-item label="最后一批" name="hasNextBatch" required>
|
|
<uni-easyinput v-model="formData.hasNextBatch" class="uni-mt-5 not-show"></uni-easyinput>
|
|
<switch :checked="formData.hasNextBatch == '2' ? true : false" @change="switch2Change" />
|
|
</uni-forms-item>
|
|
</view>
|
|
<uni-forms-item label="农事照片" name="husbandryImage">
|
|
<htz-image-upload
|
|
v-model="imgList"
|
|
:action="baseUrls"
|
|
:chooseNum="5"
|
|
:compress="false"
|
|
:headers="headers"
|
|
:max="5"
|
|
:quality="80"
|
|
:remove="true"
|
|
:sourceType="['album', 'camera']"
|
|
class="m-img-upload"
|
|
mediaType="image"
|
|
@imgDelete="ceshiImgDelete"
|
|
@uploadFail="ceshiUploadFail"
|
|
@uploadSuccess="ceshiUploadSuccess"
|
|
></htz-image-upload>
|
|
<uni-easyinput v-model="formData.husbandryImage" class="not-show" placeholder=" " />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="备注" name="husbandryNotes">
|
|
<uni-easyinput :styles="styles" v-model="formData.husbandryNotes" placeholder="请输入备注" />
|
|
</uni-forms-item>
|
|
</view>
|
|
|
|
<view class="v-form-item not-show">
|
|
<uni-forms-item label="农事" name="husbandryId">
|
|
<uni-easyinput v-model="formData.husbandryId" placeholder=" " />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="农事" name="selectItems">
|
|
<uni-easyinput v-model="formData.selectItems" placeholder=" " />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="农产品" name="cropperId">
|
|
<uni-easyinput v-model="formData.cropperId" placeholder=" " />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="批次" name="batch">
|
|
<uni-easyinput v-model="formData.batch" placeholder=" " />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="农资" name="agriculturalJson">
|
|
<uni-easyinput v-model="formData.agriculturalJson" placeholder=" " />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="认证类型" name="authenticationType">
|
|
<uni-easyinput v-model="formData.authenticationType" placeholder=" " />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="操作人" name="operator">
|
|
<uni-easyinput v-model="formData.operator" placeholder=" " />
|
|
</uni-forms-item>
|
|
</view>
|
|
</uni-forms>
|
|
<view class="fixed fixedBottom">
|
|
<button class="m-t-large v-primary-btn large" @click="submitForm()">保存</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { parseTime } from '../../utils/ruoyi';
|
|
import { getJobPerson, getNzList, createRecNote, createJobNote } from '@/api/system/addNoteJob/addNoteJob.js';
|
|
import mix from '@/utils/mix.js';
|
|
import { getDictDatas, DICT_TYPE } from '@/utils/dict';
|
|
import { getAccessToken } from '@/utils/auth';
|
|
import config from '@/config';
|
|
import htzImageUpload from '@/components/htz-image-upload/htz-image-upload.vue';
|
|
import hyPopupSelect from '@/uni_modules/hy-popup-select/components/hy-popup-select/hy-popup-select';
|
|
|
|
export default {
|
|
components: {
|
|
hyPopupSelect,
|
|
htzImageUpload
|
|
},
|
|
mixins: [mix],
|
|
data() {
|
|
return {
|
|
operationWayList: [], //作业方式
|
|
qualityInspectionList: [], //质检情况
|
|
qualityResultList: [], //质检结论
|
|
peopleList: [],
|
|
NzList: [], //农资
|
|
styles: {
|
|
color: '#666'
|
|
},
|
|
|
|
showSave: false,
|
|
formData: {
|
|
id: undefined,
|
|
cropperId: undefined, //农作物ID
|
|
productName: undefined, //农作物名称
|
|
husbandryId: undefined, //农事类型
|
|
husbandryName: undefined, //农事类型
|
|
batch: undefined, //产品批次
|
|
|
|
jobWay: undefined, //作业方式
|
|
jobTime: undefined, //操作时间
|
|
operator: undefined, //操作人
|
|
operatorName: undefined, //操作人名儿
|
|
husbandryImage: undefined, //农事照片
|
|
husbandryNotes: undefined, //备注
|
|
agriculturalJson: undefined, //农资记录JSON
|
|
agriculturalName: undefined, //农资记录名称
|
|
|
|
qualityInspection: undefined, //质检情况
|
|
qualityResult: undefined, //质检结论
|
|
qualityImage: undefined, //检查结果
|
|
certificateNumber: undefined, //合格证号
|
|
production: undefined, //收获重量
|
|
hasNextBatch: '1', //是否有下一批次 1是 2否
|
|
authenticationType: undefined, //认证类型
|
|
|
|
selectItems: [], //选中的农资
|
|
choose: true
|
|
},
|
|
imgList: [],
|
|
imgList1: [],
|
|
baseUrls: config.baseUrl + config.baseApi + '/infra/file/upload',
|
|
headers: { Authorization: 'Bearer ' + getAccessToken() }, // 设置上传的请求头部
|
|
|
|
formRules: {
|
|
productName: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请选择作物'
|
|
}
|
|
]
|
|
},
|
|
agriculturalName: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请选择农资'
|
|
}
|
|
]
|
|
},
|
|
jobWay: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请选择作业方式'
|
|
}
|
|
]
|
|
},
|
|
jobTime: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请选择操作时间'
|
|
}
|
|
]
|
|
},
|
|
operatorName: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请选择操作人员'
|
|
}
|
|
]
|
|
},
|
|
production: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请输入收获量'
|
|
},
|
|
{
|
|
pattern: /^[+-]?(0|([1-9]\d*))(\.\d+)?$/,
|
|
errorMessage: '请输入正确的收获量',
|
|
trigger: 'blur'
|
|
}
|
|
]
|
|
},
|
|
qualityInspection: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请选择质检情况'
|
|
}
|
|
]
|
|
},
|
|
qualityResult: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请选择质检结论'
|
|
}
|
|
]
|
|
},
|
|
certificateNumber: {
|
|
rules: [
|
|
{
|
|
required: true,
|
|
errorMessage: '请输入合格证号'
|
|
}
|
|
]
|
|
}
|
|
}
|
|
};
|
|
},
|
|
computed: {
|
|
formDatas() {
|
|
return this.$store.state.formData; // 从Vuex中获取表单数据
|
|
}
|
|
},
|
|
onLoad(options) {
|
|
if (options.params) {
|
|
this.formData = JSON.parse(decodeURIComponent(options.params));
|
|
if (this.formData.husbandryImage == undefined) {
|
|
this.formData.hasNextBatch = '1';
|
|
}
|
|
const choo = this.formData.choose;
|
|
if (choo == undefined) {
|
|
this.formData.choose = true;
|
|
} else {
|
|
this.formData.choose = choo;
|
|
}
|
|
if (this.formData.husbandryId == 11) {
|
|
this.showSave = true;
|
|
} else {
|
|
this.showSave = false;
|
|
}
|
|
if (this.formData.husbandryImage != undefined) {
|
|
this.imgList = [];
|
|
this.imgList.push(this.formData.husbandryImage);
|
|
}
|
|
if (this.formData.qualityImage != undefined) {
|
|
this.imgList1 = [];
|
|
this.imgList1.push(this.formData.qualityImage);
|
|
}
|
|
this.getNzList(this.formData.husbandryId);
|
|
}
|
|
},
|
|
onShow() {
|
|
if (this.formDatas) {
|
|
// 使用formData更新页面状态或执行其他操作
|
|
console.log('this.formDatas', this.formDatas);
|
|
this.formData = this.formDatas;
|
|
if (this.formData.husbandryImage == undefined) {
|
|
this.formData.hasNextBatch = '1';
|
|
}
|
|
const choo = this.formData.choose;
|
|
if (choo == undefined) {
|
|
this.formData.choose = true;
|
|
} else {
|
|
this.formData.choose = choo;
|
|
}
|
|
if (this.formData.husbandryId == 11) {
|
|
this.showSave = true;
|
|
} else {
|
|
this.showSave = false;
|
|
}
|
|
if (this.formData.husbandryImage != undefined) {
|
|
this.imgList = [];
|
|
this.imgList.push(this.formData.husbandryImage);
|
|
}
|
|
if (this.formData.qualityImage != undefined) {
|
|
this.imgList1 = [];
|
|
this.imgList1.push(this.formData.qualityImage);
|
|
}
|
|
this.getNzList(this.formData.husbandryId);
|
|
}
|
|
//质检情况 OPERATION_WAY
|
|
let arr = this.getDictDatas(DICT_TYPE.QUALITY_INSPECTION);
|
|
arr.forEach((item) => {
|
|
item.text = item.label;
|
|
});
|
|
this.qualityInspectionList = arr;
|
|
//质检结论 OPERATION_WAY
|
|
let arr1 = this.getDictDatas(DICT_TYPE.QUALITY_RESULT);
|
|
arr1.forEach((item) => {
|
|
item.text = item.label;
|
|
});
|
|
this.qualityResultList = arr1;
|
|
//作业方式 OPERATION_WAY
|
|
let arr2 = this.getDictDatas(DICT_TYPE.OPERATION_WAY);
|
|
arr2.forEach((item) => {
|
|
item.text = item.label;
|
|
});
|
|
this.operationWayList = arr2;
|
|
|
|
this.getJobPerson();
|
|
},
|
|
onReady() {
|
|
// 设置自定义表单校验规则，必须在节点渲染完毕后执行
|
|
this.$refs.formRef.setRules(this.formRules);
|
|
},
|
|
onUnload() {
|
|
this.$store.commit('updateFormData', null);
|
|
},
|
|
methods: {
|
|
parseTime(time, pattern) {
|
|
return parseTime(time, pattern);
|
|
},
|
|
handlerInput(event, index) {
|
|
this.$nextTick(() => {
|
|
if (event.target.value != '') {
|
|
const num = parseFloat(event.target.value).toFixed(2);
|
|
this.formData.production = num;
|
|
this.$forceUpdate();
|
|
}
|
|
});
|
|
},
|
|
//获取操作人
|
|
getJobPerson() {
|
|
getJobPerson()
|
|
.then((res) => {
|
|
this.peopleList = res.data;
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
},
|
|
//获取农资下拉
|
|
getNzList(id) {
|
|
getNzList(id)
|
|
.then((res) => {
|
|
this.NzList = res.data;
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
},
|
|
goSearch(num) {
|
|
console.log(this.formData);
|
|
const val = encodeURIComponent(JSON.stringify(this.formData));
|
|
if (num == 1) {
|
|
uni.navigateTo({
|
|
url: '/sunPages/commonSearch/proSearch?params=' + val
|
|
});
|
|
}
|
|
if (num == 2) {
|
|
uni.navigateTo({
|
|
url: '/sunPages/commonSearch/nzSearch?params=' + val
|
|
});
|
|
}
|
|
},
|
|
|
|
ceshiUploadSuccess(res) {
|
|
//上传成功
|
|
var _res = JSON.parse(res.data);
|
|
console.log('_res', _res);
|
|
if (_res.code == 0) {
|
|
this.imgList.push(_res.data);
|
|
this.formData.husbandryImage = _res.data;
|
|
}
|
|
},
|
|
ceshiUploadSuccess1(res) {
|
|
//上传成功
|
|
var _res = JSON.parse(res.data);
|
|
console.log('_res', _res);
|
|
if (_res.code == 0) {
|
|
this.imgList1.push(_res.data);
|
|
this.formData.qualityImage = _res.data;
|
|
}
|
|
},
|
|
ceshiImgDelete(e, num) {
|
|
console.log('ceshiImgDelete', e);
|
|
},
|
|
ceshiUploadFail(err) {
|
|
//上传失败
|
|
console.log('err', err);
|
|
},
|
|
// 打开单选弹窗
|
|
openPopupSelect() {
|
|
console.log('openPopupSelect');
|
|
this.$refs.popupRef.open();
|
|
},
|
|
// 单选选中确认事件
|
|
done(ids, arr) {
|
|
this.formData.operator = arr[0].id;
|
|
this.formData.operatorName = arr[0].nickname;
|
|
},
|
|
reset() {
|
|
this.formData = {
|
|
id: undefined,
|
|
cropperId: undefined, //农作物ID
|
|
productName: undefined, //农作物名称
|
|
husbandryId: undefined, //农事类型
|
|
husbandryName: undefined, //农事类型
|
|
batch: undefined, //产品批次
|
|
|
|
jobWay: undefined, //作业方式
|
|
jobTime: undefined, //操作时间
|
|
operator: undefined, //操作人
|
|
operatorName: undefined, //操作人名儿
|
|
husbandryImage: undefined, //农事照片
|
|
husbandryNotes: undefined, //备注
|
|
agriculturalJson: undefined, //农资记录JSON
|
|
agriculturalName: undefined, //农资记录名称
|
|
|
|
qualityInspection: undefined, //质检情况
|
|
qualityResult: undefined, //质检结论
|
|
qualityImage: undefined, //检查结果
|
|
certificateNumber: undefined, //合格证号
|
|
production: undefined, //收获重量
|
|
hasNextBatch: '1', //是否有下一批次 1是 2否
|
|
authenticationType: undefined, //认证类型
|
|
|
|
selectItems: [], //选中的农资
|
|
choose: true
|
|
};
|
|
this.NzList = [];
|
|
},
|
|
switch2Change: function (e) {
|
|
console.log('switch2 发生 change 事件，携带值为', e.detail.value);
|
|
if (e.detail.value == true) {
|
|
this.formData.hasNextBatch = '2';
|
|
} else {
|
|
this.formData.hasNextBatch = '1';
|
|
}
|
|
console.log(this.formData);
|
|
},
|
|
submitForm() {
|
|
console.log(this.formData);
|
|
let canUp = true;
|
|
if (this.NzList.length > 0) {
|
|
if (!this.formData.selectItems || this.formData.selectItems.length === 0) {
|
|
canUp = false;
|
|
} else {
|
|
canUp = true;
|
|
}
|
|
} else {
|
|
canUp = true;
|
|
}
|
|
if (!canUp) {
|
|
uni.showToast({
|
|
icon: 'none',
|
|
title: '请选择农资'
|
|
});
|
|
return false;
|
|
}
|
|
let that = this;
|
|
this.$refs['formRef']
|
|
.validate()
|
|
.then((res) => {
|
|
console.log('success', res);
|
|
if (res.husbandryId == 11) {
|
|
createRecNote(res)
|
|
.then((res) => {
|
|
uni.showToast({
|
|
title: `新增成功`,
|
|
duration: 1500,
|
|
success() {
|
|
setTimeout(() => {
|
|
that.reset();
|
|
uni.reLaunch({
|
|
url: '/pages/index'
|
|
});
|
|
}, 1500);
|
|
}
|
|
});
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
} else {
|
|
createJobNote(res)
|
|
.then((res) => {
|
|
uni.showToast({
|
|
title: `新增成功`,
|
|
duration: 1500,
|
|
success() {
|
|
setTimeout(() => {
|
|
that.reset();
|
|
uni.reLaunch({
|
|
url: '/pages/index'
|
|
});
|
|
}, 1500);
|
|
}
|
|
});
|
|
})
|
|
.catch((err) => {
|
|
console.log(err);
|
|
});
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
console.log('err', err);
|
|
});
|
|
}
|
|
}
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.v-pages {
|
|
padding-bottom: 150rpx;
|
|
}
|
|
|
|
.not-show {
|
|
display: none;
|
|
}
|
|
|
|
/deep/ .m-img-upload .htz-image-upload-list {
|
|
flex-direction: row-reverse;
|
|
|
|
.htz-image-upload-Item-add {
|
|
line-height: 130rpx;
|
|
}
|
|
}
|
|
/deep/ .uni-mt-5 .is-disabled {
|
|
background-color: #fff !important;
|
|
color: #333 !important;
|
|
}
|
|
.v-form .uni-forms-item__content [class*='icon-'] {
|
|
right: 0 !important;
|
|
}
|
|
.m-t-large {
|
|
margin-top: 20rpx;
|
|
width: 650rpx;
|
|
height: 80rpx;
|
|
border-radius: 50rpx;
|
|
color: #fff;
|
|
line-height: 80rpx;
|
|
position: fixed;
|
|
left: 50%;
|
|
transform: translateX(-50%);
|
|
bottom: 55rpx;
|
|
z-index: 97;
|
|
}
|
|
.v-form {
|
|
/deep/ .uni-forms-item__content {
|
|
padding-right: 0;
|
|
[class*='icon-'] {
|
|
right: 0 !important;
|
|
}
|
|
}
|
|
}
|
|
/deep/ .m-cj .uni-easyinput__content-input {
|
|
z-index: 5;
|
|
padding-right: 0 !important;
|
|
}
|
|
.m-kg {
|
|
background: #eee;
|
|
padding: 0 11rpx;
|
|
border-radius: 15rpx;
|
|
margin-right: 55rpx;
|
|
color: #929292;
|
|
font-size: 20rpx;
|
|
height: 55rpx;
|
|
line-height: 55rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
.no-mar {
|
|
margin-right: 0;
|
|
}
|
|
/deep/ .m-padding-rigt .uni-easyinput__content-input {
|
|
padding-right: 25rpx;
|
|
}
|
|
|
|
/deep/ .m-data-pick .selected-area {
|
|
padding-right: 35rpx;
|
|
}
|
|
/deep/ .m-data-pick .placeholder {
|
|
padding-right: 0 !important;
|
|
}
|
|
/deep/ .custom-content .uni-forms-item__content {
|
|
padding-right: 0;
|
|
}
|
|
/deep/ .custom-content .uni-easyinput__content-input {
|
|
color: #666 !important;
|
|
}
|
|
/deep/ .custom-content .uni-date__x-input {
|
|
font-size: 28rpx;
|
|
color: #666;
|
|
}
|
|
.v-form-item /deep/ .input-placeholder {
|
|
color: #666 !important;
|
|
font-size: 28rpx !important;
|
|
}
|
|
/deep/.v-form .search-input .is-input-border {
|
|
border: 1px solid #e5e5e5 !important;
|
|
position: relative;
|
|
|
|
.content-clear-icon {
|
|
}
|
|
}
|
|
.cnstom-input {
|
|
padding-right: 20rpx;
|
|
color: #666;
|
|
font-size: 28rpx;
|
|
}
|
|
</style>
|
|
|